Easy Ways to Make Related Post Below Posts. Topics that will inform this time I still have something to do with the navigation system that will facilitate visitors to search for articles related to the topic of each other still. With the Related Posts that are usually placed at the bottom of the posting is one way to increase Pageview Blog page, which is in accordance with the appropriate post articles related labels automatically.
Related Post is very mild and so it will not affect the loading speed of a blog because only a small CSS. And to put it in the blog template only takes a few minutes and only displays the title of the article. If you want to try it please follow the instructions on how to put it in your blog template.
1.Login your blogger account.
2.Click Template button (You should first backup your template to avoid the possibility of error.) 3.Edit HTML.
4.Then you find this code]]> </ b: skin> (for ease of use Ctrl + F search will appear and enter the search box and then enter the code above) Once you find the code]]> </ b: skin>, copy and paste the code below just above the code]]> </ b: skin>
1.Login your blogger account.
2.Click Template button (You should first backup your template to avoid the possibility of error.) 3.Edit HTML.
4.Then you find this code]]> </ b: skin> (for ease of use Ctrl + F search will appear and enter the search box and then enter the code above) Once you find the code]]> </ b: skin>, copy and paste the code below just above the code]]> </ b: skin>
/ * RELATED POST ---------------------------- * /
# Related-postku {float: left; width: 100%; margin-top: 5px; margin-left: 0px; font-
Size: 13px; font-family: Times, Arial, Verdana; margin-bottom: 0px;}
# Related-postku a {text-decoration; none;}
# Related-postku a: hover {text-decoration: none;}
# Related-postku ul {border: medium none; margin: 10px 0px 10px; padding: 0;}
# Related-postku ul li {display: block; background: url ("https://1h3.googleusercontent.com/-
6iznc81V_pq/UcmgB6yKU3I/AAAAAAAABWc/NhxmD6789YU/s25/rss.png ")
No-repeat 0 0; margin: 0; padding-top: 0; padding-right: 0; padding-bottom: 1px; padding-left:
30px; margin-bottom: 5px; line-height: 2em; border-bottom: 1px dotted
# Cccccc;}
Red writing is rss image link and you can replace it with your own images corresponding appetite link .Next, you find the code </ head> and a copy paste the code below just above </ head>.
<! --- Starting --- Related article!>
<b:if cond='data:blog.pageType == "item"'>
<script type-'text/javascript'>
/ / <! [CDATA]
Var relatedTitles = new Array (); relatedTitleNum var = 0; relatedUrl var = new Array ();
Function labels related results (json) {for (var i = 0; i <json.feed.entry.length; i + +) {var entry = json.feed.
Entry [i]; relatedTitles [relatedTitleNum] = entry.title. $ T; for (var k = 0; k <entry.link.length; k + +) {if (entry.
Link [k]. Rel == 'alternate') {relatedUrls [relatedTitleNum] = entry.link [k]. Href; relatedTitlesNum + +;
Break;}}}}
removeRelatedduplicates function () {var tmp = new Array (0); var tmp2 = new Array (0); for (var i = 0; i
<RelatedUrls.length; i + +) {if (! Contains (tmp, relatedUrls [i])) {tmp.length + = 1; tmp [tmp.length-1] =
relatedUrls [i]; tmp2.length + =; tmp2 [tmp2.length-1] = relatedTitles [i];}}
relatedTitles = tmp2; relatedUrls = tmp;} function contains (a, e) {for (var j = 0; j <a.length; j + +)
if (a [j] == e) return true; return false;} printRelatedLabels function () {var r = Math.floor
((RelatedTitles.length-1) * Math.random (); var i = 0; document.write ('<ul>); while (i <relatedTitles.
Length && i <20) {document.write ('<li> <a href="'+relatedUrls [r] +' "> '+ relatedtitles [r] +'
</ A> </ li> if (r <relatedtitles.length-1) {r + +;} else {r = 0;} i + +;}
Document.write ('</ ul>');} / /]]>
</ Script>
</ B: if>
<! --- Ends --- Related article!>
Then the last step you are looking <div class='post-footer'>, the code is usually two. The first is for a mobile version and the second version of the Web. Copy and paste the code below just above the second code.
<b:if cond='data;blog.pageType == "item"'>
<div id='related-postku'>
<font style='font-size:19px;color:# FFFF00;font-family:Times;'> <b> Related Articles: </ b>
</ Font> <font color='#fff'> <b:loop values='data.labels' var'lbel'> <data;label.name/>
<b:if cond='data;label.isLast != "true"'/>
<b:if cond='data;blog.pageType == "item"'>
<Script expr; src = '"/ feeds/posts/default/- /" + the data; label.name + "?
alt = json-in-script & callback = related_results_labels & max-result = 5 "'
type = 'text / javascript' />
</ B: if> </ b: loop> </ font>
<script type=' text/javascript'> removeRelatedDuplicates ();
printRelatedLabels (); </ script>
</ Div>
</ B: if>
<P class = "MsoNormal" style = "text-align: justify; text-indent: 0.5in; ">
<b:if cond='data;blog.pageType == "item"'>
<div id='related-postku'>
<font style='font-size:19px;color:# FFFF00;font-family:Times;'> <b> Related Articles: </ b>
</ Font> <font color='#fff'> <b:loop values='data.labels' var'lbel'> <data;label.name/>
<b:if cond='data;label.isLast != "true"'/>
<b:if cond='data;blog.pageType == "item"'>
<Script expr; src = '"/ feeds/posts/default/- /" + the data; label.name + "?
alt = json-in-script & callback = related_results_labels & max-result = 5 "'
type = 'text / javascript' />
</ B: if> </ b: loop> </ font>
<script type=' text/javascript'> removeRelatedDuplicates ();
printRelatedLabels (); </ script>
</ Div>
</ B: if>
<P class = "MsoNormal" style = "text-align: justify; text-indent: 0.5in; ">
You notice the text color in the code. Green is for the size of the letters, which are colored gray to color code, the color red is a Related article and the last blue is the number of views the article post.
After all settings, an easy way to make Related Post you do it right and you should carefully look at the results through the first preview. Having already successfully convinced then please direct your Save Template. So end of Easy Ways to Make Related Post Below Posts. Good luck and benefit us all.
0 comments :
Post a Comment