Share the article on social networks. Yandex social media buttons share

Attention! The Twitter button will no longer display the post count - Twitter no longer supports the post count API.

• first - button at the bottom of the list;
• last - button at the top of the list;
• hidden - the button is not displayed.

Default value: last.

Default value: ru.

Default value: m.

By default, the title of the page on which the block is located is indicated.

date 28.12.2010

List of supported services

1. Blogger;
2. Digg;
3. Evernote;
4. delicious;
5. facebook;
6. FriendFeed;
7. Google Buzz
8. Google Reader;
9. Juick;
10. LinkedIn;
11. Livejournal;
12. My Circle;
13. My world;
14. MySpace;
15. Odnoklassniki.ru;
16. Twitter;
17. In contact with;
18. Ya.Ru;
19. Yandex.Bookmarks.

Design customization and optimization of external links

I would like to add something. But I don't know how :(. Can someone tell me?

UPD: Resourceful Georg suggested a solution to this issue in the comments :).

Hello dear readers of the blog site. As you probably already guessed from the title, we will talk about the so-called social buttons, which can very seriously help articles on your site to attract, with a successful coincidence and high quality the article itself, a large number of visitors from social networks and services.

Social signals are also taken into account search engines when ranking your site. A large number of shares in high-quality accounts on Twitter, Google+, Facebook (it is possible that Vkontakte and other networks are also taken into account) can allow you to climb a certain number of steps higher and, possibly, enter the Top and stay there if behavioral factors do not disappoint.

In general, services that provide scripts (buttons) for sharing content in social networks there are a lot on the Internet, but not all of them are worth trusting (easily or somehow you can be used in a bad way). And they are able to simply "hang up the site" if their code is not very competently placed and their servers are not very powerful computational capabilities. Although there are decent options free of these shortcomings, and I have listed them at the end of this publication.

It is also possible displaying the number of shares on the buttons to a separate social network. Moreover, all posts are taken into account, and not only those that were made using this block (data is loaded via API). True, not all social networks are supported (only facebook, Google+, Moy Mir, Odnoklassniki.ru, VKontakte), but most of the main ones. It is sad that Twitter was recently removed from this list because he stopped providing this data via API.

For example, here you can shorten titles for uploading to Twitter, because there is a limitation on their length (read how to do this below), set up the display or not display of share counters, set the directions for expanding the menu with additional buttons social networks and much more. In general, dig in and take a look.

In general, in comparison with the native share buttons, which offer to install social networks themselves on the site (read about this below), the Yandex block wins in download speed, compactness and ease of installation and configuration. For example, before, the official Twitter button often did not load because of problems with their server, so the script made on Java was not loaded due to a debt. left menu my blog. It is possible that this problem has now been resolved, but many scripts will always be worse than one in terms of optimizing website loading speed.

Yandex, I think, is unlikely to have problems with accessibility, because it is a well-earning commercial organization that is quite sensitive to its image. In addition, if you have, then you can track statistics of clicks on these buttons, which may be useful.

In addition to the block with regular-sized icons, you can make a block with counters, and Yandex also offers add dropdown menu with additional social networks, which will hide under a spoiler located after displaying the required number of buttons for the main social networks (such as Vkontakte, MoiMir,):

If you want add counters to the buttons in this block (with a drop-down menu), then just on the site insert another attribute to its code (between the Div tags): data-counter = "" and that's it. As I said, it's nowhere easier. Counters can be added to small buttons, which are discussed below:

Data-services = "vkontakte, odnoklassniki, facebook, gplus, twitter, moimir, blogger, digg, reddit, linkedin, lj"

You can also replace all icons with theirs reduced thumbnails of buttons, which personally came in handy for me when inserting a block at the top of all articles on this blog:

In the first part in the opening and closing SCRIPT tags the path to the script that will be loaded from the Yandex server is shown, and the second part contains the embed code itself, which will need to be placed in the place of your template where this block should be displayed.

How to insert social buttons from Yandex into a website

Therefore, I insert the script calling code along with the Div blocks in the place where you want to display the social media buttons. Well, so that its loading does not affect the loading speed of the main page, following the advice given in the Yandex documentation, I added the async = "async" attribute to it, thereby initiating it asynchronous script loading:

The problem may arise in order to find among the many files of the engine of your site the one that is responsible for the formation of the very bottom part Html code with the closing tag / BODY or the one that forms the Head. And also find a place in the skin files where you need to insert a code snippet in the Div tags (for placing the buttons themselves).

In principle, both in WordPress and in Joomla, this is done in one of the files of the used design theme. Because This blog is powered by Vorpress, then I will say for him.

