sliding box
Recommended Post Slide out for Blogger - Mungkin sobat pernah mengunjungi beberapa situs yang menggunakan slidebox recommendation, atau kotak yang bergeser ke samping ketika mouse discroll ke bawah yang berisi tulisan Rekomendasi Untuk Anda. Slide box seperti ini bisa sobat temukan di situs inilah.com.

Isi dari Box Rekomendasi ini adalah related post with thumbnail, selain related posts juga ditampilkan random post apabila pengunjung berkali-kali mengunjungi alamat yang sama. Hal ini dilakukan agar pengunjung betah di blog dengan membaca beberapa artikel kita sekaligus.

Artikel ini direquest oleh Jeng +Leony Li dan script bukan murni buatan saya, hanya saya edit beberapa kode yang diperlukan saja. Kode yang saya pakai untuk membuat recommended box ini adalah :
1. Sliding Statis Social Widget dari Kompi Ajaib.
2. Related Post with Thumbnail dari DTE.


Bagi sobat yang ingin menerapkan, silahkan ikuti langkah mudahnya :

Langkah 1 : Simpan kode ini di atas ]]></b:skin>

/* Related Post with Sliding CSS by Kang Ismet*/
#kislidingbox{background:#fff;border-top:1px solid #bbb;box-shadow: 0 4px 10px #666;transition:all 0.4s ease-out;width:355px;height:185px;position:fixed;overflow:hidden;border:none;right:-360px;z-index:9999;text-align:left!important;letter-spacing:0;}
.kislidingbox-title{background:none;border-top:1px solid #ddd;color:#00789d;display:block;height:40px;width:100%;font-size:14px;font-family:Arial, sans-serif;text-transform:capitalize;font-weight:bold;padding-right:25px}
.kislidingbox-title span a{float:right;height:40px;width:25px;}
a#kislidingbox-close, a#kislidingbox-close {margin-right:15px;}
.kislidingbox-title > span > h2{font-size:20px!important;font-weight:normal!important;}
.kislidingbox-title span a img{margin:16px;border:0 !important;box-shadow:0 !mportant;}
.kislidingbox-container{border:none;float:left;width:100%;height:auto;margin:3px}
.kislidingbox-container > div{border:none;height:40px;margin:3px;padding:10px;}
.kislidingbox-container > div > span {font-size:14px;}
.kislidingbox-container img{float:left;margin:3px 5px;width:25px;border:1px solid #ccc;}
.show{bottom:80px;}
.hide{bottom:-145px;}
.related-post {margin:2em auto 0;font:normal normal 11px/1.4 Arial,Sans-Serif;}
.related-post h4 {font-size:150%;margin:0 0 .5em;}
.related-post-style-2 {border-top:1px solid rgba(0,0,0, 0.2);margin-top:-20px;padding-top:15px;list-style:none;}
.related-post-style-2 li {margin-left:-10px;style:none;}
.related-post-style-2 li {padding:0 10px 10px 10px;overflow:hidden;}
.related-post-style-2 li:first-child {border-top:none}
.related-post-style-2 .related-post-item-thumbnail {width:45px;height:45px;max-width:none;max-height:none;background-color:transparent;border:none;padding:0;float:left;margin:2px 10px 0 0;border:1px solid #ccc;}
.related-post-style-2 .related-post-item-title {font-weight:bold;font-size:120%;text-transform:capitalize;}
a.related-post-item-title {color :#333 !important;}
a:hover.related-post-item-title {color :#0491ea !important;text-decoration:none;}
.related-post-style-2 .related-post-item-summary {display:block;overflow:hidden;}
.related-post-style-2 .related-post-item-more {}
/* End CCSS Related Post with Sliding */

Langkah 2 : Simpan kode ini diatas </head>

<script type='text/javascript'>
$(window).scroll(function(){
        if ($(this).scrollTop() &gt; 400) {
            $(&#39;#kislidingbox&#39;).css({&#39;right&#39;:&#39;0px&#39;});
        } else {
            $(&#39;#kislidingbox&#39;).css({&#39;right&#39;:&#39;-360px&#39;});
        }
    });
    
$(document).ready(function(){
 var kislidingbox      = $(&#39;#kislidingbox&#39;);
    var closed      = $(&#39;#kislidingbox-close&#39;);
    var minimize    = $(&#39;#kislidingbox-minimize&#39;);
    var maximize    = $(&#39;#kislidingbox-maximize&#39;);
    
    maximize.hide();
    
    closed.click(function(){
        kislidingbox.css({&#39;right&#39;:&#39;-350px&#39;});
        kislidingbox.fadeOut(&#39;slow&#39;);
    })
    minimize.click(function(){
        kislidingbox.toggleClass(&#39;hide&#39;);
        $(this).hide();
        maximize.show();
    })
    maximize.click(function(){
        kislidingbox.toggleClass(&#39;hide&#39;);
        $(this).hide();
        minimize.show();
    })
});
</script>
Langkah 3 : Simpan kode ini di bawah <div class='post-footer'> yang ke 2
<!-- Related Post with Sliding by Kang Ismet -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='show' id='kislidingbox'>
    <div class='kislidingbox-title kislidingbox-www'>
      <span style='float: left;margin:14px 0 0 15px;'>Rekomendasi Untuk Anda</span>
        <span><a href='javascript:void(0);' id='kislidingbox-close' title='close'><img alt='close button' class='a' src='http://2.bp.blogspot.com/-IuwrMRddJPA/Uj0EKnY22II/AAAAAAAAFhM/V6cKdl07Bxc/s1600/close.png' title='close'/></a></span>
        <span><a href='javascript:void(0);' id='kislidingbox-minimize' title='minimize'><img alt='minimize button' src='http://4.bp.blogspot.com/-QMHVEsX6RI0/Uj0EKiuxajI/AAAAAAAAFhQ/7bebcoyuHKw/s1600/minimize.png' title='minimize'/></a></span>
        <span><a href='javascript:void(0);' id='kislidingbox-maximize' title='maximize'><img alt='maximize button' src='http://1.bp.blogspot.com/-spQvK4i4SNk/Uj0EKjKvMpI/AAAAAAAAFhc/CBa6r6ArUHA/s1600/maximize.png' title='maximize'/></a></span>
    </div>
    <div class='kislidingbox-container'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <div class='related-post' id='sliding-tab'/>
  <script type='text/javascript'>
  var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
          &quot;<data:label.name/>&quot;<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
      </b:loop></b:if>];
  var relatedPostConfig = {
      homePage: &quot;<data:blog.homepageUrl/>&quot;,
      widgetTitle: &quot;&lt;h4&gt;&lt;/h4&gt;&quot;,
      numPosts: 2,
      summaryLength: 0,
      titleLength: &quot;auto&quot;,
      thumbnailSize: 45,
      noImage: &quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC&quot;,
      containerId: &quot;sliding-tab&quot;,
      newTabLink: false,
      moreText: &quot;&quot;,
      widgetStyle: 2,
      callBack: function() {}
  };
  </script>
  <script src='http://blogger-json-experiment.googlecode.com/svn/resources/related-post/related-post.min.js' type='text/javascript'/>
</b:if>         
    </div>
</div>
</b:if>
<!-- Related Post Widget End --> 

223 komentar

«Paling tua   ‹Lebih tua   1 – 200 dari 223   Lebih baru›   Terbaru»

Keren kang penggabungannya :-bd

Balas

beuuuh... eta PPna berobah deui :-d

Balas

kang ismet saya habis ngirim pesan di kontak antum..

Balas

waw keren...jadi pengen nyoba juga kang,
izin praktek y :D

Balas

saya sudah balas.. silahkan dibaca

Balas

mangga... salam ka urang cikuda :)

Balas

siap kang hehe...

sudah dicoba kang, tapi thmbnailnya gambarnya terpotong setengah, jadi seperti menjorok ke sebelah kiri...itu kenapa ya kang apa ada kesalahan pas pemasangannya ? nuhun

Balas

kode yang ini .related-post-style-2 li {margin-left:-50px; ganti jadi -10px kang

Balas

wui.. ternyata sudah siap pr nya. thankyu kang ismet |o| langsung praktek

Balas

oh ya kang, bisa bentrok ga sama artikel terkait yang sebelumnya?

Balas

ada yg baru lg nih.. keren, btw sblm praktek cara ganti warna backgroundnya gmn kang? soalnya blog ane bukan warna putih

Balas

sudah kang...Alhamdulillah uda jadi :D
nuhun kang

Balas

ini yg aku cari kang.. akhirnya udah bisa. lancar pokoke

Balas

ntar saya coba, terima kasih tutorialnya.

Balas

Nambahin berat blognya pakek banget apa gak ya kang?

Balas

tergantung script sebelumnya.. kalau sama ya mungkin aja bentrok

Balas

liat aja kode yang palingatas :)

Balas

hehehe.. saya udah liat diblognya :-d

Balas

ya itu sih terserah.. mau pake apa ngga :) kalau dibilang berat, kayaknya sih biasa aja

Balas

hehe ternyata tidak bentrok kang, dan udah saya ubah dikit kang, coba liat deh hehehe :)

Balas

menurut saya tidak berat mas Anwar Sofii, biasa yang buat berat adalah JavaScript, namun js yang kita pasang justru hanya menentukan jarak munculnya dan sembunyi kotak artikel terkaitnya.

Balas

kang, bagaimana hilangkan title nya? karena blog saya menggunakan tooltip pada link yang ada title, tooltipnya jadi tersembunyi kebelakang mas, kurang rapi kalau gitu.

Balas

sip kang tos tiasa...oia ini blog Kiki Dee

Balas

Kang bagaimana yah menghilangkan huruf "/" pada breadcrumbs yang kang ismet posting, yang bertajuk Breadcrumbs SEO Friendly dan Valid HTML5 setelah saya mengikuti tutorial tersebut seperti ada kode/simbol "/".
Contoh breadcrumbs saya : Home / » Label / » Postingan saya.
bagaimana yah mas ?

Balas

kayaknya harus di JS nya tuh

Balas

Keren kang, saya juga sudah pasang Related dan Random Posts tapi gk sliding. hehe..

Top dah tutorialna...

Balas

wah masa.. itu kodenya sama ko sama yang saya pake

Balas

Keren kanggg mantap lah...cuman pas dicoba di blog saya ada sesuatu yang jatuh kebawah. gak tau itu namaya apa bingung he...
https://lh4.googleusercontent.com/-CvaZCec561o/Uj-HC9LCeGI/AAAAAAAABcU/C21SJs43AQE/w686-h576-no/contoh.JPG

Balas

kayaknya ada script yang bentrok :)

Balas

Iya kang di pasang buat blog satunya lagi aja lah hatur nuhun kang...

Balas

Muhun kang, kang pengen manipulasi deleted-comment apakah penulisan kode CSS nya seperti ini benar. .deleted-comment .comment_header .comment_name . comment_service {display:none}

Balas

maksudnya disembunyikan, atau diganti teks?

Balas

disembunyikan kang, jadi yang ada cuman .comment_body.

Balas

cukup gini aja sob .deleted-comment {display:none}

Balas

Kok g bisa kang Ismet? Padahal saya sudah melakukan 3 tahap kode diatas dengan benar, namun saya masih keliru dengan kode <div class='post-footer'> karena ada 2 diblog saya. Tapi pas saya pindahkan dari kode 1 ke kode 2 tetep aja tidak bisa kang? Mohon bantuan na atuh kang..

Balas

Mantap bin surantap kang .. urang cobian ah

Balas

coba pasang kode html nya di bawah kode related post sebelumnya

Balas

hehe udah kang, gambar yang blur juga sudah diperbaiki

Balas

benar kang lihat saja blog saya..

Balas

kang di blog saya ga bisa di maximize, minimize dan di close.. :(

Balas

blognya yang skulllyrics.blogspot.com kan?

Balas

coba yang jquery 1.3.2 hapus

Balas

Kok artikel no 1 pada sliding boxnya sama dengan artikel yang kita baca ya kang ?

Balas

kadang berubah kalau sudah banyak artikel pada label tersebut, bahkan diluar label.. coba load ulang

Balas

kang, bisa gak back to top dipasang berdampingan dengan slide box, seperti disamping tombol delete?

Balas

bisa.. tambah lagi scriptnya :)

Balas

kemarin saya sudah pasang back to top yang kang ismet share, yang saya bingung adalah bagaimana cara pasang kode pemanggilnya, minta solusinya kang

Balas

pas dihapus malah ga muncul kang

Balas

kalau pake ini, isi komentarnya ilang kang. Maksudnya header komentar hilang hanya pada komentar yang terhapus..

Balas

keren kang,,, kapan2 boleh dicoba :)

Balas

artikel rekomendasinya kok kosong kang? tampilannya uda mau keluar tp itu artikel rekomendasinya kosong/gak muncul

Balas

keren kang artikelnya, kebetulan lagi cari, terima kasih kang artikelnya

Balas

mungkin ada script yang bentrok

Balas

Sam@ blog anda ada dua Jquery, setiap blog hanya diperbolehkan saja Jquery, jika lebih bisa mengakibatkan JS tidak berfungsi, coba Update terbaru Jquerynya. :-bd

Balas

waaahhh.. keren kang, tak pasang dulu ah

Balas

ribet ngatur tag kondisionalnya sob.. nuju ujicoba yeuh

Balas

makasih om udah working :)

Balas

heheh mana solusinya kang? udah tiga hari nih menunggu surat cinta balasannya hehehehe
:)

Balas

pindah kesini ah.. kekecilan :) kirain udah beres..
coba simpan ini dibawah kode 'close' <span><a style="display:scroll" href='javascript:void(0);' onclick='jQuery(&apos;html, body&apos;).animate({scrollTop:0}, &apos;slow&apos;);' title="back to top"><img src="http://2.bp.blogspot.com/-QpkXizOtdSA/UkL22LD5nkI/AAAAAAAAFk4/WUzAyzQt0J0/s1600/top-arrow-red.png" /></a></span> demo http://duniaislam.kangismet.net/2013/07/fidyah-puasa-dan-ukuran-mud-yang-dikeluarkan.html

Balas

nah.. ini dia, ini baru karen kang.. siip dech |o|

terima kasih banyak kang, ngerepotin aja :)

Balas

bukan kang yang berilah.blogspot.com

Balas

saya liat normal2 aja ko
http://4.bp.blogspot.com/-aud-jv1oW6g/UkMS1F4xVdI/AAAAAAAAFlI/uBfCRVZD12k/s1600/breadcrumb.png

Balas

Susah work Kang, Abdi nerapkena dinu template fastest magz! Kumaha nya?

Balas

abdi teu gaduh fastest magzna kanggo ngetestna :)

Balas

gan ada yang bentrok nih.. mohon pencerahan
http://hekos-soft.blogspot.com

Balas

Wah Mantap lagi nih Kang, pantesan di blog
Sobat pada keren dan Bagus2 yah..ikitan belajar
Pasang nih Kang trima kasih

Balas

kalau tidak salah back to top itu dari tutorial kang ismet ya? coba dgn kode HTML ini

<!-- Related Post with Sliding by Kang Ismet -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='show' id='kislidingbox'>
<div class='kislidingbox-title kislidingbox-www'>
<span style='float: left;margin:14px 0 0 15px;'>Rekomendasi Berita Lainnya</span>
<span><a href='javascript:void(0);' id='kislidingbox-close' title='close'><img alt='close button' class='a' src='http://3.bp.blogspot.com/-SmFHPXwMFZA/Uj8zuJxElqI/AAAAAAAAMs4/v5qVv1iMmIo/s1600/close-btn.png' title='close'/></a></span>
<span><a href='javascript:void(0);' onclick='jQuery(&apos;html, body&apos;).animate({scrollTop:0}, &apos;slow&apos;);' style='display:scroll' title='back to top'><img src='http://4.bp.blogspot.com/-lTOHiX6XZXU/UkNZh6oD6nI/AAAAAAAAMvQ/ra6-hfpDTIU/s1600/top-arrow-red.png'/></a></span></div>
<div class='kislidingbox-container'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='related-post' id='sliding-tab'/>
<script type='text/javascript'>
var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
&quot;<data:label.name/>&quot;<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop></b:if>];
var relatedPostConfig = {
homePage: &quot;<data:blog.homepageUrl/>&quot;,
widgetTitle: &quot;&lt;h4&gt;&lt;/h4&gt;&quot;,
numPosts: 2,
summaryLength: 0,
titleLength: &quot;auto&quot;,
thumbnailSize: 45,
noImage: &quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC&quot;,
containerId: &quot;sliding-tab&quot;,
newTabLink: false,
moreText: &quot;&quot;,
widgetStyle: 2,
callBack: function() {}
};
</script>
<script src='http://blogger-json-experiment.googlecode.com/svn/resources/related-post/related-post.min.js' type='text/javascript'/>
</b:if>
</div>
</div>
</b:if>
<!-- Related Post Widget End -->


Cari CSS ini:

.related-post-style-2 li {margin-left:-10px, dan ubah margin-left:-10 menjadi margin-left:-50

buang kode back to top (hanya kode hmtl pada add gadget saja ya) semoga jawaban saya benar ya heheheh

Balas

tambah pusing mbak :D keluhan saya itu setelah membuat komentar dan di publikasikan background pesan komentarnya hilang

Balas

coba edit lagi CSS sesi komentarnya

Balas

gambarnya kok blur kang?

Balas

belom beres :) dipasang biar nambah klik

Balas

masalah terseleseikan kang :D makasih.. sukses pasang slide box hehehehe..

Balas

Saya sudah coba, tapi tidak bisa, apa karena <div class='post-footer'> di Blog saya cuma ada satu ????
atau karena saya sudah pasang releated post ?????

Balas

Terima Kasih kang, Sudah saya coba dan berhasil !!!

Balas

mantep kang, kin di cobian meh kece jiga blogna kang ismet. heheh.

nuhun kang elmu na. :D

Balas

Kereeeen.. saya udah pasangin, Nuhun ah kang !

Balas

coba aja di bawah related post sebelumnya

Balas

Bang. closenya kenapa gak fungsi ya di Blog ku

Balas

ini kenapa kang http://i.imgur.com/pYi23ch.png mumet gue,,

Balas

http://i.imgur.com/e4Xaqkv.png setelah saya teliti malah jadi kayak gini,hehe :D mumet kang

Balas

ok,,dah beres..teryata saya yang bodo,hehe :D

Balas

haha back to top nya kabur kebawah nih, dan back to top nya jika di klik kok kaburnya begitu cepat kang? heheheh :)

Balas

sorry banyak tanya saya mau tanya lagi,, http://img9.imageshack.us/img9/2369/z7cc.png

Balas

wkwkwkwk.. ga tau nih aneh :)

Balas

kang klo mau di taro di sebelah kiri gmn ????

Balas

harus ngedit beberapa kode, pada kode CSS right:-360px; ganti jadi left:-360px;pada script
$(window).scroll(function(){
if ($(this).scrollTop() &gt; 400) {
$(&#39;#kislidingbox&#39;).css({&#39;left&#39;:&#39;0px&#39;});
} else {
$(&#39;#kislidingbox&#39;).css({&#39;left&#39;:&#39;-360px&#39;});
}
});

Balas

yang mana tuh,,, saya cari dulu deh dan saya coba klo dah dpt,,,,,

Balas

Hola, no me funciona el script, lo coloco en esta pagina: http://economia.redignis.com y no me sale, lo agrego abajo de class='post-footerd y nada.

Balas

agregar jQuery a la plantilla, siga este tutorial

más : [url=http://blog.kangismet.net/2013/04/menambahkan-jquery-pada-template-blogger.html]Cómo Agregar jQuery Blogger La Plantilla [/url]

Balas

gak working mas ditempat saya ..

Balas

Diaplikasikan di template iklan baris nya Kang Ismet kog gak jalan ya Kang. Mohon pencerahannya Kang. Trims Kang sebelumnya

Balas

tambahkan jquery : http://blog.kangismet.net/2013/04/menambahkan-jquery-pada-template-blogger.html

Balas

Trims banyak Kang Ismet, sudah jalan nich hehehe

Balas

mantap sobat, keren bener sudah ane pasang di blog ane http://prediksibola888.blogspot.com/

Balas

Makasih mas akhirnya bisa juga punya box related post ginian.

Balas

Kang Is. Fitur Maximize, Minimize, ama Close kagak fungsi. ;(
Di blog saya fitur2 itu aku sembunyiin kang, orang kagak fungsi sih, gimana dong :(

Balas

terima kasih untuk infonya kang . . . .salam kenal dari nusa tenggara barat

Balas

terima kasih kan sebelumnya

mau nanya , membuat nya terlihat seperti rekomendasi seperti http://2.bp.blogspot.com/-KYhiKZRDsQg/Ult29rWI1QI/AAAAAAAAAEc/FPzQLz6L_Fg/s320/Capturefffnn.png ini kayak punya nya @Leony Li yang terlihat hanya 1 rekomendasi dan dengan cuplikan tulisannya

. . ,soalnya pngen kaya gitu . . .dibantu ya

Balas

saya juga sudah coba . . .berhasil juga :)

Balas

sudah saya coba ternyata berhasil juga ne . . . terima kasih kang

Balas

hatur nuhun kang :D, ilmunya bermanfaat sekali

Balas

kang kok di blog saya gak muncul ..

Balas

saya melihat blog anda kok ada dua jquery ya, coba dibuang satu, dan coba kembali. pada langkah 3 ini kita jangan fokus pada

<div class='post-footer'>

coba anda pasang kode pemanggilnya tepat dibawah Related Posts.

Balas

kalau ingin merubah tampilan seperti ini anda harus edit kembali css dan script nya. :)

Balas

hebring kang, alus,, jadi kayak web profesional hehehe,,, nuhun kang ah :)

Balas

hatur nuhun kang artikelna .... sukses selalu

Balas
Komentar ini telah dihapus oleh pengarang.

Alhamdulillah udah jadi kang, ini dia hasilnya, terlihat kren di blog ane, lihat disini : http://beritapohuwato.blogspot.com/2013/10/ini-dia-hasil-tes-hiv-ahok.html

Balas

kang di tempat saya ko gak atif ya ? apa ada kesalahan ?

Balas
Komentar ini telah dihapus oleh pengarang.

kayaknya ada yang bentrok.. ga tau sama prosentase atau apa

Balas

oh berarti hapus prosentasenya ya kang ?

Balas

coba backup dulu aja.. trial and error lah

Balas

maksudnya trial and error gimana kang?
saya sudah hapus persentase scrollnya tetep ga mau aktif kang

Balas

ya maksudnya dicoba2.. atau posisi script digeser paling bawah dll

Balas

Gak bisa gan
Cek dong http://trikblogger.net

Balas

saya tambah ya, karena bentrok, semua related-post nya saya ganti artikel-terkait, termasuk javascript yang berada di google code tetapi tetep gak bisa

Balas

Achmad Maulana Septiyan@

blog anda ada dua jquery mas, coba buang satu, dan dicoba Kembali. satu lagi yang harus anda perhatikan, jangan fokus saja pada <div class='post-footer'> untuk menempatkan kode html atau langkah ketiga. karena setiap template berbeda2 :)

Balas

kode pemanggilnya coba ditempatkan pada artikel terkait sebelumnya, maksudnya dibawah artikel terkait, jangan fokus saja pada kode
<div class='post-footer'>

Balas

ya' horeee . . . saya bisa ne . . .mbak . . . . salut

Balas

jquery blog anda ada dua mas.. setiap template hanya dibolehkan satu jquery, jika ada dua tentu bentrok

Balas

wah enak kang ismet nih punya asisten yang bantu jawab... salute :-d

Balas

kang bisa tanya gak , cara bikin http://4.bp.blogspot.com/-mfjiZCRyGyQ/Umez1vdH_II/AAAAAAAAAE0/kAtnK-iapLE/s1600/Capture.PNG seperti diatas judul posting diatas bagaimana ya . . mhon bantuannya ya ??? kalau bisa

Balas

kan udah di atas tadi.. kenapa dihapus? :) itu namanya BREADCRUMBS

Tutorial : [url=http://blog.kangismet.net/2013/09/breadcrumbs-seo-friendly-dan-valid-html5.html]Membuat Breadcrumbs SEO Friendly dan Valid HTML5[/url]

Balas

sebelumnya terima kasih gan . . .salut . .

Balas

maksudnya yang ini ?
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js' type='text/javascript'/>


itu yg baris kedua UI buat balikin navigator ke bentuk semula , terus gmn nih ? kalo yg satu di apus navigasi gak aktif

Balas

Kok di blog q div class='post-footer' cma ada satu kang,,,???

Balas

ga apa2.. coba aja disitu

Balas

berhasil kang makasih banyak..

Balas

Kang Punya Ane kok gak nongol ya ? Mohon pencerahannya

Balas

mudah aja mas bimbi anda tingal menambah code di bgian <div class='post-footer'> yang ke 2

seperti contoh di bawah ini




<div class='addthis_toolbox addthis_default_style '>
<a class='addthis_button_facebook_like' fb:like:layout='button_count'/>
<a class='addthis_button_tweet'/>

</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4f57432236fb4dee' type='text/javascript'/>
<script src='http://blogger-json-experiment.googlecode.com/svn/resources/related-post/related-post.min.js' type='text/javascript'/>

</b:if>
</div>
</div>
</b:if>
<!-- Related Post Widget End -->

Balas

mantapkan . . . . punya berhasil lho . . . terima kasih kang & selamat pagi

Balas

sama sekali gak bisa non, saya sudah taruh tuh diatasnya, dibawahnya tetap saja gak muncul, pliss help me... :(

Balas

Kang, saya mahukan related article ini muncul secara mendatar. Contoh seperti ini,
http://2.bp.blogspot.com/-ICIjR3uZO_Q/UpmhSj1jSrI/AAAAAAAAFts/1MfLrfII-nY/s1600/dsdsd.jpg

Bagaimana ya boleh saya buat? Mohon bantuan kang,

Balas

#kislidingbox harus dirubah ukurannya, pada .related-post-style-2 li tambahkan display:inline

Balas

kang untuk memperjelas gambarnya gimana cara editnya??
sekaligus nambah isi beritanya dikit di bawah judul juga editnya gimana kang??
mohon solusinya di tunggu :)

Balas

contohnya seperti ini kang
http://1.bp.blogspot.com/-pOS3cLbbGG8/UpnVQoBr5VI/AAAAAAAAAjo/9cjXzjEgy9Q/s1600/Untitled-2.png

Balas

kalau diperbesar biasanya pecah, harus diedit scriptnya. untuk menambahkan summary edit summaryLength: 0,

Balas

thanks kang solusinya dan udah bisa nambah kata di bawah judul
tapi yang gambarnya itu ngk tau cara editnya gimana kang. maklum deh kagak ngerti harus gimana hihihi :D

Balas

Tak berhasil kang. Mohon bantu editkan code nya.

Kalau boleh, macam ini pun baik,

http://3.bp.blogspot.com/-WDxDH2yjw7U/Upn4d1T7LeI/AAAAAAAAFt8/6tL4aK9NR4o/s1600/dsd.JPG

Balas

Kang, saya punya masalah yang sama nih kaya Kang Arif Rachman Hakim. Slide Box saya kosong. Bantu ya kang.

Balas

Kang punya saya kenapa g muncul ya kang, mohon koreksinya kang. Padahal langkah-langkahnya sudah saya ikuti dengan teliti kan.
ini blog saya http://webberbagi.blogspot.com/

Balas

punya saya malah serba salah kang, diblog saya udah dipasang script artikel terkait yang sama dari DTE yang rekomendasinya malah gak muncul nih kang :(

solusinya gimana kang ?

Balas

Ikutan nyimak gan, parantos lami ieu enteu bolgging. He..he.
Makin mantaB wae, Kang blog,kangismet ini.

Mohon ini belajar didieu nya Kang Ismet.
Mugi tambah sukses, Amiin yra...

Balas

Ijin saya share diblog saya. :) http://ikerenki.blogspot.com

Balas

saya pengen lihat mas sharenya ..akan saya kunjungi sebentar lagi tunggu ya Wussshh

Balas

kang, saya mohon dibalas. kenapa diblog saya slide box nya tidak muncul, padahal saya sudah benar mengikutu tutorial diatas?

Balas

kang punya saya kok nge-blank juga ya..??

Balas

alamat blognya yang mana? harus lihat dulu baru bisa menjawab pertanyaan anda, kang ismet lagi offline, mungkin sedang sibuk di dunia nyata, biar saya saja yang jawab pertanyaan anda :)

Balas

hehe di thumbnail ss nya ada logo ane kang :D .. ajipp , ngiring exist uyy .. hahaha

Balas

aih baik syekalee teteh yang satu ini :D ..

Balas

@kak leony li ni alamat blognya..http://teknocat.blogspot.com/

Balas

Kang mau tanya saya udah terapkan cara di atas di blog saya www,teknologitogether.blogspot.com tapi nggak muncul .. kira2x itu kenapa ya ??
saya coba sana sini tetap nggak mau muncul..
mohon bantuan nya ya kang :D

Balas

Mntab mas... bisa tak cobain dulu ya...

Balas

kang kok ane puny ngak muncul di samping tapi malah muncul di atas tempat komentar -_- tolong bantuannya kang :(

Balas

kang tolong kong ane punya ngak bisa :( pada hal sudah ane ikuti caranya

Balas

biasanya ada JS yang bentrok.. lumayan sih untuk menelusurinya, atau coba update dulu versi jQuerynya

Balas

mantep pisan kang ismet.. :)

Balas

Hehe, nemu juga akhirnya..... Berhasil kang dipasang di blog ane, sekalian izin share ya...!

Balas

Kang pas sy pasang kok related post yg dbawah postingan malah hilang.. sepertinya bentrok :( *minta sarannya*
gaulmania .com

Balas

mksih kang,,salam pentang baru..back link ya
http://belajarbahasainggrislebihmudah.blogspot.com/

Balas

makasih kang.. work.. manfaat banget tuh!!

bitx64.blogspot.com

Balas

hihii ketemu juga disini
thx sob

Balas

Kang, setelah 2 kali saya mencoba tentang tutorial ini baru berhasil, jadi sebuah kalimat perlu saya ucapkan yaitu "Terimakasih atas Tutorialnya" moga eksis selalu

Balas

saya coba kenapa gak muncul ya alias gak bisa :'(

Balas

kerenn abis tutorial artikel rekomendasi slidenya... layak dan patut dicoba...

Balas

mas..slidingnya masih berfungsi cuman artikel rekomendasinya udah blank. minta tutornya lagi dong.. :)

Balas

biasanya ada bentrok dengan artikel terkait yang lain

Balas

thanks kang ismet,,, kebetulan ni lagi nyari,,,thanks bangat deh pokok nya

Balas

Mantap kang.... cek www.fantasiku.com

Balas
Komentar ini telah dihapus oleh pengarang.

Mantap kang. Tapi kalau diubah sama artikel acak gimana caranya kang?

Balas

Berhasil gan !! thanks berat nih kang ismet..,
lihat aja di scienceandri.blogspot.com,,

Balas

works perfectly kang!! tapi ane ganti jadi dark warnanya =D
joss pokoe :-bd

Balas
«Paling tua   ‹Lebih tua   1 – 200 dari 223   Lebih baru›   Terbaru»

Poskan Komentar


×
Chat