Linking Text Automatically With Javascript

Well now i wanna discuss about "How To Link A Word/Phrase To A Specific Posts Automatically?", which by implementing this, later you'll be able to create a link on your posts point to your another posts by simply mentioning a specific names as you set on the "code". For example: if i have implemented this methode on my blog, i'll have to only mention "John Smith's Blog", needless to add a "<a href" parameter, to link to "http://j-smith-site.blogspot.com/". - Some poeple said, this methode is somehow Seo Friendly. It's alike to Wikipedia, that which the site oftenly stays on the top ten on Search Result Page (Seo) on Google Search with a short keyword, so this methode could be a good way to boost your site performance on google search..

To implement this methode on your site, all what you have to do is just to add a two set codes onto your template as explained below.

1. Add the following script above the tag </head> on your template.

The code above looks like the below.

<script type='text/javascript'>
//<![CDATA[
function HighLight(bodyText,searchTerm,link) { var newText = ""; var i = -1; var lcSearchTerm = searchTerm.toLowerCase(); var lcBodyText = bodyText.toLowerCase(); while(bodyText.length > 0) { i = lcBodyText.indexOf(lcSearchTerm, i+1); if (i <0) { newText += bodyText; bodyText = ""; } else { if(bodyText.lastIndexOf (">", i) >= bodyText.lastIndexOf(">", i)) { if(lcBodyText.lastIndexOf("/script>", i) >= lcBodyText.lastIndexOf("<script", i)) { newText += bodyText.substring(0, i) + '<a href="'+link+'">'+ bodyText.substr(i, searchTerm.length) + '</a>'; bodyText = bodyText.substr(i + searchTerm.length); lcBodyText = bodyText.toLowerCase(); i = -1;}
}}}
return newText; }
function keywords(searchText,treatAsPhrase,link,divid) { if(treatAsPhrase) { searchArray = [searchText]; } else { searchArray = searchText.split(" "); }
div=document.getElementById(divid); var bodyText = div.innerHTML; for (var i = 0; i < searchArray.length; i ++) { bodyText = HighLight(bodyText, searchArray[i], link); } div.innerHTML = bodyText; return true; }
//]]>
</script>


2. Find the code <data:post.body/> (If you're a blogger and run "read more" function on your blog, you might find two of this code, just replace the second code) on your template and replace it with the following.

The code above looks like the below.

<p><div expr:id='&quot;summary&quot; + data:post.id'> <data:post.body/></div>
<script type='text/javascript'>
keywords('keyword to link to 1',true,'Your Post Url Here. Example: http://j-smith-site.blogspot.com/','summary<data:post.id/>');
keywords('keyword to link to 2',true,'Your Post Url Here','summary<data:post.id/>');
</script></p>


Just add the following code to add the keywords to link to. And don't forget to edit it accordingly.

keywords('keyword to link to',true,'Your Post Url Here','summary<data:post.id/>');

Now you're done. Just check or test the code by going to your post or publishing a new post and included a keyword as you set on the code to make sure that the code is working.

0 comments:

Post a Comment