Need of Social Media Networks
Be it a Business or Personal Blog, its success is closely tied with Social Media Networks. Social Media helps to spread the information quickly and plays a key role in promoting the products.
If you haven’t created Facebook Page, Twitter or Google Plus profiles for your website, there is no doubt that you are definitely losing lot of customers and money. So, it is high time to create one now.
Plugin Social Media Widgets into your Blog
Supposedly Social Network Profiles are already created for the business or blog, we should find a way to link them in the website. When a visitor arrives to the website and impressed with the content or product, it is very common to look out for website’s social network pages. Almost all updates are glued to Facebook, Twitter, Google plus and other social networks.
We can post regular updates in social media to help users stay updated with latest information. Though there are RSS Feeds/Email Services, it is much easier to communicate the things in social media.
There are tons of plugins available to link to social media pages. But this functionality can be implemented by our own by using simple HTML code.
Make your own Follow US or Social Media Widgets for WordPress:
Step 1: create a function namely socialMediaWidgets() in Child Theme’s functions.php
Step 2: Add this below code and save it
function socialMediaWidgets(){ ?>
<ul>
<li style="padding:5px;float:left;">
<a href="https://twitter.com/<TWITTER_UNAME>" title="Twitter" rel="alternate" target="blank">
<img src="<IMAGE_URL>/twitter.png" alt="" style="border:0"></a></li>
<li style="padding:5px;float:left;">
<a href="https://www.facebook.com/<FACEBOOK_PAGENAME>" title="facebook" rel="alternate" target="blank">
<img src="<IMAGE_URL>/fb.png" alt="" style="border:0"></a></li>
<li style="padding:5px;float:left;">
<a href="https://plus.google.com/<GOOGLE_PLUS_PAGE>" title="facebook" rel="alternate" target="blank">
<img src="<IMAGE_URL>/fb.png" alt="" style="border:0"></a></li>
<li style="padding:5px;float:left;">
<a href="mailto:<YOUR_EMAIL_ID>" title="Email" rel="alternate" target="blank">
<img src="<IMAGE_URL>/email.png" alt="" style="border:0"></a> </li>
</ul>
<br><br>
<?php
}
Step 3: Identify the placement for your social media network links and invoke this newly created function. Lets add this to sidebar. Go to Appearance->Widgets in WordPress Admin and add “Text Widget” to sidebar.
Step 4: Fill the Title field In Text Widget as “Follow Us on Social Media” and add the below line of code in the text area entry and save it.
<?php socialMediaWidgets();?>
Step 5: Load the website, Social Media Pages are now shown in the sidebar.
Customizing Social Media Widgets:
- To invoke a PHP method under Text Widget, code needs to be added in functions.php.
- We can add as many social networks like StumbleUpon, Pinterest, Reddit, etc., by adding additional <li> tag for each.
- CSS can be modified as per the need. This code displays the social network links horizontally.
- For the icon images for Facebook, Twitter, Google Plus, etc., please download the copyright free images of your desired size.
- It is not mandatory to create this as a function. We could also directly place the HTML code wherever required. If created as a function, it can be reused anywhere to place the social media links on Header,Footer, Sidebar, etc.
With simple HTML and PHP code, we discussed the steps to add Social Media Buttons(Pages) to the Website.