Membuat Summary Menjadi Rata Kiri Kanan (Justify)

Membuat Summary Menjadi Rata Kiri Kanan (Justify)

Pada sebagian blog yang menggunakan summary pada halaman index akan terdapat sebuah ringkasin tulisan dari conten yang sebenernya. nah summary ini biasa atau secara umum letak tulisannya akan rata kiri, supaya letak tulisan pada summary menjadi rata kiri dan kanan (justify) maka kita harus memodifikasinya terlebih dahulu.
Ada berbagai macam jenis kode yang dipakai pada template blogger salah satunya yang akan saya bagikan dibawah ini, tetapi ada juga yang membuat summary menggunakan fungsi javascript seperti contoh dibawah ini.

document.write('</div>')};
function showrecentposts1(json){j=showRandomImg?Math.floor((imgr.length+1)*Math.random()):0;img=new Array;if(numposts1<=json.feed.entry.length)maxpost=numposts2;else maxpost=json.feed.entry.length;document.write('<div class="owl_carouselle" style="display:none;">');for(var i=0;i<maxpost;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var tag_name=entry.category[0].term;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++)
if(entry.link[k].rel=="alternate"){posturl=entry.link[k].href;break}
if("content"in entry)var postcontent=entry.content.$t;else if("summary"in entry)var postcontent=entry.summary.$t;else var postcontent="";if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if(a!=-1&&(b!=-1&&(c!=-1&&d!="")))img[i]=d;var trtd='<figure class="slider__item clearfix"><figcaption class="slide__caption"><div class="post__description"><p><a href="/search/labels/'+tag_name+'?max-results=5" rel="tag">'+tag_name+'</a></p><h2><a href="'+posturl+'">'+posttitle+'</a></h2></div></figcaption><div class="lazyOwl img__container" style="background-image:url('+img[i]+');display: block;"></div></figure>';document.write(trtd);j++}
document.write('</div>');};

Untuk jenis javascript diatas kita cukup menambahkan fungsi CSS nya saja, katakanlah class clearfix, maka kita cukup menambahkan fungsi CSS sebagai berikut:

 .clearfix {text-align:justify}


Tetapi jika ente menggunakan template yang memakai kode HTML, maka tricknya akan menjadi seperti dibawah ini.

1. Masuk ke Dashboard > Design> Edit HTML

2. Cari kode HTML seperti dibawah ini, gunakan  ctrl+f  agar lebih mudah.

<div expr:id='&quot;summary&quot; + data:post.id'> 

3. Setelah ketemu tambahkan fungsi CSS seperti ini:

style='text-align:justify;'

Sehingga menjadi

<div style='text-align:justify;' expr:id='&quot;summary&quot; + data:post.id'>

3. Simpan Template dan lihat hasilnya.

Sebenarnya ada banyak cara yang bisa kita lakukan, tetapi langkahnya akan berbeda-beda sesuai dengan template yang kita gunakan, namun setidaknya ini yang bisa saya bagikan, ok semoga ada gunanya ya.

SHARE TO:

Berlangganan via email

Previous
Next Post »
Disqus Comment
  • Untuk menyisipkan kode gunakan <i rel="code"> kode yang akan disisipkan </i>
  • Untuk menyisipkan kode panjang gunakan <i rel="pre"> kode yang akan disisipkan </i>
  • Untuk menyisipkan quote gunakan <i rel="quote"> catatan anda </i>
  • Untuk menyisipkan gambar gunakan <i rel="image"> URL gambar </i>
  • Untuk menyisipkan video gunakan [iframe] URL embed video [/iframe]
Load comments