Demo – Vertical Template

Message above like buttons

Message above buttons

At all the personal messages in this section may be used %%title%% and %%permalink%% to include the title of the post/article or its address. You just have to paste this code variables without any changes where you want to have the relevant element available.

Message before share buttons – write in the field custom text that you want to display before the share buttons. Note that in this position it is not very proper to display long text, because it will lap over the buttons

Message above share buttons – write in the field custom text that you want to display above the share buttons. The content here can be as long as you wish. The only thing you have to weigh in mind is your page layout and the empty space above the buttons.

Message above like buttons – write in the field custom text that you want to display above the like buttons.

Button Position: Like buttons bottom

Advanced Display Settings by Button Position

Activate custom button position settings – tick off this option to allow customizing the button’s display depends on its possition

Button Position: Bottom of content

Display only those buttons for this button position – choose from the list the buttons that you wish to appear only for Bottom of content buttons

Template – choose from the list template available only for Bottom of content buttons

Full width share buttons – choose whether to activate full width for Bottom of content buttons.
IMPORTANT!    Activating this option will make your buttons to take all the width of your working window. The width of buttons depends on their count – when you have a few buttons width will be greater than when you have more active buttons.

Full width share buttons width correction – write number between 1 and 100 in percents to correct the width of the button itself. For example if the buttons displayed are more and are too close each other write here small percentage number (50) to make them smaller and fit in the window width. And the opposite, if the buttons are fewer and the space between them is big, fill in here number close to 100. This will make them locate closer each other.

Hide Network Names – choose if the network names to be hidden or not

Counters Position – choose from the list where the counters to be located

Total Counter Position – choose position for the total counter

Rename displayed texts for network names – use this option to customize the text for every button that will appear instead of the network name. You can use this to translate network names on your language.

For all other button positions Top of contentFloat from contentWindow sidebarPopupLike buttons top, Share buttons bottomShare buttons top, Like buttons bottomPost vertical float barContent Inline and Flyin Panel the buttons can be set with exactly the same options.

like buttons with shortcode

Shortcode Generator [ easy-social-like ] Shortcode

If you want to add with shortcode social native buttons, press on the second button upon Shordcode Generator

Screenshot_5

Then on the screen will be loaded the specific options you need to fill in to get the shortcode you need

FACEBOOK LIKE BUTTON

Include Facebook Like Button – tick off if you want to display Facebook like button with this shortcode

Facebook Like Button URL – paste here the url of your Facebook page

Width of button – write here a number to fix if the button is hidden on half. This option is used to make correction when you had already get your shortcode and you can see this issue with the button display. Depends on the WordPress theme and the language used this number will be different. So to get the number you need just get a try, there is no other way to hit it.

Skinned button text overlay – write here a text that will be visible, when Skinned Native Buttons is activated (the option is at the bottom of the option page). This text will be visible on the screen and on hover will display the Like button. For example you can write here Like Us and on the page where you implement the shortcode this text will be visible. When you position the cursor on it Facebook Like button will display.

Skinned button width – write here a number to set custom Facebook Like button width, when Skinned Native Buttons are activated (at the bottom of this option page). Correction would be necessary if on your language the text you set do not fit on the button. The width by default is 80 px.

All the settings for FACEBOOK FOLLOW BUTTONTWITTER FOLLOW BUTTONTWITTER TWEET BUTTONGOOGLE +1 BUTTONGOOGLE FOLLOW  BUTTON, YOUTUBE CHANNEL SUBSCRIBE,  PINTEREST PIN BUTTONPINTEREST FOLLOW BUTTON are almost the same as described above. The differences  with minor and depends on every network features.

VISUAL OPTIONS

Skinned Native Buttons – tick off this option to activate Skinned Native Buttons.
IMPORTANT!    All the settings for native buttons made at the field above will work ONLY if this option is turned on

Skin – choose template for the native buttons

Counters for Native Buttons – tick off to activate counters for the buttons, displayed with this shortcode

Align – choose alignment for the buttons, displayed with this shortcode

When you finish with your settings click on Generate Shortcode. You will get three codes:

Screenshot_4

1. The first code will help you to display native buttons anywhere on your site. Implement the shortcode with copy/paste at the Edit Post Page of the page where you would like to display the buttons with this shortcode.

