How to add Social Media Icons below Post title in Thesis?

     

I wanted to add Social Media Icons below Thesis Blog Post  or  below Post title in Thesis something like ShoutmeLoud.com.

Lets follow the following steps to add Social Media Icon at desired location:

1.First you got to  log into your WordPress Blog. Click on the “Thesis” dropdown menu,Select  “Site Options” &  then click on the “Stats Software/Scripts” dropdown menu.  Actually its the same place where  you added your google analytics code and other javascripts.

2.Do  Copy and paste the  following code then click the Big Ass Save Button.

[code lang="php"]<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> [/code]

3.Now  open “Custom File Editor” in your sidebar in the Thesis dropdown menu. You would be taken to Custome.css as page loads.

custome css in thesis theme

Snapshot of Custom.Css Editing via Thesis Custom File Editor

Copy and paste the following code in that file and click the “Big Ass Save Button”.

[code lang="css"]/* Social Icons */
.custom .social-icons { float:center; } [/code]

4.In the dropdown menu, now you got to launch “custom_functions.php” and click “edit selected file”. You got to copy and paste the code below then click the “Big Ass Save Button”.This would add social media icons before the blog post or say after Post title in your Thesis theme.

[code lang="php"]
function social_icons_b4post() {
if (is_single()) { ?></pre>
<div class="social-icons"><a href="http://twitter.com/share" data-count="horizontal" data-via="shashank_1990">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<iframe style="border: none; overflow: hidden; width: 85px; height: 21px;" width="320" height="240"></iframe>src="http://www.facebook.com/plugins/like.php?
app_id=154799974588476&href=<!--?php the_permalink() ?-->&send=false&layout=button_count&width=85&show_faces=false&
action=like&colorscheme=light&font&height=21" frameborder="0"
scrolling="no" width="320" height="240">
<script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="text/javascript" data-counter="right"></script><script type="text/javascript" src="http://www.stumbleupon.com/hostedbadge.php?s=1"></script></div><?php }}add_action('thesis_hook_before_post', 'social_icons_b4post');
<pre>
[/code]

5.That’s All! You can now see social media icons of Google plus,Twitter,Facebook,Linkedin,and Stumbleupon before your blog posts. So say good bye to those plugins that add more code and increases loading time of your Thesis powered WordPress blog. .

Related posts:

  1. How To Add Social Media Float Icons in Sidebar For Thesis Theme?
  2. How to Add Google Adsense ads After/Before the Post Title in Thesis Theme?
  3. Best Social Media Icons Sets for Your Website
  4. How to add Google Adsense Link Unit Below Navigation Menu In Thesis Theme?
  5. Thesis:How to place javascript at bottom of thesis page?