BloonOnline GoTemplatez VersiEdan
Facebook Twitter You Tube Friendfeed
Blog Seo Intermezo

Lagi Tentang Meratakan Img Dengan Post-Body

Lagi pertanyaan masuk tentang “ meratakan img dengan post-body “, via my facebuuk. Pada post sebelumnya saya lebih menyarakan untuk mendownload template Hybrid News, karena trik yang saya gunakan pada blog bloon mengunakan apa yang ada pada template hybrid news tersebut.

Baiklah ada beberapa yang perlu di lakukan agar img dengan post-body kurang lebih sejajar ( pada halaman depan-nya saja ).

Langkah Pertama

Memasukan script read more otomatis versi 3 ( versi sebelumnya juga bisa red. )

simpan di bawah tag;

]]></b:skin>

Javascript, using GeSHi 1.0.8.8
  1. <script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 140; summary_img = 140; img_thumb_height = 110; img_thumb_width = 110; </script>
  2. <script type='text/javascript'>
  3. //<![CDATA[
  4. function removeHtmlTag(strx,chop){
  5. if(strx.indexOf("<")!=-1)
  6. {
  7. var s = strx.split("<");
  8. for(var i=0;i<s.length;i++){
  9. if(s[i].indexOf(">")!=-1){
  10. s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
  11. }
  12. }
  13. strx = s.join("");
  14. }
  15. chop = (chop < strx.length-1) ? chop : strx.length-2;
  16. while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
  17. strx = strx.substring(0,chop-1);
  18. return strx+'...';
  19. }
  20. function createSummaryAndThumb(pID){
  21. var div = document.getElementById(pID);
  22. var imgtag = "";
  23. var img = div.getElementsByTagName("img");
  24. if(img.length<=0) {
  25. imgtag = '<span style="float:left; padding:0px 20px 5px 0px; margin:-50px 0 0 0 !important;"><img src="http://i584.photobucket.com/albums/ss289/hemingways-studio/Have_Images_TEXT.png" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
  26. var summ = summary_noimg;
  27. }
  28. if(img.length>=1) {
  29. imgtag = '<span style="float:left; padding:0px 20px 5px 0px; margin:-50px 0 0 0 !important;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
  30. summ = summary_img;
  31. }
  32. var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
  33. div.innerHTML = summary;
  34. }
  35.  
  36.  
  37. //]]>
  38. </script>
Parsed in 0.019 seconds at 73.30 KB/s

 

( gunakan script read more otomatis di template Hybrid News, jika script di atas tidak berfungsing )

kemudian ganti script Html ini

Javascript, using GeSHi 1.0.8.8
  1. <div class='post-body entry-content'>
  2. <data:post.body/>
  3. <div style='clear: both;'/> <!-- clear for photos floats -->
  4. </div>
Parsed in 0.005 seconds at 27.82 KB/s

 

dengan script berikut ini

Javascript, using GeSHi 1.0.8.8
  1. <div class='post-body entry-content'>
  2. <b:if cond='data:blog.pageType != &quot;item&quot;'>
  3. <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
  4. <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
  5. </script>
  6. </b:if>
  7. <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>
  8. </b:if>
  9. <div style='clear: both;'/> <!-- clear for photos floats -->
  10. </div>
Parsed in 0.008 seconds at 52.12 KB/s

 

Langkah Kedua :

Tambahkan margin left untuk .post h3 + 140px ( merupakan syntax CSS untuk judul artikel - bisa saja untuk template lain adalah post h2 atau post h1 red )

CSS, using GeSHi 1.0.8.8
  1. .post h3 {
  2. margin:.25em 0 0;
  3.  
  4. dst
  5.  
  6. }
Parsed in 0.009 seconds at 4.81 KB/s

 

menjadi

CSS, using GeSHi 1.0.8.8
  1. .post h3 {
  2. margin:.25em 0 0 140px;
  3.  
  4. dst
  5.  
  6. }
Parsed in 0.009 seconds at 5.35 KB/s

 

Langkah Ketiga :

Karena ini hanya pada halaman depan saja, untuk menormalkan kembali pada halaman postingan maka kita harus menambahkan script css ini. ( simpan di bawah javascript read more otomatis di atas red ).

CSS, using GeSHi 1.0.8.8
  1. <b:if cond='data:blog.pageType == &quot;item&quot;'>
  2. <style>
  3. .post h3 { margin:.25em 0 0 0;
  4.  
  5. dst
  6. }
  7. </style>
  8. </b:if>
Parsed in 0.009 seconds at 12.96 KB/s

 

 


Quote of the day:
Tuhan Yang Maha Mulia dan Maha Besar berfirman : “Barang siapa yang sibuk membaca Al Qur’an dan dzikir kepada Ku dengan tidak memohon kepada Ku, maka ia Aku beri sesuatu yang lebih utama dari pada apa yang Aku berikan kepada orang yang minta – hadist qudsi
Page views this post: reader

25 komentar:

BRIGED MP SEGAMBUT said...

SELAMAT BERPUASA BUAT AKANG

Vivieck said...

