Display Posts in Title Only in Blogger

Indeed, some bloggers choose only shows the title of his blog posts are on the front page or home page. Perhaps the rationale of the owner of the blog itself is showing only the title of the post just to save space so that the number of posts that can be displayed more in the front yard or porch. Other supporting reasons may be because the post title is representing the contents of the post itself so that by displaying the post title on the front page article will further enable more read by the visitors. Here's an example blog that only shows the title of his post only:



To be on the front page displays only the post title alone, the following steps:
  • Please log in to blogger with your ID.
  • Click Design

  • Click the Edit HTML

  • It is recommended to make a backup first, click on the words Download Full Template.
  • Find the code ]]></b:skin>
  • Copy the code below, then paste the below code ]]></b:skin>
    <style type='text/css'>
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    .post-body{display:none;}
    </b:if>
    </b:if>
    </style>
  • Click Save Template button.
  • Done. Please see the results.

Easy is not it? however, by installing the above code still leaves some elements such as date of posting, comments and others. If you want to remove everything and left only the title of his post, maybe you can use the following code:
<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
.post-body, .post-footer, .jump-link,
.post-timestamp, .reaction-buttons,
.star-ratings, .post-backlinks,
.post-icons, .date-header{display:none;}
</b:if>
</b:if>
</style>

If it turns out there are still elements left but the post title, maybe your template code does not follow standard blogger template. What's the solution? you have to recognize the structure of your template.

For users of the internet browser Firefox, Kang Rohman have tips easily recognize the structure of your templates is to install the Web Developer add-ons you can download the add-ons for firefox.

Kang Rohman Now suppose that you have installed the add-ons on firefox web developer you use. Please open your blog address (of course that will be edited according to the article above). Click the Information menu, then select Display Div Order.
Maka secara otomatis akan ditampilkan struktur div dari template anda. Contoh gambar :
Dari gambar tersebut terlihat bahwa tanggal posting serta komentar disimpan dalam elemen div :

.databarleft
.datebarright

Sehingga kode yang digunakan menjadi seperti ini :
<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
.post-body, .databarleft, .datebarright{display:none;}
</b:if>
</b:if>
</style>

Hope can be understood.

Update: The code has been perfected so as not to conflict with the static page / static post

Source: http://kolom-tutorial.blogspot.com/2010/08/tampilkan-postingan-hanya-judul.html

0 komentar:

Post a Comment

Just Comment. Not Spam!

 

Followers

Recent Comments

Free Download Scripts and Source Code | © 2009 | edited by asal-klik