2. The second code will help you to add the shortcode at your WordPress theme. Insert this code into the template where you wish the buttons with this shortcode to be displayed.
For example if you paste this shortcode into footer template file the buttons set with this code will display only there. If you paste this shortcode into posts template file the buttons will display on each page marked as post page type.

3. The last two codes will help you to put the current post/page title and permalink (the full address of the post) into your shortcode. You may need this codes when you have native buttons added with shortcode to any post list (as resent posts for example) and you want Like or Follow action to refer the url of the article itself (not the url of the all post list).

IMPORTANT!    It’s important to say that these codes are not very useful in the native buttons situation. The reason is that the native buttons add too much code to particular page and this would overload the page. So if the loading speed is important thing for you, it is not recommending to set your native buttons shortcode that way.

But if you would like your native buttons work like described above, follow these instructions:

Paste $url = get_permalink($post->ID); or $title= get_the_title($post->ID); or both of them. Then get your second code (2.) and paste url=”‘.$url.'” or title=”‘.$title.'” (or both of them) before the last square bracket ( ] ). If we use the example from the picture, your code should look something like this:

To set by shortcode Like button (and its equivalents for other networks) to refer to the article address, when this article is part of any list

Screenshot_11

The shortcode below is necessary to be used only when you want the title of the article to be part of the native social action, when this article is part of any list. The only situation that the article’s title is part of the native social action is Tweeter Tweet Message for now.

Screenshot_12

The last example is useful when you want to set by shortcode Like button (and its equivalents for other networks) to refer to the article address and the title of the same article to be part of Twitter Tweet Message, when this article is part of any list

Screenshot_13

Insert this code into the template, where you wish the native buttons with this shortcode to be displayed.

For more detailed information how to use 3. codes please have a look at the end of this article.

Like button

Social Like, Follow and Subscribe Buttons

Display on same line – share buttons and native social network buttons will be on same line

Apply native buttons skin – This option will hide native buttons inside nice flat style boxes and show them on hover

Native buttons skin – choose Flat or Metro skin for  native buttons. It will be applied only when option above is activated

Display counters for native buttons – activate this option to display counters for native buttons

Drag and Drop change position of display – change the order of native button display whit drag and drop

Activate social privacy – This option is connected with the privacy of personal information of the users. Activating this option no information is shared without user’s permitting it. If you activate this option the native buttons will display like this.

Facebook Like/Follow Button

Facebook Like/Follow Button

  • Include Facebook Like/Follow Button – tick off if you want to activate Facebook Like button;
  • My site already uses Facebook Api – tick off if you already use Facebook Api with another plugin;
  • Load Facebook API asynchronous – it’s recommended to tick off this to avoid site load slow down.

If you have visualization issue use the field below to fix it:

  • First field – for width correction. First try with 100 and depends on result increase or reduce the number to fit the output.
  • Second field – for height correction.
  • Third field – to move up the button higher and line all native buttons.

Facebook Like/Follow button type – choose between Like and Follow button type:

  • Like – users can like content from particular post/page
  • Follow – users can follow your Facebook page

Facebook Follow Profile Page URL – paste the URL of your Facebook profile to ensure Facebook follow function

Skinned button color replace – you can choose custom color for Facebook Like button from the palette

Skinned button hover color replace –  you can choose custom hover color from the palette

Skinned button text color replace – you can choose custom text color from the palette

Skinned button width replace – Use this field if after customizing social button don’t display full. Standard width is 80 px.

Skinned button text replace – use to customize button text;

Privacy button text – tape here the text displayed when switch on Activate social privacy option. This text is visible when the button is not pushed from the user.

Privacy button width replace – use when the privacy text is not display full.

Google +1/Follow Button

Google Plus/Follow Button – tick off if you want to display Google+ Button

Google Plus/Follow button type – choose the type of the button – plus or follow

Google+ Profile Page URL – paste here the address of your Google+ profile page

Skinned button color replace – you can choose custom color for G+ button from the palette

Skinned button hover color replace – you can choose custom hover color from the palette

Skinned button text color replace – you can choose custom text color from the palette

