How to Add a Bookmark This Page Link In your Wordpress Blog template

It is a good idea to include a Bookmark Button at the end of  your article so that your readers can easily bookmark a page.

To add a Bookmark button In your site you need a Simple JavaScript file to be called in the header and you  have to add two lines of code in your single.php file. Follow the tutorial below

1.Create the JavaScript

Copy the following code  into notepad and save it as “bookmark.js”. This will create a JavaScript file in your computer. ( Note :You can give your JavaScript any name or can merge it with other JavaScript Files)

/**********  BOOKMARK SCRIPT STARTS **********/
function bookmarksite(title,url)
{ if (window.sidebar) // firefox 
window.sidebar.addPanel(title, url, "");
else if(window.opera && window.print){ // opera 
var elem = document.createElement('a');
elem.setAttribute('href',url);
elem.setAttribute('title',title);
elem.setAttribute('rel','sidebar');
elem.click(); }
else if(document.all)// ie 
external.AddFavorite(location.href, document.title) }
/**********  BOOKMARK SCRIPT ENDS **********/

After Creating the JavaScript file upload it in your server.Note The URL of the javascript. You will need it in the next step.

2.Call the JavaScript from Your Blog template

Paste the following Code anywhere before </head> in your Blog Template

<script type="text/javascript" src="your javaScript Url"></script>

For example :If your bookmark.js file is located at “http://www.yoursite.com/files/bookmark.js” you need to use the following code :

<script type="text/javascript" src="http://www.yoursite.com/files/bookmark.js">

</script>

3.Include The Bookmark Link In Your Template

If your Blog is on a Wordpress platform Then copy and paste the following code in your Single.php file

<div class="bookmark">
<!--[if IE]> 
    <a  rel=”nofollow” href="<?php the_permalink(); ?>" onclick="return external.AddFavorite(location.href, document.title)">Add to My Favorites!</a> 
    <![endif]-->
<![if !IE]>
<a rel="nofollow" href="javascript:bookmarksite('&lt;?php the_title(); ?>', '<?php the_permalink(); ?>')">Bookmark this Page</a>
<![endif]>
</div>

Note : Do not copy directly in your HTML editor (e.g Dreamweaver.MS-Frontpage).Copy to Notepad first.

You can add Style parameters in your Style.css file by creating a new class (e.g .bookmark { } )

The above code displays “Bookmark this page” in Firefox and “Add to My favorites” in Internet Explorer. I Hope this Code will be useful to you.If you face any problems in installing this code please drop in your valuable comments.

Reading: How to Add a Bookmark This Page Link In your Wordpress Blog template