Inside this article, you will learn how to use create your button without being a coder. This is a unique feature of Easy Social Share Buttons for WordPress. That custom button can be a social network or any type of link (like call us). In the end you will find how you can add Baidu.
Easy Social Share Buttons for WordPress include support for 50+ of the most popular social networks and mobile messengers. You can find of the box:
- Facebook Like
- Buffer
- Mix
- Digg
- Del
- Tumblr
- Vkontakte
- Flattr
- Odnoklassniki
- ManageWP.org
- Meneame
- Blogger
- Amazon
- Yahoo Mail
- Gmail
- AOL
- Newsvine
- HackerNews
- Evernote
- MySpace
- Mail.ru
- Viadeo
- Line
- Yummly
- SMS
- Viber
- Telegram
- Skype
- Facebook Messenger
- Kakao
- LiveJournal
- Yammer
- Edgar
- Fintel
- Instapaper
- Hatena
- Douban
- Tencent QQ
- Naver
- Renren
- Love
- Comments
- Subscribe
- Copy Link
But even with such a huge amount of supported networks you still may need such, that is not on the list. Most of the social network plugins for WordPress that are available on the market (free or paid) do not provide the option to add your network or if so this requires having an advanced code knowledge to create the button you need.
Easy Social Share Buttons Add a Unique Method of How You Can Add Custom Buttons to The Network List
And that can be not just a social network. You can add any type of button to the list – for example, contact us button, link to portfolio, call now button, etc.
Meet the unique custom button builder – simple, visual, and easy! With a few clicks inside the plugin settings, you can add the button you need. This button will automatically appear in the list of available buttons and you can use it anywhere on the website. As you don’t modify any code the button you add will remain the same even when you update the plugin. No coding knowledge is required!
Interested? See how easy is to work with the button builder.
Before starting ensure that the Custom Share Buttons option is enabled inside the settings.
Here is how you can add an example new network. This practical guide will include Baidu as a share button.
- Choose “Network ID” – the ID should be unique for the list of networks. Use only lowercase Latin symbols (a-z) and numbers (0-9). No spaces are allowed – use underscore.
- Set Name – this will be the text you will see in the list of networks. It will also be the text that will appear when you add a button initially (without modifications). Try to keep it short.
- Button URL – the URL can be a share command but it also can be a plain URL where you wish to direct your visitors. If you are filling share command than you should fill at the proper places the variables representing sharable content: %%title%%, %%image%%, %%permalink%%, %%description%%.
- Enable internal share counter – the option will enable support for the internal share counter. To show the counter on your site you need to have the internal counter option active (in Share Counter Setup) and you are using a design with share values.
- SVG Icon – place the content of an SVG icon that will be used to show the buttons. To do this prepare a flat color SVG icon (or download such from a collection). Open that file with a text editor and copy content inside the field. A free source of icons is https://flaticon.com. You can download the SVG file and copy its content opening with any text editor.
Those five options were the required you need to add the button. The other options are optional and you can use to adjust the button appearance:
- Icon top & left padding – you can use those fields to modify the position of the icon inside the button. The plugin automatically sets a default value. In the field, you can set a numeric value.
- Colors – you can set the default button colors for background, text, and icon.
- Colors on hover – the same values but when you position over the button. If you did not add value the default from the theme will be used.
And that is all. No coding is needed. The plugin will do everything else. And that network will remain inside the list even after plugin updates. You can edit it at any time or even remove it.
How to Add the Baidu Share Button Using Custom Share Button Feature
- Network ID – baidu
- Name – Baidu
- Button URL – http://cang.baidu.com/do/add?iu=%%permalink%%&it=%%title%%
- Enable internal share counter – depends on do you wish to have internal counter or not.
- SVG Icon
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve"> <style type="text/css"> .st0{fill:#FFFFFF;} </style> <g> <g> <path class="st0" d="M358.1,10.7c-31.2-8-65.3,19.8-76,62.1c-10.8,42.3,5.8,83,37.1,91c31.2,8,65.3-19.8,76-62.1 C409.1,46.6,365.6,12.5,358.1,10.7z"/> </g> </g> <g> <g> <ellipse class="st0" cx="193.3" cy="78.2" rx="56.6" ry="78.2"/> </g> </g> <g> <g> <path class="st0" d="M431.3,153.2c-32.9,0.5-58.9,31.7-58.2,80.2c0.7,48.4,27.9,70.5,60.8,70c32.8-0.5,58.9-23.3,58.2-71.7 C491.1,168.5,439.2,153.1,431.3,153.2z"/> </g> </g> <g> <g> <ellipse transform="matrix(0.9976 -6.979734e-02 6.979734e-02 0.9976 -13.4328 5.9491)" class="st0" cx="78.4" cy="195.2" rx="58.4" ry="79"/> </g> </g> <g> <g> <path class="st0" d="M401.2,334.9c-28.1-24.7-52-44.9-89.3-96.7c-18.5-25.6-39.8-28.9-62-28.9c-22.3,0-45.8,7.8-63.8,33.8 s-38.5,51.3-78.3,84.4c-39.7,33.2-56.6,56.1-56.6,89.9s19.3,89.9,74.1,89.9s81.3-12.1,124.7-12.1S322.1,512,376.9,512 s77.7-51.9,77.7-85.6S445.1,373.5,401.2,334.9z"/> </g> </g> </svg>
- Background color – #de0f17
- Icon and text color – #ffffff