How to directly embed the "Automotic Read More" option to your template?

August 23, 2009 by Melgar
Recently on my post Types of 'Read More' option in blogger blogs I had discussed that the Automatic Read More option uses a javascript and needs you to host it. Now we will do some trick to let our script embedded directly to our template that makes the script no need to host.

What is the advantages of doing this trick? It saves our time to upload the script to our hosting account. Also, because the script is not hosted, it speeds up the page load of our blog. Does it means if I hosted the script my blog will run slow? No, this is only for a prevention. Why? It sometimes happen (the slow loading) when the host is some kind of busy like doing maintenance and some other related issues.

How to do this trick? Just follow the instructions below: (FireFox Mozilla is the browser that was used in the illustrated images below)
  1. In your Dashboard, go to your template Layout, click to Edit HTML.
  2. IMPORTANT: Now before editing our Template, please make a backup of your template so if something wrong happen we can restore the original template just like it was before. To do this click the Download Full Template like illustrated below, (click the images below to enlarge)
    3. Template Backup and Save. Save Template
  3. Now download the automatic-read-more-script+postbodycode.zip, extract it and open the text file.
  4. Then search the following codes in your template, don't forget to expand your template. For easy search press Ctrl + F in your keyboard and type the code below (the </head> or <body>) and press enter.
    5. </head>
    <body>
  5. When you find it, copy the script below the Automatic Read More Script: in the automatic-read-more-script+posrbodycode.txt text file that you opened and paste it between the </head> and <body>.
  6. Then again search following codes below. For easy search press Ctrl + F and type the code below (I recommend the <data:post.body/>) and press enter.
    7. <div class='post-header-line-1'/> <div class='post-body entry-content'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div>
  7. When you find it replace the red highlighted code with the codes below the Post Body Code: in the automatic-read-more-script+posrbodycode.txt
  8. Now Save your template and your done.
For the preview of what the automatic read more option that we just added look like check this blog homepage.

You can also customize the size of the image thumbnails and how long the summary of your article will appear on your homepage. Just search our script that we embedded and find the couple of codes below and change the number highlighted in green for the image thumbnails size and the number highlighted in blue for the length of article summary for whatever would you like.

</script>
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 390;
summary_img = 390;
img_thumb_height = 120;
img_thumb_width = 120;
</script>

If you have some expertise in editing CSS (short for Cascading Style Sheets) to change the appearance of the Read More option you can use the codes below:

a.readmore { /*your prepared style here*/ }

Types of "Read More" option in blogger blogs

August 16, 2009 by Melgar
I have seen many topics about adding "Read More" option in blogger and some of them are really difficult to follow. And I categorize them in two. One is the "expandable" and the other one is the "automatic."

What is the "Expandable" type? "Expandable" type is the type that is little too tricky. It needs you to add some codes in your blog template in the upper and lower section of <data:post.body/>. It also needs you to add some other codes in the Post Template section of your blog settings under the Formatting area. It looks like this:

Write summary here
<div class="restofpost">Write rest of post here</div>

or

<span class="fullpost">

</span>


In the homepage all your post will be summarize. Also in the archive pages and label pages. But this type of "Read More" option has several disadvantages. First is it only summarizes the posts that you added the codes above. It will not apply to others that you didn't added the code. This type is not advisable if you already have 50 to 100 posts. Second is, it happen sometimes when you are editing your post content the codes get lost or erase and that needs you to paste the code again. It happens to me when I was using this type. You can get more information about this type of read more option here.

What is the "Automatic" type? "Automatic" type is the type that once you set it up it don't needs you to add more codes in your post content. It automatically summarize your post in the home, archives and labels page. This type is recommended for bloggers that already have 50 to 100 posts in their blog because it automatically summarizes all your posts. This type is using a script called "summary-posts.js" and you need to host this script but you can use the script that was hosted in Quite Random. You can also find instructions of how to install the automatic "Read more" option there. (Browse to it here)

In my next post I will teach you how to directly add the script right on your blog template to speed up the loading of the script.

Unusual differences of Zinmag Remedy 2.0 to Zinmag Remedy

August 10, 2009 by Melgar Leave a comment
Zinmag Remedy blogger template is a very professional looking template. The only problem is that if you don't have any knowledge about HTML editing it is not advisable to pick this professional looking template. It happens to me before, but usually being a blogger we need to adapt the trend.

Zinmag Remedy template is originally a wordpress theme or template and converted by Falcon Hive into a blogger/blogspot template. This template is great and comes with hundreds of features. You can read more about the the template in my post The Zinmag Remedy Blogger Template.

What are the differences of the Zinmag Remedy 2.0 to Zinmag Remedy? The 2.0 version is much easier to customize. Falcon Hive who converted the template said that they fixed every possible SEO issue and improved the ‘h tag’ of the template. They also rearrange the code to make its structure more completely similar to the standard template, the Minima’s structure.

The 2.0 version is 99% widgetized or customized. Like I said, the old version needs you to have HTML knowledge to setup and that's often causes unpredictable error. But for the 2.0 version it is "99% widgetized" all the part from the top navigation bar to the bottom tabber section. So as Falcon Hive said: "you can now wipe out all your worries and just customize Remedy in Page Element section!"

The CSS and template structure of 2.0 version has improved. The new modified template’s CSS code fixes some issues like misaligned image in the ads space on the main page. Modifications on JavaScript/HTML gadget have made also to make customization faster and easier. And lastly, a new layout view is been made. See more to Zinmag Remedy 2.0 page.

So what is the unusual difference to the two version? See the images below. (Click the images to enlarge)
New Version:

Zinmag Remedy 2.0
Old Version:

Zinmag Remedy old

Did you see the unusual differences? You notice it in the ‘Carousal Panel’. The new version uses a scrolling image navigation and the old version uses the sliding image navigation. I have notice this unusual thing when I installed the new version on my new blog. Thinking it might be an upload error, I try to upload the new version many times but it don't resolve the problem. So I end up uploading the old one. See my next post for the solution to the problem of 2.0 version ‘Carousal Panel’.

Update:

The differences of two templates here only happens if you use the default hosted javascript files which is been disabled by the host. For best results upload all javascript files located in the js folder to your hosting account. If don't have hosting account you can try hosting it here. It is free to host and to register.

Mini-Hotrod 3 Column Blogger Template

August 4, 2009 by Melgar 1 comments
Hotrod is originally a 2 column Wordpress theme created by Jinsona designs and converted into blogger by Templates Novo Blogger. I saw this template in Templates-blogger.com. But as I experienced the converted blogger version has some problems. It seems OK in the homepage, but if you browse to the individual post, the content of your post is not appearing. It also happens on archive page and label page.

You see, this template is very cool and hot because of the red sport car viewed on its header. Because of its coolness I tried to fix the problems. But as you can I really love 3 column templates, specially the Minibox 3 Column Modified, and this template is a 2 column version. So instead of fixing the problem I thought it is easier if I just combine it to my favorite 3 column template.

As the result the Mini-Hotrod 3 Column Blogger Template was born. This template is a combination of the Minibox 3 Column Modified and the Hotrod. It has the same features of Minibox 3 Column Modified and the coolness and hotness of Hotrod.

Mini-Hotrod 3 Column Blogger TemplateFeatures:
  • NavBar has been remove
  • Google Translate Widgets
  • Live Traffic Feed Widgets
  • No Right Click Widgets
  • "Post Title | Blog Title" SEO Trick
  • "Read more posts filed under + Labels Name" Widget tags
  • "Title" Widget tags
  • "Related Post" below each of your posts
You can see the demo here. Download it here.