Convert Ur blog in to a Magazine blog ( Adding 'Read More' styles)

Is there a big different between your and my template ? hmm ? oh , yes , in my home page I have a Magazine type template with a Read More buttons and you have a blog with a homepage of posts that show their whole body and take a long time to load. And also it makes your blog more longer. ( If you are posting more than 5 posts per a page ). So , do you want to know how to add 'Read More' buttons and make your blog more profeesional ? so here is the way !


Fisrt of all , go to the Settings tab , then select Formatting tab and go to the option Show. Now add a number more than 5. ( Here in my blog , I keep about 15-20 posts in homepage )



Now

1. Edit your Template
2. Now find out 

<data:post.body/> 

press 'Ctrl' + F to open your browser's search box)

Now Replace 

<data:post.body/>

with
 these codes. Make sure that you REPLACE this line. In some templates , I have seen a line as 

<p><data:post.body/></p> 

instead of 

<data:post.body/>

If then replace the whole 


<p><data:post.body/></p> 

line with follwing lines.


<script type='text/javascript'>
summary_noimg = 400;
summary_img = 300;
img_thumb_height = 0;
img_thumb_width = 0; 
</script>
<script src='http://kfile.110mb.com/summary-post.js' type='text/javascript'/>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'>Read more</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Now follow the Safety Saving Steps.

And 

That's it , now your blog will too get converted to a Magazine type template as following photo.



Do you like to add a Image too ? like in this photo ?


Then change these two lines of codes


img_thumb_height = 0;
img_thumb_width = 0;

to


img_thumb_height = 80;
img_thumb_width = 100; 

or any hieght and width that you like to have.


If you want to increase your post's height ,


summary_noimg = 400;
summary_img = 300;

change these to any amount you need !

summary_noimg = 400; stand for the post's hieght without a Image.
summary_img = 300; stand for the post's hieght with the Image.

Click here to like our Facebook Page and here to join our Telegram Channel for more free unlimited Internet tricks and tutorials.






About Azeeztech We provide solutions to your device (phones, laptops, tablets etc) related problems with Freenet and Mobile Stock Rom.
Newer Posts Newer Posts Older Posts Older Posts

More posts

Comments

Post a Comment