I recently added Facebook like buttons to each of my posts and was surprised at how easy it was. There is no need to install plugins because it’s very simple.
- Go to Facebook and get the code to make the like button: https://developers.facebook.com/docs/reference/plugins/like/
- Copy the code from part one and go to your WP Dashboard under Appearance -> Editor
- Select your theme on the top right dropdown.
- Click header.php from the list of files.
- Paste the first code after the tag.
- Update that file.
- Open index.php and find the loop. It should look like this:
- Go back to Facebook and copy the second code.
- Paste it inside of the loop at the end of the “entry” div.
- Replace the data-href URL with and that will generate the URL for that post.
- Update that file.
- Open single.php and find the loop and do steps 9-11 again.
Pretty simple. I also recommend checking out the WP Facebook Open Graph protocol plugin http://wordpress.org/extend/plugins/wp-facebook-open-graph-protocol/
Today I added a Live Search (or autocomplete) plugin to my blog and I’d like to create a short tutorial for how you can add Live Search to your WordPress blog.
- Login to your WordPress Dashboard and add this plugin “Dave’s WordPress Live Search”
- Activate the plugin.
- Go to Settings -> Live Search
- Decide how many results you want to display (I set mine to 5)
- If your search is near the top leave the direction as “Down” (you may try experimenting but most likely leave as “Down”)
- Check “Display Post Excerpt” and leave the other 3 unchecked
- Leave the default style as gray.
- Save Changes
- Most likely the width of the search box will be off so go to Plugins -> Editor and select “Dave’s WordPress Live Search” from the top right drop down.
- Click daves-wordpress-live-search/css/daves-wordpress-live-search_default_gray.css from the list of plugin files.
- Change the width in ul.search_results to match your search box.
- Make any other style changes you’d like and click update file.
- That’s it! You now have a working live search box!
If you want to know more about this plugin, see http://wordpress.org/extend/plugins/daves-wordpress-live-search/
I found a great tutorial on Speckyboy.com that shows how to make a beautiful CSS3 search bar (in fact I’m using it on my site). Read the tutorial here: