Read More Liberal

Ok sekarang saya akan tunjukan hack “ read more “ yang tidak perlu menulis pakai div dan span pada artikel kita. atau lebih jelasnya tidak pakai “ <span id="fullpost"> artikel </span> atau <div id="fullpost"> artikel </div>.

Anda boleh memberi tumpuan kepada penulisan anda sepuas-puasnya, kemudian terus terbitkan, dan kita akan melihat “ read more “ di artikel kita ada secara automotik!.

Tidak Percaya ?

Silahkan saja lakukan ini pada blog baru anda.

Pertama :
Buka tab Edit Html kemudian tandai/cek di samping tulisan “ Expand Widget Templates “.

di bawah tag ini ; </head>
masukan java-script ini.

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://anak.berudu.googlepages.com/read-moreotomatis.js' type='text/javascript'/>

note :
  • summary noimg = 430 – tinggi artikel terpenggal tampa image
  • summary img = 340 – tinggi artikel terpenggal dengan image.


Kedua :
kemudian cari kode html ini.

<data:post.body/>

ganti kode tersebut dengan script ini.

<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;padding-top:20px;'><a expr:href='data:post.url'> read more &#8220;<data:post.title/>&#8221;</a></span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Setelah itu Save Template. cuba sekarang buat postingan :)

source : blogger Tutorial

Menampilkan dan Menyembunyikan Widget Tertentu

Langkah 1
Login ke Blogger

Langkah 2
Masuk ke bagian "Tata Letak - Edit HTML"

Langkah 3
Jangan lupa checklist "Expand Template Widget"

Langkah 4
Lihat contoh berikut :

Dibawah ini kode awal sebelum di tambahkan kode tertentu

<b:widget id='Followers1' locked='false' title='Pengikut' type='Followers'>
<b:includable id='main'>
<b:if cond='data:title != &quot;&quot;'>
<b:if cond='data:codeSnippet != &quot;&quot;'>

...
...

</b:if>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
</b:section>
</div>

Dan perhatikan kode berwarna biru, itulah kode penambahan

<b:widget id='Followers1' locked='false' title='Pengikut' type='Followers'>
<b:includable id='main'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:if cond='data:title != &quot;&quot;'>
<b:if cond='data:codeSnippet != &quot;&quot;'>

...
...

</b:if>
<b:include name='quickedit'/>
</div>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div>


Langkah 5
Simpanlah template

Keterangan :

  • Kode tambahan untuk menampilkan dan menyembunyikan widget/sidebar bisa diterapkan disemua widget/sidebar.
  • Kode data:blog.homepageUrl adalah untuk menunjukan alamat blog.
  • Kode data:blog.url adalah untuk mengunci/menunjukan alamat tertentu.
  • Sedangkan tanda == digunakan sebagai pemeriksa, sehingga jika diterjemahkan kurang lebih seperti ini; jika data:blog.homepageUrl sama dengan data:blog.url maka widget/sidebar akan ditampilkan, jika tidak widget/sidebar akan disembunyikan.

Judul blog berjalan?

1. Login ke blogger kemudian ke menu Layout ---> Edit HTML

2. Cari kode/script

<title><data:blog.pageTitle/></title>

3. Ganti kode diatas dengan

<b:include data='blog' name='all-head-content'/>

<script language='JavaScript'>
var txt="<data:blog.pageTitle/>";
var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
</script>


Catatan
text yang berwarna merah diatas adalah merupakan kecepatan pergerakanya jika kamu tambah angkanya maka pergerakanya akan lambat dan jika mengurangi angka maka pergerakanya akan semakin cepat

Dropdown pada Label

Contoh tampil menu dropdown label:

Ikuti tutorial dibawah ini untuk membuat dropdown label:
Langkah pertama, masuk pada tab template -> Edit Html -> jangan lupa beri tanda cek pada 'Expand Template Widget' -> kemudian cari kode dibawah ini:

Tips : Agar mudah dalam pencarian sebaiknya cari kode (<data:label.count/>)


<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>


Jika sudah ketemu ganti seluruh kode diatas dengan kode dibawah ini:

<br />
<select onchange='location=this.options[this.selectedIndex].value;'>
<option>Select a label</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
(<data:label.count/>)
</option>
</b:loop>
</select>


Warna merah <option>Select a label<option> boleh diganti dengan ayat sendiri.

Cara buat "Readmore" pada Blogger

Untuk membuat readmore ikuti langkah dibawah ini :

Langkah Pertama:
Buka Template - Edit HTML - Berikan tanda centang pada "Expand widget template"

Langkah Kedua:
Cari kode dibawah ini:

<div class='post-header-line-1'/>
<div class='post-body'>

Jika sudah jumpa kode diatas, Copy-Paste kode dibawah ini kemudian letakan kode tersebut dibawah kode diatas.

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

Kemudian dibawah kode diatas kita akan menemukan kode:

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

Lakukan Copy-Paste kode dibawah ini dibawah code diatas

<a expr:href='data:post.url'>Readmore »»</a>
</b:if>


Tips: Kode Readmore diatas boleh diganti dengan ayat sendiri (contoh "Baca Selanjutnya", "Baca berikutnya", "Selengkapnya")


Kode selengkapnya jika dilihat akan tampak sebagai berikut:

<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Readmore »»</a>
</b:if>
<div style='clear: both;'/>


Langkah Ketiga
Save

Langkah Keempat
Setelah kode diatas disimpan kita kembali dan masuk ke tab Pengaturan -> Format -> cari "Post Template" Kemudian pada kotak masukan kode dibawah ini

<div class="fullpost">
</div>


Langkah Kelima
Cara penggunaan readmore pada halaman posting. Ketika kita melakukan posting pertama kali kita akan melihat kode:

text anda

<div class="fullpost">

text anda

</div>

Memaparkan judul posting tanpa isi (halaman) posting

Pertama :

Buka Template -> Edit HTML -> Jangan lupa lakukan backup template :) -> kemudian beri tanda cek pada 'Expand Widget Templates'

Kedua :

Lihat kode dibawah ini:

<!-- posts -->
<div class='blog-posts hfeed'>

<b:include data='top' name='status-message'/>

<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:include data='post' name='post'/>

Kemudian cari kode warna merah diatas, jika sudah ketemu ganti kode warna merah diatas dengan kode dibawah ini :

<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>


Ketiga :
Save