Ways to Make Money Online

If you haven’t noticed, we have replaced our ShareThis button with our very own social bookmarking buttons. Buttons that allows readers to access their most favorite popular social bookmarking site within a click of a button.

We haven’t done a tutorial in a long time so I thought that I would write a tutorial on something that was useful to all bloggers – to be able display your very own social bookmarking buttons without having to use any sort of plugin.

Before implanting this nice feature to your blog, I recommend to always backup your files in case any situation you find your self trapped and accidently tampered with important code, you can fix it immediately with your original code.

Step 1: Open Notepad

Once you have opened up notepad, copy & paste this code into it:

After you have done this, under File, select ‘Save File As.’ A small window should open up and besides ‘Save as type,’ you should see that there is a drop down list. Select the drop down list and be sure to select the option ‘All Files’ and name the file social.php. After you have done this leave it on your desktop and move onto the next step. We will use the newly created PHP file later in tutorial.

Step 2: Add the CSS code

Time to make the buttons stylish with a little bit of CSS.  Now login to your Wordpress blog and just copy & paste this code anywhere onto your blog stylesheet that contains all your web design code; and soon later, watch the magic happen.

Basically what this code does is control how the button looks. If you want to change the button’s appearance in terms of positioning and etc, just edit this code whenever you want in your style.css file. After you have hit “Save,” move onto the next step.

Step 4: Add the button images

Now what you need are the button images. Simply right click on each of these images and select ‘Save Picture As’ on each of the buttons to save the images to your desktop.

You should end up with 7 images in total. Now what you are supposed to do, is upload the buttons to your web server for you to use on your website. Usually I do this via through FTP with FireZilla.

If you don’t use FireZilla for your FTP web server purposes, I really recommend using it. If you don’t know how to use transport files with FTP at all, I recommend watching this video tutorial on how to transport files with FileZilla. If you don’t know what your FTP username or password is, it is usually given in your web host cPanel. If not, you can usually consult with your web host and they will give you the proper information you need to transport your files via with FTP.

Getting back to the tutorial, click through your public_html directory until you reach your images folder under the directory ‘Themes.’ Generally it is located somewhere along the lines of this:

public_html/wp-contents/themes/[yourthemename]/images

Once you get to this point, upload all 7 of the buttons to your images folder in your themes directory. After you have done this, follow the next instructions.

Now remember that PHP file we made named social.php? Since we are already using FTP to transport files, we might as well just add the PHP file while we’re at it. Go to public_html/wp-contents/themes/[yourthemename] and once you’re here, upload your social.php file into the directory.

After you have done this, you have completed this step and you can now move onto the final step.

Step 5: The easiest step

After you have reached this step, you are basically done. Now all you have to do is implant the code that calls out all the buttons. Generally people want the buttons to be below the post so I will show you how to plant the buttons where it is below the blog post.

Login into your Wordpress blog one final time and then under Appearance, select Editor. Once you have reached this point, you should see a PHP file named Single Post(single.php) on the side. Click it. Now, scroll down until you see an ending paragraph code that looks like this </p>. Once you have spotted that code, put this code (code below), outside of the blog post loop.

<?php include (TEMPLATEPATH . '/social.php'); ?>

After you have done this and added the code after the loop (generally after the last </p>), hit update file. Now whenever you visit one of your blog posts, you should see that it now has social bookmarking buttons underneath each blog post. If it doesn’t appear, you probably didn’t properly put the code outside of the blog loop. Be sure to configure it right and if you ever bump into a problem, you can always just ask here for help.

Anyways, I hope this tutorial was helpful and over the years start to see more bloggers make use of their own social bookmarking buttons instead of using old generic Wordpress plugins ones. If this worked for you, be sure to showcase your blog for viewers to see.

Similar Reads:

• How to Add Nofollow to Links in a Wordpress Post
• How To Make Your Blog Do Follow
• To Add or Not to Add Nofollow
• 7 Ways to Optimize for Google Images
• 22 Ways to Optimize Wordpress to Load Even Faster
• 7 Ways to Gear a New Wordpress Blog for the Search Engines
• How To Spot A Dofollow Site
• The Difference Between Dofollow and Nofollow
• Like My Web Template? You Can Have It
• The Sharing Button

Tags: sharethis no plugin, social bookmarking buttons with no plugin, socializer buttons plugin