Artikel terkait dengan efek scroll

Sesuai permintaan Sahabat LOL1ds yang berkomentar "kang cara buat artikel terkait itu gmn? " O.k Sob mungkin Artikel seperti ini cukup banyak udah di posting di blog2 dunia Maya apalagi di blog master2 blogger tapi engga' apalah apa salahnya kalo saling berbagi ilmu nge-BLOG dari pada capek2 cari Keyword di mbah GuGeL mungkin Posting LOL1dsini bisa barmanfaat buat sahabat2 yg udah mampir di blog yg aneh ini O.k langsung saja : " Oia, ini untuk Blogspot ya "

1. Login di account blogger sahabat
2. Pilih Tata Letak ---> klik edit HTML [ back up dulu template lengkap Sahabat biar kalo ada kesalahan bisa dikembalikan ke asalnya ],kalo sudah jangan lupa klik "Expand Widget Templates" .
3. Cari Code seperti  ini : <p><data:post.body/></p>
[cari semirip mungkin ya, biasanya ada template yg udah di modifikasi ]
4. kalau sudah ketemu silahkan copy kode berikut ini kemudian paste dibawah kode tadi .


<b:if cond='data:blog.pageType == "item"'> <H2>Artikel Terkait:</H2> <DIV class='rbbox'> <DIV style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'> <DIV id='albri'/> <SCRIPT type='text/javascript'> var homeUrl3 = "<data:blog.homepageUrl/>"; var maxNumberOfPostsPerLabel = 4; var maxNumberOfLabels = 10; maxNumberOfPostsPerLabel = 100; maxNumberOfLabels = 3; function listEntries10(json) { var ul = document.createElement('ul'); var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i < maxPosts; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { alturl = entry.link[k].href; break; } } var li = document.createElement('li'); var a = document.createElement('a'); a.href = alturl; if(a.href!=location.href) { var txt = document.createTextNode(entry.title.$t); a.appendChild(txt); li.appendChild(a); ul.appendChild(li); } } for (var l = 0; l < json.feed.link.length; l++) { if (json.feed.link[l].rel == 'alternate') { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k<20; k++) label = label.replace("%20", " "); var txt = document.createTextNode(label); var h = document.createElement('b'); h.appendChild(txt); var div1 = document.createElement('div'); div1.appendChild(h); div1.appendChild(ul); document.getElementById('albri').appendChild(div1); } } } function search10(query, label) { var script = document.createElement('script'); script.setAttribute('src', query + 'feeds/posts/default/-/' + label + '?alt=json-in-script&callback=listEntries10'); script.setAttribute('type', 'text/javascript'); document.documentElement.firstChild.appendChild(script); } var labelArray = new Array(); var numLabel = 0; <b:loop values='data:posts' var='post'> <b:loop values='data:post.labels' var='label'> textLabel = "<data:label.name/>"; var test = 0; for (var i = 0; i < labelArray.length; i++) if (labelArray[i] == textLabel) test = 1; if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length <= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels; if (numLabel < maxLabels) { search10(homeUrl3, textLabel); numLabel++; } } </b:loop> </b:loop> </SCRIPT> </DIV> <script type="text/javascript">RelPost();</script> </DIV> </b:if>


5. Kalau sudah silahkan dicari lagi kode seperti ini : ]]></b:skin> 
6. Kalau sudah ketemu copy kode dibawah ini kemudian paste " diatas" kode ]]></b:skin> tadi.

/*-----------------------------
kode related post optimal
visit http://www.ateonsoft.com
------------------------------*/
.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}

    
7. Setelah itu copy kode dibawah ini lagi tapi  paste "dibawah" kode ]]></b:skin> tadi :

<SCRIPT src='http://ateon.fs.googlepages.com/kodescript.js' type='text/javascript'/>