Skinned button width replace – use this field if after customizing social button don’t display full. Standard width is 80 px.

Skinned button text replace – use to customize button text;

Privacy button text – tape here the text displayed when switch on Activate social privacy option. This text is visible when the button is not pushed from the user.

Privacy button width replace – use when the privacy text is not display full.

VKontankte (vk.com) Like

VKontakte (vk.com) Like Button – tick off if you want to display VKontakte Like button

VKontakte (vk.com) Application ID – paste here your VKontakte Application ID. To get your ID go to http://vk.com/dev.php?method=Like

Skinned button color replace – you can choose custom color for the button from the palette

Skinned button hover color replace – you can choose custom hover color from the palette

Skinned button text color replace – you can choose custom text color from the palette

Skinned button width replace – use this field if after customizing social button don’t display full. Standard width is 80 px.

Skinned button text replace – use to customize button text;

Privacy button text – tape here the text displayed when switch on Activate social privacy option. This text is visible when the button is not pushed from the user.

Privacy button width replace – use when the privacy text is not display full.

Twitter Tweet/Follow

Twitter Tweet/Follow Button – tick off if you want to display Twitter Tweet/Follow Button

Twitter Button Type – choose the type of the Twitter button you want to display – follow or tweet

Twitter Follow User – type here your username without @ in front

Skinned button color replace – you can choose custom color for the button from the palette

Skinned button hover color replace – you can choose custom hover color from the palette

Skinned button text color replace – you can choose custom text color from the palette

Skinned button width replace – use this field if after customizing social button don’t display full. Standard width is 80 px.

Skinned button text replace – use to customize button text;

Privacy button text – tape here the text displayed when switch on Activate social privacy option. This text is visible when the button is not pushed from the user.

Privacy button width replace – use when the privacy text is not display full.

YouTube Subscribe

YouTube Subscribe – tick off if you want to display YouTube Subscribe button

Channel Name – paste here your channel name

Skinned button color replace – you can choose custom color for the button from the palette

Skinned button hover color replace – you can choose custom hover color from the palette

Skinned button text color replace – you can choose custom text color from the palette

Skinned button width replace – use this field if after customizing social button don’t display full. Standard width is 80 px.

Skinned button text replace – use to customize button text;

Privacy button text – tape here the text displayed when switch on Activate social privacy option. This text is visible when the button is not pushed from the user.

Privacy button width replace – use when the privacy text is not display full.

Pinterest Follow/Pin

Pinterest Follow/Pin Buttons – tich off if you want to display Pinterest Follow/Pin

Pinterest Button Type – choose the type of the button – follow or pin

Display name on button – here you can write the text displayed on the Pinterest follow button

Pinterest User URL – paste here your Pinterest profile URL

Skinned button color replace – you can choose custom color for the button from the palette

Skinned button hover color replace – you can choose custom hover color from the palette

Skinned button text color replace – you can choose custom text color from the palette

Skinned button width replace – use this field if after customizing social button don’t display full. Standard width is 80 px.

Skinned button text replace – use to customize button text;

Privacy button text – tape here the text displayed when switch on Activate social privacy option. This text is visible when the button is not pushed from the user.

Privacy button width replace – use when the privacy text is not display full.

LikendIn Company Follow

LinkedIn Follow – tick off if you want to display LinkedIn Follow button

LinkedIn Company ID – paste here your LinkedIn Company ID.

Skinned button color replace – you can choose custom color for the button from the palette

Skinned button hover color replace – you can choose custom hover color from the palette

Skinned button text color replace – you can choose custom text color from the palette

Skinned button width replace – use this field if after customizing social button don’t display full. Standard width is 80 px.

Skinned button text replace – use to customize button text;

Privacy button text – tape here the text displayed when switch on Activate social privacy option. This text is visible when the button is not pushed from the user.

Privacy button width replace – use when the privacy text is not display full.

ManagedWP.org Upvote Button

Activate ManagedWP.org upvote button – tick off to activate upvote button

Activate Custom Like Address

This option will make your Like button share custom page. For example your Facebook profile.

Address for Facebook Like Button – paste here the address you want to share on Google+ when activate Custom like address

Address for Google +1 Button – paste here the address you want to share on Google+ when activate Custom like address 

Top