If you are working with WordPress, then to insert the code for calling the script, you need to open the file footer.php for editing (there you will find the closing Body tag or header.php (there you will find the Head tags) from the folder:

/wp-content/themes/folder_name_with_used_theme_of_themes/footer.php

Now all you have to do is insert the second part of the code of Yandex social buttons, which is responsible for the location of the block with buttons on the pages of the site, in the right place of your site template, or directly into the article:

By the way, I'll make a reservation again if you want remove any button from this block, it is not necessary to go to the constructor again on the Yandex website. You can simply remove its entry from this list (together with a comma following it, for example, "vkontakte,"). Well, you get the idea ...

Well, you can also change the positioning of buttons inside the block using CSS.

Li.ya-share2__item (background: none! Important; padding: 0 7px 0 7px! Important;)

Because I have an adaptive pod mobile devices layout, then I added a similar line for devices with a low screen resolution, where I set slightly smaller indents, but these are details:

Li.ya-share2__item (padding: 0 3px 0 3px! Important;)

Above the article, I just pasted the second part of the code with small buttons, without having to call the script again (once per page will be enough):

You've probably noticed the following construction in the given code:

Data-title: twitter = ""

What is it? The thing is, my long titles have always called problems adding messages to Twitter, so I used to have to put the original button from this social network and modify it a little, as shown below. Now Yandex developers have made a semi-automatic cutting of the message sent to Twitter (it was automatic before). Those. I add the data-title: twitter attribute to the code, where inside I place a construction that is responsible for trimming the title (article title) to the length that Twitter needs.

This is done using a function from the folder with your theme - the function itself is given by the link and looks something like this:

Function trim_title_chars ($ count, $ after) ($ title = get_the_title (); if (mb_strlen ($ title)> $ count) $ title = mb_substr ($ title, 0, $ count); else $ after = ""; echo $ title. $ after;)

In general, somewhere so in that aspect, as for my blog on WordPress. In Joomla, to insert this block, it is probably easiest to use the Custom Html code module, placing it in the template position somewhere immediately below the article text.

Official social media buttons

Many social networks themselves provide everyone with the opportunity to download the code of the button, and often at the same time you can even customize its appearance and functionality. you, for example, will be able to configure and get the script code for sharing a post in.

There are quite a few settings, as you can see, and in addition to the appearance of the Vkontakte button, you can also customize the display of a counter showing the number of shares.

Button Facebook can be obtained. It is very flexible to fit your needs, and do not be confused by the English inscriptions on it, because when you place its code on your site, the inscriptions will automatically be translated into Russian.

It is better not to insert anything into the field with the url, then the page on which this code is located will be shared.

It will look something like this:

It will look something like this:

And, of course, I can't help but mention official Twitter button, which appeared relatively recently. Its constructor is located

Now there are many different services that help us to place sharing buttons on our sites. But as you know, all power is in the primary source. And if we want to receive search traffic from Yandex, then we need to contact him.

Let's face it, because we put the sharing buttons not to get traffic from social networks, but mainly to get external links, faster indexing of the article and, as a result, bring it to the TOP. This is the whole secret. But then why use third-party services? You can just take the code you need from Yandex itself and place great social media buttons on your blog.

Also, I saw that in all old articles the number of likes is also displayed, that is, Yandex remembers everything and takes into account all links. But that's not all, this block is synchronized with Yandex. Metrica and you can see detailed information in your account. This is how it looks to me.

This is not the whole screen. In your account you can see more detailed information and the exact number of likes from all social networks. And since all this is in the metric, it is clear that Yandex robots instantly receive a signal from our site and all this has a positive effect on indexing and on promotion in general. Well, let's not go too deep, I have already told you a lot, I hope that you have taken this information into account.

The main thing is that this block is very useful. Yandex likes when its services are used at work, and this is a fact. This fact has already been proven and was repeatedly mentioned at recent seo conferences, which was partially confirmed by Yandex itself (in one of the recent articles I did). Based on this, it becomes clear that there is no need to use various services, but it is better to contact Yandex itself.

In general, it's understandable why I got social buttons from Yandex. Well, now let's see where to get this block of sharing buttons and how to put it on your site.

The necessary networks should be marked with checkmarks.

Here you will find the actual code for placement on the site and see how it all will look. You can also customize the look and choose "icons only" or other options. I chose Counters.

In principle, that's all. You just have to place this code in the right place, that is, where the social buttons should be displayed on your blog. Attention! To place the code, you need to understand the basic principles and know how to work with the code of your site. By the way, I already wrote on the blog about social buttons and even posted a tutorial on how to insert the required code into your website. The principle is the same, and if you don't know how to work with the code and you have WordPress, then you can.

Hello everyone. If you noticed, then floating buttons of social networks appeared on my pages (classmates, in contact, twitter, facebook and others), which are located vertically on the left, and today I will tell you how I managed to install them on the site.

Not so long ago, I started promoting a blog through social networks and the first thing I did was to rush to install social media buttons that help visitors to share a link to an article with friends on social networks.

Their meaning is as follows. If your article is very interesting and useful for the visitor, he will want to tell other people about it.

By choosing from the buttons the social network in which he is registered (currently, each person has a profile created not even in one social network), making one click on the button and a link in the form of a title to the article will be placed in the visitor's account.

What you end up with:

1) The link mass of the site is increasing, which will have a positive effect on the ranking of the site's pages in the search engine results.