Kalau sudah silahkan disimpan templatenya. Lihat hasilnya dengan membuka salah satu artikel di blogger Sahabat.. kamu Bingung.. sama...!! Kalo berhasil hasilnya akan sama seperti blog LOL1ds ini..
Semoga bermanfaat sahabat.

ICON comment di judul posting

Pengen Buat ICON komentar disebelah judul posting seperti gambar dibawah ini :

O.k tanpa Bangsa Banci.. Maksud Aku "Tanpa Basa basi" pengen buat Icon seperti itu silahkan ikuti Tips and triksnya dibawah ini :

1. Login di dasbor blog anda, untuk Blogger silahkan KLIK here
2. Pilih Tata letak ►buka halaman "EDIT HTML", ► kemudian beri tanda centang pada "Expand Template Widget". [ upss.s.. hampir lupa, Backup dulu ya Templatenya biar kalo Error Coding bisa di kembalikan lagi]  kalo sudah terus cari kode seperti dibawah : [ untuk template yg udah di modifikasi silahkan menyesuaikan, paling engga' cari code HTML yg hampir sama dgn code dibawah ini ]

<a expr:href='data:post.url'><data:post.title/></a>

3. kalo sudah ketemu, tinggal Copy-paste aja semua kode dibawah ini dan letakan saja dibawah kode diatas.

<b:if cond='data:blog.pageType != &quot;item&quot;'> <img border='0' src='http://1.bp.blogspot.com/_C6KkooKXCEw/SJGzpJXhKoI/AAAAAAAACGw/QZ7IzDBHgFU/s400/icon_comments.png'/> <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <b:else/><data:post.numComments/></b:if></a> </b:if>

4. klik simpan, dan lihat hasilnya.
Semoga berhasil :)

Meringankan Tampilan Blog dengan banyak Widget

Blog aku berat loadingnya, kenapa ya? Banyak faktor yang mempengaruhinya, antara lain; kebanyakan script, kebanyakan image, koneksi lagi lelet, dan sebagainya. Umumnya script dan image tersebut akan dimuat dalam suatu widget, iya khan? Berkaitan dengan widget tersebut, ada trik agar sedikit-banyaknya dapat mengurangi berat loading suatu blog.

Caranya cukup sederhana yaitu :

* Widget tampil di halaman depan saja.

Sisipkan kode di bawah ini dalam elemen widget yang akan ditampilkan di halaman depan.

<b:if cond="data:blog.url == data:blog.homepageUrl">
</b:if>

Contoh penggunaannya :

<b:widget id="HTML44" locked="false" title="Tips SEO" type="HTML">
<b:includable id="main">

<b:if cond="data:blog.url == data:blog.homepageUrl">

<!-- only display title if it's non-empty -->
<b:if cond="data:title != """>
</b:if></b:if></b:includable></b:widget><h2 class="title"><data:title></data:title></h2>
<div class="widget-content">
<data:content/>
</div>
<b:include name="quickedit">

</b:if>

</b:includable>
</b:widget>

* Widget tampil di halaman selanjutnya.

Sisipkan kode di bawah ini dalam elemen widget yang akan ditampilkan di halaman selanjutnya.

<b:if cond='data:blog.pageType == "item"'>
</b:if>

Contoh penggunaannya :

<b:widget id="HTML45" locked="false" title="Trik Blogger" type="HTML">
<b:includable id="main">

<b:if cond='data:blog.pageType == "item"'>

<!-- only display title if it's non-empty -->
<b:if cond="data:title != """>
</b:if></b:if></b:includable></b:widget><h2 class="title"><data:title></data:title></h2>
<div class="widget-content">
<data:content/>
</div>
<b:include name="quickedit">

</b:if>

</b:includable>
</b:widget>

Catatan :
1. Kode di atas dapat dilihat saat kamu melakukan edit template (Tata Letak --> Edit HTML -- > centang "Expand Template Widget").
2. Pilihlah widget yang menurut kamu sesuai untuk ditampilkan dan widget mana yang tidak perlu ditampilkan, baik di halaman depan maupun di halaman selanjutnya.
3. Pemilihan widget diutamakan yang memuat script dan image.