prosesnya panjang juga ya kang...
jadi bingung juga..
tapi saya pelajari dulu deh...
mudah2an bisa...

abinya syafiq said...

bingung kang bacanya, pengen bisa,tapi liat segini aja udah pusing.

zoeL said...

tengkyu tutorialnya kang..

Zippy said...

Wadow...saya udah migrasi kang ke WP :D
Tapi keren tutornya.
Btw, met puasa kang :)

chugyGOGOG said...

Thanks untuk tutorialnya.
menarik sekali.

selamat puasa, siang , selamat beristirahat, tetap semngat dan happy blogging.

anak nelayan said...

asyik memang bisa kutak kutik lagi

eliana said...

trims untuk sharing nya :)
jadi terbantu sekali saya..

1000 Kunjungan gratis said...

Asslm,,,,

Kunjungan Balik nih Sob,
Thanks ya udah Berkunjung ke Rumahku...hehehe
Rumahnya (Blognya...red) tambah oke aja,
Gak bosen deh saya sempatkan untuk Datang ke Sini lagi..!!

Sob saya punya Blog baru nih,
Sempatkan untuk berkunjung ya, ini Rumah Baruku...
http://bajumuslimmuslimah.blogspot.com
http://pakaianbajupengantin.blogspot.com
http://caraloginfacebook.blogspot.com/

Salam Blogger, Sukses Menjalin Silaturahmi....


Wassalm,,,,

Blogger Newbie said...

ane juga belum ngerti gan. :hammer:

sul said...

terlebih dahulu saya mengucapkan slamt menunaikan ibadah puasa KANG, walapun dah terlambat...
dan tapi maksih ya atas tipsnya....

Vivieck said...

selalu nggak ngerti...
but...thxs kang...

niammuddin said...

halo kawan kawan blogger semuanya salam hangat akan lebih baik jika kalian mau mampir ke blog saya:
http://www.niamblog.co.cc

tyas said...

belum terlalu ngerti :(

yongki said...

otak atik lagi gan.haha

tas etnik said...

wah info bagus nih... ikut nimbrung ahh

Android Phone Tips said...

emang ga ngaruh buat serpnya gan kalo misalnya blog kita udah banyak keindex...??
maaf ane masih newbie neh.

hot mobile news said...

banyak amat ya kode-kodenya.. bingung nih...

kvvargask said...

http://hubpages.com/hub/After-bankruptcy-are-you-looking-for-updating-your-credit-report
After Bankruptcy discharge
After receiving your bankruptcy discharge papers the first thing you will want to do is get bankruptcy discharge updated and make sure that the information reported on it is correct.

acehomegazen said...

Nice Info guy,benar2 membuahkan hasil.. ane salut sama agan... acehomgezen,adseller..
adseller
saatnya kita bergerak maju
bersatu kita teguh
bercerai kita Runtuh
Seandainya kita benar benar jujur
Kita akan selalu di percayai
Teman Sejati Selalu Setia
Selalu terpecaya
Selalu Ada
Saat
Kita Perlu
Selalu Setia menemani

wuufi said...

Numpang promosi gan hehe ... www.wuufi.co.cc
Gan hnya artikel anda yang agak manjur dari sbagian besar di blog lain hehe

DNA Photography said...

agak ribet sih tutorialnya... tp mau aku coba dulu

cahbatik said...

bisa gak bisa harus coba

Purwa Sedana Rawks said...

suksma :)

purwa-sedana.blogspot.com

Ary_Putra said...

Terimakasih untuk Infonya , Blog nya Luaaarr Biasa sangat berarti dan berguna bagi saya. Jangan Lupa gan sempatin mampir n comment di blogku ya. Makasih sebelumnya gan.
MOTIVASI & INSPIRASI 100%
PAKET PERAWATAN KECANTIKAN ONLINE
Mengapa Tuhan Memberi Kita Masalah?
Bagus buat renungan (Baca saja klo ingin tahu)
Nih cewek atau cowok wajib baca gan !!
Perjalanan Hidup Manusia
Merencanakan Ekonomi cara Robert T. Kiyosaki
Kalo mau kaya, jangan pintar pintar
Tips sukses Bob Sadino- WARNING= SANGAT PROVOKATIF
Bodoh vs Pintar ( Nasehat Bagi Kita yang Tak Ingin Miskin )
Mr.JOGER ( Super Kreatif )
Nasi Sudah Menjadi Bubur
Adam Khoo, Dicap Bodoh, Tapi Sukses Luar Biasa
Ingin Kaya...? Jangan Jadi Karyawan
Kisah Sukses Dimas Hokka, Yang menjadi Dosen di Usia 13 tahun gan !!

TERIMA KASIH

Post a Comment

" Apapun Yang Dapat Anda Lakukan, Atau Ingin Anda Lakukan Mulailah

Keberanian Memiliki Kecerdasan, Kekuatan Dan Keajaiban Di Dalam-nya"

Makacih Atas Komentar-Nya

 

Copyright 2009. Home | Serba Serbi Google | XHTML | CSS Design by Catalog-Tutorial