2) You receive.

3) Growth of TIC indicators - thematic citation index and PR - page rank.

How to create social media buttons

A large number of services have appeared on the network providing such a service. I have selected only two of them that I have used and recommend to others.

Share42.com

Thanks to Dimox, the most popular blogger, there is a great service Share42.com. It is so easy to use that even a schoolchild can use it to install social media buttons on the site.

First. Go to the site Share42.com... Next, choose what size the button icons will be 32 × 32, 24 × 24 or 16 × 16.

Now click on the buttons that will be added to your site. You can call at least 20 pieces. I chose the most basic classmates, vkontakte, twitter, facebook.

Don't forget about the buttons from the "Other" tab. They will help you style or bookmark your page.

Second. Now configure the options you need for yourself and choose the horizontal or vertical placement of the buttons.

If a lot of social networks have been selected, then you can limit their display by specifying the required number of buttons to display.

We set the site encoding to UTF-8. We select the language of the prompts for the icons "Russian". If you want to add an icon for the Share42.com site, then put a tick in front of it.

Third. Now you can view the test result of displaying social media buttons, and then download the archive with the script.

Fourth. The hardest part is getting the script to work on the blog. Unpack the previously downloaded script on your computer. Using the FTP manager, upload the share42 folder to.

For my convenience, I created a separate folder in the root of the blog files file and uploaded the folder share42 exactly there.

This is the address to the folder:

http: // site / file / share42

Since I'm making social buttons for wordpress, so I chose the site type from the list: wordpress.

In the meantime, the generator has generated a script that must be inserted in the place where the voting icons will be displayed.

I use vertical buttons, so I paste the resulting code into the file footer.php before the closing tag .

Those who will make a horizontal block of buttons, I recommend to insert the resulting script into the file single.php anywhere you want to see them.

The last step will only be to style the site's social icons. To do this, you can upload my code or use your own.

# share42 (left: 0px; margin-top: -180px; opacity: 1; padding: 6px 6px 0px; position: fixed; top: 50%! important;) # share42: hover (opacity: 0.85;)

Don't forget to refresh the page. Only after several dozen experiments can an excellent result be achieved, which will be beautifully combined with the design of the site.

That's all. If you have any questions or suggestions, I will definitely listen to you and try to help. Bye everyone, see you again.

Greetings! So I sometimes wonder, why put social media buttons at the end of every post? What is the point in them? Maybe, in fact, there is no use in them, and their significance is exaggerated?

Once I already wrote about placing buttons on blog pages. But he did not mention the benefits of this action, he only emphasized that by keeping the page in social bookmarks, the chances of speeding up indexing increase significantly.

Why are buttons needed

• The first has already been mentioned - indexing by search engines is not long in coming;
• Secondly, even if only you save links in social networks, there will certainly be some curious ones. They will look, they will say yes, there is something interesting here, they will follow the link and may be interested.

  Thus, you can find small traffic, and if the visitor also saves the link himself, but already in his profile, then the traffic can increase significantly. Subsequently, a visitor who has dropped in for the sake of curiosity can grow into a potential regular reader, for example, by subscribing to an RSS feed. Who knows, maybe in the future he will become a worthy partner or vice versa;

• Thirdly, for sure you, as well as the majority, are struggling to get backlinks. And it is desirable that external sites link not only to the main page, as is often the case, but also to internal ones - search engines love this. And social media buttons give us that opportunity!

  Another thing is that not all links from such sites are indexed. Yandex, for example, if you go back to social bookmarks, have filters for some of the services. However, quite recently he began to index the largest social network of the Russian Internet "VKontakte" - who knows, perhaps in the future ...

I have already drawn my conclusions and I think that social media buttons are needed on a blog, albeit with one BUT: they can bring significant benefits only at the stage of blog formation. Well-promoted blogs are unlikely to need this. What do you think?

Here is a list of services that are offered to be selected at your discretion by ticking the box:

In the same window on the right, the generated code is displayed, depending on the previous selection, which will need to be inserted on the blog pages. For example, at the end of every post.

Yandex relatively recently began to provide webmasters with such an opportunity in the form of buttons for the main social services, but they can already be seen on a fairly large number of blogs. This again speaks of the popularity of social networks.