Selamat mengoptimalkan tampilan widget dalam blog...

Menampilkan Jam Di Status Bar

Kurang lebih seperti itu deh, Coz setiap browser kadang-kadang ada yang berbeda tapi tetep nampilkan waktunya kok. kalo anda tidak bisa lihat penunjuk waktunya mungkin anda harus men-Setting terlebih dahulu “Tampilkan Status Bar-nya” pada Browser yang anda Gunakan.
Disini Saia ambil contoh pada browser OPERA :
1. Buka Browser OPERA anda
2. Pilih Tab VIEW ---> Toolbars ---> Klik Kanan Pada Status BAr
3. Selesai.Cuma itu Settingan-nya
dan ini Code Untuk Menampilkan Jam Di status bar itu :

<script language="JavaScript"> <br /><!-- </p> <p>    function Clock() { </p> <p>        window.setTimeout( "Clock()", 1000 ); </p> <p>        now = new Date(); <br />localtime = now.toString(); <br />hours = now.getHours(); <br />mins = now.getMinutes(); <br />secs = now.getSeconds(); <br />if (hours > 12) <br />hours = now.getHours()-12; <br />        self.status = "Jam " + hours + " Lewat " + mins + " Menit, " + secs + " Detik ".toString(); </p> <p>    } <br />Clock() <br />// --> <br /></script>

Kalo udah COpy-PASte Scrips tersebut di NotePad.
Lalu ikuti langkah berikut ini :
1. Login di Account Blogs anda
2. Pilih Tab LayOut ---> tambah Elemen Halaman
3. Pilih Tambah HTML / Scrips
4. Copy Paste Code Scrips diatas
5. kalo udah selesai Simpan / Save ya.
6. tempatkan elemen Halaman tsb dimana yang anda suka dan lihat hasilnya pada Browser anda.

Selamat mencoba.

Isengin WEB dengan Animasi...!

Kalo sudah terbuka Link tersebut silahkan Copy code Hack dibawah ini :

javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.getElementsByTagName("img"); DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=(Math.sin(R*x1+i*x2+x3)*x4+x5)+"px"; DIS.top=(Math.cos(R*y1+i*y2+y3)*y4+y5)+"px"}R++} setInterval('A()',5); void(0);

kalo sudah di Copy Silahkan di Paste COde Hack pada Address Bar dimana Link Browser tadi terbuka. seperti contoh dibawah ini : ( Block Warna B i r u pd address Bar )

Kalo sudah Press ENTER dan lihat hasilnya ^_* . [ Berlaku untuk semua Blog/web/situs yang mendukung adanya image/gambar ] kalo pengen ngembalikan ke asalnya tinggal tekan F5 atau refresh Page tadi, gampangkan... Buat cuci Mata...  s33 U...

Falkner Press Blogger Template

DEMO I DOWNLOAD

Platform : Blogger
Title Theme : Falkner Press Blogger Template
Author : Kranthi (Blogger Triks)
URL Author : http://bloggertricks.com

Description:* Automatic Thumbnails on posts
* Automatic Post Summarize
* Featured Content Slider
* Adsense ready
* PSD Custom Logo Included
* Youtube Video embedding Integrated
* Fully SEO Optimized
* Advertisement Block Ready
* 3 Columns * Social Bookmarking Icons
* Twitter Updates widget
* Feedburner Email Subscription ready
* Thumbnails on Recent Posts in Sidebar
* Integrated Search box
* Beautiful top Navigation bar
* Cross-browser compatible

Dark Side Blogger Template

DEMO I DOWNLOAD

Platform : Blogger
Theme : Title Dark Side Blogger Template
Author : Akanglil
URL Author : http://aalil.blogspot.com

Description:
Dark Side Blogger Template is modification from minima template blogger and inspiration from shades of gray joomla template. Simple template with 3 collumns footer.