Cara Kerja Mesin Pencari & Faktor Penentu Peringkat (Tips SEO)

Cara Kerja Mesin Pencari & Faktor Penentu Peringkat (Tips SEO)

Bagaimana cara kerja mesin pencari, mesin penelusuran, atau search engine?

Bagaimana mesin pencari Google dan Bing mengindeks dan memeringkat halaman blog atau postingan dan menampilkannya di halaman hasil pencarian (SERP)?

Ulasan berikut ini menjelaskan tentang cara kerja mesin penelusuran (search engine) pada umumnya. CB sadur dari Rumahweb.

Dengan mengetahui Bagaimana Cara Kerja Mesin Pencari & Faktor Penentu Peringkat, kita bisa melakukan pengoptimalan mesin pencari (SEO) agar mudah diindeks Google/Bing, tampil di halaman dan peringkat pertama, dan mendatangkan banyak pengunjung.

Mesin pencari bekerja secara otomatis melalui sistem tertentu untuk melakukan penelusuran dan memberikan hasil terbaik yang relevan dengan informasi atau artikel yang dicari oleh penggguna (user) atau penelusur.

Dengan memberikan informasi yang dibutuhkan, mesin penelusuran memastikan pengunjung akan mendapatkan informasi seperti yang mereka cari.

Indeks Mesin Pencari

Agar mesin penelusuran dapat mengidentifikasi halaman web yang tepat, ia harus memiliki catatan semua halaman web yang masih online.

Mesin pencari membuat indeks-indeks halaman web/blog. Indeks ini mengidentifikasi dan mengatur setiap website dan halaman web dengan cara menarik korelasi antara kata kunci yang dicari orang dan konten yang disertakan di setiap halaman.

Website Crawler

Mesin pencari tiap saat mengidentifikasi semua halaman web/blog yang ada. Bagian ini dikerjakan oleh website crawler.

Setiap kali website crawler menemukan halaman baru, ia terlebih dahulu menelusuri halaman tersebut. Gambaran cara kerja mesin pencari dan website crawl sebagai berikut:

Agar mudah dirambah dan diideks, pemilik website/blog dapat mempercepat proses crawling dengan mengirimkan peta situs (sitemaps) dan menggunakan tautan internal (intenal link).

Untuk mengirimkan peta situs ke mesin pencari, silakan buka laman Webmaster Tools dan Bing. Daftarkan  blog Anda di sana sekaligus daftarkan sitemapnya.

Di Google, kita bisa sekaligus "mengambil sebagai Google" (Fetch as Google) untuk mempercepat proses crawling dan indexing.

Faktor Penentu Peringkat

Banyak faktor untuk menentukan peringkat website atau halaman mana yang layak mendapat peringkat atas hasil mesin pencarian.  Faktor SEO bahkan mencapai 200. Silakan baca Google Ranking Factors.

Berikut ini beberapa penentu peringkat blog atau website di halaman hasil pencarian.

1. Tautan (links)

Tautan adalah faktor yang paling penting dalam SEO blog, terutama tautan eksternal yang berasal dari satu website ke website lain. Kita mengenalnya dengan nama backlink atau outbound link. (Baca: Cara Mendapatkan Backlink Berkualitas)

Backlink atau tautan website lain ke website Anda akan memberi sinyal kepada Google bahwa ada sesuatu yang otoritatif atau berharga pada laman yang ditautkan.

Jika ada sebuah halaman web yang banyak terhubung dengan website lain, tautan itu akan meningkatkan otoritas halaman tersebut.

Selain backlink, pastikan juga blog Anda memiliki internal link (tautan ke posting lain dalam blog Anda), baik di menu navigasi, sidebar, footer, dan terutama di dalam postingan. Pastikan tulisan Anda berisi minimal satu tautan internal dan satu tautan eksternal.

2. Usia Website

Website yang telah dibuat lama umumnya dianggap lebih terpercaya dan otoritatif daripada website baru. Blog baru jangan terlalu berharap cepat terindeks dan banyak pengunjung, kecuali konten atau postingan Anda benar-benar unik dan langka, belum ditulis blogger lain.

3. Kata kunci

Cara kerja mesin penelusuran adalah dengan mencari istilah di laman yang terkait dengan kueri penelusur. Semakin banyak Anda menggunakan kata kunci yang terkait, semakin banyak memberi sinyal ke mesin penelusuran bahwa konten Anda relevan.

Pastikan kata kunci yang Anda bidik dicantumkan di judul, alinea pertama, di bagian tengah, dan di bagian akhir tulisan. Ini dikenal dengan keywords density (kepadatan kata kunci), maksimal 3% dari jumlah kata dalam tulisan. Jangan berlebihan.

4. Ramah Seluler (Mobile-Friendly, Responsive)

Google menggunakan fitur konten yang ramah seluler sebagai faktor peringkat. Jika website Anda terlihat keren di desktop, tetapi tidak optimal di seluler, maka peringkat Anda bisa menurun karena hal ini.

Pastikan blog Anda ramah seluler dengan menggunakan template blog responsive. Mayoritas pengguna kini mengakses internet atau membuka halaman web/blog melalui perangkat seluler (HP). Google pernah mengingatkan dalam isu Mobile-Geddon.

5. Kecepatan Halaman (Fast Loading)

Laman yang dimuat lambat akan diberi peringkat lebih rendah oleh Google. Pastikan website Anda tampil cepat. Gunakan template ringan atau fast loading.

Jangan terlalu banyak memasan widget di sidebar atau footer. Perhatikan ukuran file foto. Penentu utama kecepatan halaman blog adalah script dan foto. Gak usah pasang macam-macam widget yang tidak perlu --hanya memberatkan loading.

6. Behavior Data

Google melacak apa yang dilakukan orang setelah mereka masuk ke halaman hasil mesin penelusuran. Jika seseorang mengklik sebuah halaman dan segera backtracks, artinya halaman tersebut tidak menyediakan apa yang mereka cari.

Namun, jika pengunjung menghabiskan waktu di laman atau bahkan mengklik ke halaman yang berbeda di situs yang sama, maka Google akan menambah peringkat di situs tersebut.

Google dan mesin pencari lainnya telah memberikan beberapa informasi tentang faktor peringkat yang mereka gunakan, tetapi mereka umumnya tetap merahasiakan cara algoritma mesin pencari mereka bekerja, dengan alasan keamanan dan menghindari peretas yang bisa memanipulasi hasil.

Konten Berkualitas

Selain keenam faktor di atas, konten tetap menjadi faktor SEO utama, sebagaimana dalam panduan Google.

Baca: Tips Membuat Konten Berkualitas dan Disukai Google

Konten atau tulisan Anda harus bermanfaat, unik, asli (bukan hasil copas), lengkap, dan dicari banyak pengguna internet.

Demikian ulasan tentang Bagaimana Cara Kerja Mesin Pencari & Faktor Penentu Peringkat Blog di halaman hasil pencarian. Good Luck & Happy Blogging! (www.contohblog.com).*

November 13, 2018

CB Simple Grid - Template Blogger SEO Friendly Terbaru untuk Segala Jenis Blog

CB Simple Grid - Template Blogger SEO Friendly Terbaru untuk Segala Jenis Blog

CB Simple Grid - Template Blogger SEO Friendly Terbaru untuk Segala Jenis Blog, mulai blog catatan, tips, trik, travel, blog foto, video, galeri, blog berita, hingga toko online (online strore).

Responsive Mobile-Friendly. SEO sudah dioptimalkan. AdSense Ready. Premium Theme!

Didesain dengan konsep tampilan website kekinian dengan sticky header all in one (plus menu responsive dan kotak pencarian).

Data CB Simple Grid - Template Blogger SEO Friendly Terbaru untuk Segala Jenis Blog

CB Simple Grid Responsive Mobile Friendly

CB Simple Grid Speed Fast Loading

Desktop: 100 Mobile: 75

CB Simple Grid Structured Data No Error

DEMO | ORDER

Demikian CB Simple Grid - Template Blogger SEO Friendly Terbaru untuk Segala Jenis Blog. Order Sekarang! Hanya Rp150.000,-

November 12, 2018

Tombol Berbagi Posting ke Media Sosial di Bawah Postingan Blog Fast Loading

Tombol Berbagi Posting ke Media Sosial di Bawah Postingan Blog Fast Loading

Cara Memasang Tombol Berbagi Posting ke Media Sosial (Social Share Button) di Bawah Postingan Blog Tanpa Javascrip Fast Loading.

CB baru saja memasang Tombol Berbagi Posting ke Media Sosial (Social Share Button) di Bawah Postingan Blog, Tanpa Javascrip, biar Fast Loading. Semula, CB menggunakan AddThis.

Biasanya, jika ada yang berubah atau hal baru di blog ini, suka ada yang tanya, bagaimana cara pasangnya, atau minta dikasi tau kode dan cara pasangnya.

Nah, berikut ini CB share kode dan Cara Memasang Tombol Berbagi Posting ke Media Sosial (Social Share Button) di Bawah Postingan Blog Tanpa Javascrip Fast Loading.

Demonya tentu saja ada di bawah tiap artikel di blog ini. Ini Penampakannya. Terdiri dari tombol share ke Facebook, Twitter, Google Plus, Pinterest, LinkedIn, dan WhatsApp (WA).

Cara Memasang Tombol Berbagi Posting ke Media Sosial

1. Tema > Edit HTML
2. Copas kode CSS Tombol Berbagi Posting ke Media Sosial berikut ini di atas kode ]]></b:skin>

.share{display:block;padding:0;margin:10px 0;}
.post-share,ul.share-links{position:relative;margin: 0;}
.post-share{overflow:hidden;line-height:0;margin:0}.share-links li a,.share-links li a:before{float:left;text-align:center;line-height:32px}.share-links li{width:32px;float:left;box-sizing:border-box;margin:0 5px 0 0;list-style:none}.share-links li.facebook,.share-links li.gplus,.share-links li.twitter{width:20%}.share-links li a{display:inline-block;cursor:pointer;width:100%;height:32px;color:#fff;font-weight:400;font-size:13px;box-sizing:border-box;opacity:1;margin:0;padding:0;transition:all .17s ease}.is-mobile li.whatsapp-desktop,.share-links li.whatsapp-mobile{display:none}.is-mobile li.whatsapp-mobile{display:inline-block}.share-links li a:before{display:block;width:32px;background-color:rgba(255,255,255,.07);font-size:15px}.share-links li a:hover{opacity:.8}.social a:before{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:400}.social .facebook a:before{content:"\f09a"}.social .twitter a:before{content:"\f099"}.social .gplus a:before{content:"\f0d5"}.social .linkedin a:before{content:"\f0e1"}.social .pinterest a:before{content:"\f0d2"}.social .whatsapp a:before{content:"\f232"}.social .external-link a:before{content:"\f35d"}.social-color .facebook a{background-color:#3b5999}.social-color .twitter a{background-color:#00acee}.social-color .gplus a{background-color:#db4a39}.social-color .pinterest a{background-color:#ca2127}.social-color .linkedin a{background-color:#0077b5}.social-color .whatsapp a{background-color:#3fbb50}.social-color .external-link a{background-color:#111}.social-text .facebook a:after{content:"Facebook"}.social-text .twitter a:after{content:"Twitter"}.social-text .gplus a:after{content:"Google Plus"}.social-text .linkedin a:after{content:"LinkedIn"}.social-text .pinterest a:after{content:"Pinterest"}.social-text .whatsapp a:after{content:"Whatsapp"}.social-text .external-link a:after{content:"WebSite"}@media screen and (max-width:540px){.share-links li a span{display:none}.share-links li.facebook,.share-links li.gplus,.share-links li.twitter{width:30px}}

3. Copas HTML Tombol Berbagi Posting ke Media Sosial berikut ini di bawah kode <data:post.body/> yang kedua atau ketiga.

   <div class='share'>
<div class='post-share'>
                  <ul class='share-links social social-color'>
                    <b:class cond='data:blog.isMobileRequest' name='is-mobile'/>
                    <li class='facebook'><a class='facebook' expr:href='&quot;https://www.facebook.com/sharer.php?u=&quot; + data:post.url' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=550, height=650, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow'><span>Facebook</span></a></li>
                    <li class='twitter'><a class='twitter' expr:href='&quot;https://twitter.com/share?url=&quot; + data:post.url + &quot;&amp;text=&quot; + data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=550, height=450, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow'><span>Twitter</span></a></li>
                    <li class='gplus'><a class='gplus' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=400, height=500, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow'><span>Google+</span></a></li>
                    <li class='pinterest'><a class='pinterest' expr:href='&quot;https://www.pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;media=&quot; + data:post.featuredImage + &quot;&amp;description=&quot; + data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=735, height=750, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow'/></li>
                    <li class='linkedin'><a class='linkedin' expr:href='&quot;https://www.linkedin.com/shareArticle?url=&quot; + data:post.url' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=950, height=650, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow'/></li>
                    <li class='whatsapp whatsapp-desktop'><a class='whatsapp' expr:href='&quot;https://web.whatsapp.com/send?text=&quot; + data:post.title + &quot; | &quot; + data:post.url' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=900, height=550, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow'/></li>
                    <li class='whatsapp whatsapp-mobile'><a class='whatsapp' expr:href='&quot;https://api.whatsapp.com/send?text=&quot; + data:post.title + &quot; | &quot; + data:post.url' rel='nofollow' target='_blank'/></li>
                  </ul>
                </div>
  <div class='clear'/>
</div>

4. Save! Simpan template!

Demikian cara memasang Tombol Berbagi Posting ke Media Sosial fast loading tanpa javascript. Good Luck & Happy Blogging! (www.contohblog.com).*

November 04, 2018

Cara Memasang Featured Post by Label di Halaman Depan Blog

Cara Memasang Featured Post by Label di Halaman Depan Blog

Cara Memasang Featured Post by Label di Halaman Depan Blog

Kita bisa memasang widget Featured Post yang sudah disediakan Blogger di Halaman Depan Blog. Namun, hanya satu posting saja yang bisa ditampilkan.

Jika ingin menampilkan lebih dari satu, berikut ini kode dan cara memasangnya. Penampilannya seperti gambar berikut ini. Sudah dibuat responsive.

Cara Memasang Featured Post by Label di Halaman Depan Blog

1. Tema > Edit HTML
2. Pasang kode CSS & Javascript Featured Post by Label berikut ini di atas kode </head>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
div#featured-posts-section{max-height:350px;overflow:hidden;background:#fff;}
#featured-posts-section{max-height:350px;overflow:hidden;margin:0 auto 20px}
.featured-post a{font-size:1.2em;color:#fff;}
.featured-post a:hover{color:#fff;text-decoration:underline;}
.main-post.featured-post a{margin:0;font-size:17px}
.featured-post .col-post{float:left;position:relative;overflow:hidden;margin:0 25px 0 0}
.featured-post .secondary-post{background:#dadada;width:32%;margin:0 0 20px 0;transition:all .4s}
.featured-post .main-post{background:#dadada;width:65%;padding:0;transition:all .4s}
.featured-post .main-post:before,.featured-post .secondary-post:before{bottom:0;content:&quot;&quot;;display:block;height:50%;width:100%;position:absolute;z-index:1;background:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%)}
.featured-post .main-post:after,.featured-post .secondary-post:after{content:&#39;&#39;;z-index:1;height:100%;width:100%;background:rgba(0,0,0,0.2);opacity:0;position:absolute;top:0;left:0;border-radius:50%;transform:scale(0,0);transition:all .4s}
.featured-post .main-post:hover:after,.featured-post .secondary-post:hover:after{opacity:1;transform:scale(1.5,1.5)}
.featured-post span{background:#c00;display:inline-block;color:#fff;font-style:normal;position:absolute;transition:all .4s;font-size:11px;line-height:1.4;padding:3px 6px;top:10px;left:10px;z-index:2}
.featured-post .main-post:hover span,.featured-post .secondary-post:hover span{background:#4aa3df;}
.featured-post img{height:100%;transition:all .5s}
.featured-post .main-post img{height:350px;width:100%;object-fit:cover;}
.featured-post .secondary-post img{height:165px;object-fit:cover;width:100%;}
.featured-post .main-post:hover img,.featured-post .secondary-post:hover img{backface-visibility:hidden;transform-style:preserve-3d;}
.featured-post header{position:absolute;bottom:0;left:0;right:0;padding:20px;z-index:2;background:url(http://4.bp.blogspot.com/-bp2HK6MdDXg/T5aB6vI5GPI/AAAAAAAAF98/gwCsmb8Fcks/s1600/transparant.png);}
.featured-post .secondary-post header{padding:10px}
.featured-post header h3{font-size:22px;}
.featured-post h4{font-size:15px;}
span.label-info a.label-block:nth-child(n+2),.showpageOf {display:none;}
@media screen and (max-width:768px) {}
@media screen and (max-width:640px) {}
@media only screen and (max-width:1024px){
div#featured-posts-section{padding:0}
}
@media only screen and (max-width:800px){
div#featured-posts-section{max-height:none}
.featured-post .main-post{width:100%;margin-bottom:10px}
.featured-post .secondary-post{width:50%}
.featured-post .secondary-post img{width:100%}
}
@media only screen and (max-width:600px){
.featured-post .main-post img{height:250px}
.featured-post .secondary-post{width:100%}
.featured-post .main-post h3.entry-title{font-size:16px;margin:0 10px;line-height:normal}
.featured-post .main-post h3.entry-title a{line-height:1.3em}
.featured-post header{padding:10px 0 5px}
}
@media only screen and (max-width:300px){
.featured-post .main-post h3.entry-title {font-size: 20px;}
}
</style>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(e,t){for(var s=e.split("<"),r=0;r<s.length;r++)-1!=s[r].indexOf(">")&&(s[r]=s[r].substring(s[r].indexOf(">")+1,s[r].length));return s=s.join(""),s=s.substring(0,t-1)}function sliderposts(e){j=showRandomImg?Math.floor((imgr.length+1)*Math.random()):0,img=new Array,numposts1<=e.feed.entry.length?maxpost=numposts1:maxpost=e.feed.entry.length;for(var t=0;t<maxpost;t++){var r,i,n=e.feed.entry[t],l=n.category[0].term,o=n.title.$t;if(t==e.feed.entry.length)break;for(var m=0;m<n.link.length;m++)if("alternate"==n.link[m].rel){i=n.link[m].href;break}for(var m=0;m<n.link.length;m++)if("replies"==n.link[m].rel&&"text/html"==n.link[m].type){r=n.link[m].title.split(" ")[0];break}if("content"in n)var g=n.content.$t;else if("summary"in n)var g=n.summary.$t;else var g="";postdate=n.published.$t,j>imgr.length-1&&(j=0),img[t]=imgr[j],s=g,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),-1!=a&&-1!=b&&-1!=c&&""!=d&&(img[t]=d);for(var h=[1,2,3,4,5,6,7,8,9,10,11,12],p=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],f=(postdate.split("-")[2].substring(0,2),postdate.split("-")[1]),u=(postdate.split("-")[0],0);u<h.length;u++)if(parseInt(f)==h[u]){f=p[u];break}if(0==t){var v='<div class="main-post col-post"><a href="'+i+'"><span class="blue">'+l+'</span><img src="'+img[t]+'" height="350" width="640" alt=""></img></a><header><h3 class="entry-title"><a href="'+i+'" title="">'+o+"</a></h3></header></div>";document.write(v)}else{var v='<div class="secondary-post col-post" style="margin-right:0"><span class="blue">'+l+'</span><a class="hover_play_small" href="'+i+'"><img src="'+img[t]+'" height="200" width="320"></img></a><header><h4><a href="'+i+'">'+o+"</a></h4></header></div>";document.write(v)}j++}}imgr=new Array,imgr[0]="http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif",showRandomImg=!0,aBold=!0,summaryPost=150,summaryTitle=50,numposts1=10,featured_numposts="3";
//]]>
</script>
</b:if>

3. Copas kode HTML Featured Post by Label berikut ini di bawah kode penutup navigasi menu blog Anda, atau di atas kode seperti <div class='main-wrapper'>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div class='ct-wrapper' id='featured-posts-section'>
<div class='featured-post padding clearfix'> 
<script type='text/javaScript'>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/Featured?max-results=&quot;+featured_numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=sliderposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
</div>
</div>
</b:if>
<div class='clear'/>

Kode warna merah (Featured) adalah nama label. Anda bisa ganti dengan nama label posting yang akan ditampilkan.

Jika ingin menampilkan posting terbaru, maka kodenya diubah menjadi /feeds/posts/default.

4. Save!

Demikian Cara Memasang Featured Post by Label di Halaman Depan Blog. Lihat juga Desain Featured Post lainnya.

Good Luck & Happy Blogging! (www.contohblog.com).*

October 30, 2018

Kumpulan Challenge 'Seberapa Gregetnya' yang Bikin Ngakak!

Kumpulan Challenge 'Seberapa Gregetnya' yang Bikin Ngakak!

Kumpulan Challenge 'Seberapa Gregetnya' Yang Bikin Ngakak!

NETIZEN atau warganet di media sosial sedang ramai membuat parodi-parodi "seberapa greget".

Twitter, Instagram, dan Youtube menjadi media sosial yang banyak digunakan untuk menyebarkan kata-kata kocak "Seberapa Gregetnya" ini.

Berikut ini Kumpulan Challenge 'Seberapa Gregetnya' yang Bikin Ngakak. Dikoleksi dari berbagai sumber, terutama di Twitter. Ada juga yang diambil dari tayangan di televisi.

Kumpulan Challenge 'Seberapa Gregetnya' yang Bikin Ngakak

- Seberapa geregetnya elo?
+ Kemaren gue ketemu kuntilanak
- Terus?
+ Kuntilanaknya gue ketawain!

- Seberapa geregetnya elo?

+ Gua beli jamu gendong.

- Trus?

+ Jamunya gua buang, Mbak Jamunya gua gendong!

- Seberapa geregetnya elo?

+ Gw lewat polisi tidur.

- Terus?

+ gua selimutin!

- Seberapa geregetnya elo?

+ Gua lihat polisi tidur.

- Terus?

+ Gua bangunin!

- Seberapa geregetnya elo?

+ Gua yang lapar.

- Terus?

+ Elu yang makan!

- Seberapa geregetnya elo?

+ Gua yang sakit, lu yang ke dokter!

- Seberapa geregetnya elo?
+ Gua ke rumah sakit, dokernya gua obatin!

- Seberapa geregetnya elo?
+ masak indomie, mienya gw buang, bungkusnya gw rebus!

- Seberapa geregetnya elo?
+ Tadi pagi ada tanah liat.
- Terus?
+ Yaudah gua liatin balik!

- Seberapa geregetnya elo?
+ Gua beli lumpia basah.
- Terus?
+ Gua keringin di mesin cuci!

- Seberapa geregetnya lo?
+ Tadi gua makan pisang
- Terus?
+ Kulitnya gua buang lah..!

- Seberapa geregetnya elo?
+ Semalem gw digigit nyamuk
- Trus?
+ Nyamuknya yang bentol!

- Seberapa geregetnya elo?
+ Kemarn ada nasabah yang curhat. 
- Terus?
+ Langsung gua panggil Mamah Dedeh!

- Seberapa geregetnya elo?
+ Gue ambil uang ke ATM.
- Terus?
+ Struknya gua ambil, duitnya gua buang!

- Seberapa geregetnya elo?
+ Gua Beli batagor.
- Terus?
+  gor-nya gua buang, bata-nya gua makan!

Bagaimana dengan Anda? Seberapa Gregetnya Anda ....?  

Silakan tambahkan di kolom komentar. Buat seru-serun aja. Happy Blogging! (www.contohblog.com).*

October 27, 2018

3 Cara Menampilkan Tulisan Terbaru (Recent Post) di Sidebar Blogger

3 Cara Menampilkan Tulisan Terbaru (Recent Post) di Sidebar Blogger

DAFTAR tulisan terbaru, artikel terbaru, atau posting terbaru (recent post) biasanya dipasang di sidebar.

Template bawaan Blogger, bahkan banyak juga template premium, yang tidak menampilkan widget recent post ini, sehingga kita harus pasang sendiri.

Cara Menampilkan Tulisan Terbaru di Sidebar Blogger

Ada tiga Cara Menampilkan Tulisan Terbaru (Recent Post) di Sidebar Blogger

1. Gunakan Widget Feed

Kita bisa menggunakan widget Feed bawaan Blogger untuk menampilkan posting terbaru di sidebar. Cara memasangnya sebagai berikut:

• Klik Layout (Tata Letak) > Add a Gadget > pilih Feed
• Masukkan alamat blog Anda.
• Klik "Continue"
• Ubah judul widget menjadi "Recent Posts" atau "Posting Terbaru"

2. Gunakan Kode

Cara di atas tidak belum tentu cocok dengan template blog yang Anda gunakan. Jika tidak bisa dengan cara di atas, Anda bisa gunakan cara kedua yaitu dengan menggunakan kode.

Cara Mamasangnya:

- Layout > Add a Gadget > pilih HTML/Javascript
- Isi judul widget dengan Recent Post atau Posting Terbaru
- Copas kode berikut ini di kolom konten.

<style>
img.rct-thumb{float:left;margin-right:14px;height:72px;width:72px;margin-top:1px}
.recent-by-tag{width:100%;margin:0;padding:0}
.recent-by-tag li{font-size:12px;list-style:none;padding-left:0;margin:0;padding:0;overflow:hidden}
ul.recent-by-tag li {padding: 10px 0;margin-bottom: 0;border-bottom: 1px dashed #f1f1f1;line-height: normal;}
.recent-by-tag a {font-size: 16px;font-weight:500;margin: 0;padding: 0;line-height: normal;}
.recent-by-tag strong{padding-left:0;font-weight:500}
span.showdates{font-size:11px;margin:10px 0 0}
</style>
<script type='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var showpostdate = false;</script>
<script type='text/javascript'>
//<![CDATA[
function rcentbytag(e){document.write('<ul class="recent-by-tag">');for(var t=0;t<numposts;t++){var n=e.feed.entry[t];var r=n.title.$t;var i;if(t==e.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var u=n.link[o].title;var f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var l;try{l=n.media$thumbnail.url}catch(h){s=n.content.$t;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!=""){l=d}else l="https://2.bp.blogspot.com/-giova1ZCh-A/Uzq6L8QTJNI/AAAAAAAAAJc/USXictTq_xs/s70-c/KM+Icon.png"}var p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var g=p.substring(8,10);var y=new Array;y[1]="Januari";y[2]="Februari";y[3]="Maret";y[4]="April";y[5]="Mei";y[6]="Juni";y[7]="Juli";y[8]="Agustus";y[9]="September";y[10]="Oktober";y[11]="November";y[12]="Desember";document.write('<li class="clear">');if(showpostthumbnails==true)document.write('<a href="'+i+'" target ="_blank" title="'+r+'"><img class="rct-thumb" alt="'+r+'" src="'+l+'"/></a>');document.write('<strong><a href="'+i+'" target ="_blank" title="'+r+'" rel="nofollow">'+r+'</a></strong>');document.write('<br>');var x="";var T=0;if(showpostdate==true){x='<span class="showdates">'+x+g+" "+y[parseInt(m,10)]+" "+v+"</span>";T=1}document.write(x);document.write("</li>");if(t!=numposts-1)document.write("")}document.write("</ul>")}
//]]>
</script>
<script>
document.write("<script src=\"/feeds/posts/default?orderby=updated&alt=json-in-script&callback=rcentbytag\"><\/script>");
</script>

Save! 
Kode di atas menampilkan Posting Terbaru berupa Judul dan Gabar Thumbnail seperti gambar ilustrasi di atas.

3. Menggunakan Feedburner

Cara ketiga Posting Terbaru Menampilkan Tulisan Terbaru (Recent Post) di Sidebar Blogger adalah dengan menggunakan Feedburner.

Cara Mamasangnya:

- Layout > Add a Gadget > pilih HTML/Javascript
- Isi judul widget dengan Recent Post atau Posting Terbaru
- Copas kode berikut ini di kolom konten

<script src="https://feeds.feedburner.com/contohblognih?format=sigpro" type="text/javascript" ></script><noscript><p>Subscribe to RSS headline updates from: <a href="http://feeds.feedburner.com/contohblognih"></a><br/>Powered by FeedBurner</p> </noscript>

- Ubah contohblognih dengan username atau ID FeedBurner Anda.
- Jika belum punya, buat dulu akun Feedburner, daftarkan blog Anda untuk mendapatkan kodenya.
- Di akun Feedbuerne blog Anda: klik menu Publicize > BuzzBoost > Save > Copas Kodenya

Demikian 3 Cara Menampilkan Tulisan Terbaru (Recent Post) di Sidebar Blogger. Good Luck & Happy Blogging! (www.contohblog.com).*

October 26, 2018

Cara Membuat Tombol Berbagi (Social Share Button) Show Hide Keren Responsive

Cara Membuat Tombol Berbagi (Social Share Button) Show Hide Keren Responsive

Cara Membuat Tombol Berbagi (Social Share Button) Show Hide Keren Responsive di Blogger.

DESAIN atau tampilan Tombol Berbagi (Social Share Button) model Show Hide Keren & Responsive mirip dengan Social Share yang dibagikan sebelumnya.

Tombol Berbagi Posting blog ke media sosial ini cukup lengkap, meliputi Facebook, Twitter, Google Plus, Line, WhatsApp (WA), LinkedIn, dan Pinterest.

Tampilan normalnya hanya tiga (Facebook, Twitter, Google Plus) ditambah tombol hide-show untuk menampilkan link share ke medsos lainnya. Ini penampakannya:

Cara Membuat Tombol Berbagi (Social Share Button) Show Hide

1. Tema > Edit HTML
2. Copas kode berikut ini di atas kode </head>

<style>
/* CSS Share Button */
#share_btnper{margin:5px;padding:0}
.showother{display:none}
.share_btn{position:relative;margin:0;padding:0;display:block;overflow:hidden}
.share_btn ul,ul .showother{position:relative;margin:0;padding:0;font-size:12px}
.share_btn ul li{float:left;display:inline-block;overflow:hidden}
.share_btn li a,.shareplus{color:#fff;padding:0;width:40px;display:block;text-align:center;height:35px;line-height:35px;transition:all 0.25s;margin:0 5px 5px 0;text-transform:uppercase;letter-spacing:1px;border-radius:4px;overflow:hidden}
.share_btn i{font-size:16px;padding:0;margin:0;line-height:35px;text-align:center}
.shareplus{padding:0;background:#aaa;cursor:pointer}
.share_btn li a.fb i,.share_btn li a.tw i{width:20px;text-align:left}
.share_btn a:hover{background:#333}
.share_btn li a.fb{background:#4867aa;padding:0 35px;width:auto}
.share_btn li a.tw{background:#1da1f2;padding:0 35px;width:auto}
.share_btn li a.gp{background:#dc4a38}
.share_btn li a.pt{background:#ca2128}
.share_btn li a.le{background:#0673ab}
.share_btn li a.tr{background:#43556e}
.share_btn li a.em{background:#141b23}
.share_btn li a.ln{background:#00c300}
.share_btn li a.bm{background:#000}
.share_btn li a.wa{background:#4dc247}
.share_btn li a:hover,.shareplus:hover{-webkit-filter:grayscale(100%);opacity:0.8}
@media screen and (max-width:600px){
.share_btn li a.fb,.share_btn li a.tw{padding:0 37px}}
@media screen and (max-width:480px){
.share_btn li a.fb,.share_btn li a.tw{padding:0 25px}}
@media screen and (max-width:320px){
.share_btn ul li a.fb,.share_btn ul li a.tw{padding:0 14px}}
</style>

3. Copas kode berikut ini di bawah kode
<b:includable id='shareButtons' var='post'> ... </b:includable> 
atau di atas kode     
<b:includable id='status-message'>

          <b:includable id='sharethis' var='post'>
<div class='share_btn'><ul>
<li><a class='fb' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:blog.url' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=626,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' title='Share to Facebook'><i class='fa fa-facebook'/> SHARE</a></li>
<li><a class='tw' expr:href='&quot;http://www.blogger.com/share-post.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;postID=&quot;+ data:post.id + &quot;&amp;amp;target=twitter&quot;' expr:title='data:top.shareToTwitterMsg' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' target='_blank'><i class='fa fa-twitter'/> SHARE</a></li>
<li><a class='gp' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:blog.url' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' target='_blank' title='Share on Google+'><i class='fa fa-google-plus'/></a></li>
<div id='showshare'><span class='shareplus' href='javascript:void(0)' onclick='document.getElementById(&apos;showother&apos;).style.display=&apos;block&apos;;document.getElementById(&apos;showshare&apos;).style.display=&apos;none&apos;'><i aria-hidden='true' class='fa fa-plus'/></span></div>
</ul>
<ul class='showother' id='showother'>
<li><a class='pt' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;amp;media=&quot; + data:post.thumbnailUrl + &quot;&amp;amp;description= + data:post.title&quot;' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' target='_blank'><i class='fa fa-pinterest'/></a></li>
<li><a class='le' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' target='_blank' title='Share on LinkEdin'><i aria-hidden='true' class='fa fa-linkedin'/></a></li>
<li><a class='tr' href='http://www.tumblr.com/share' onclick='window.open(this.href,&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' target='_blank'><i class='fa fa-tumblr'/></a></li>
<li><a class='ln' expr:href='&quot;https://timeline.line.me/social-plugin/share?url=&quot; + data:post.url' target='_blank' title='Share On Line'>
  <svg class='icon icons8-LINE' viewBox='0 0 48 48'>
    <path d='M12.5,42h23c3.59,0,6.5-2.91,6.5-6.5v-23C42,8.91,39.09,6,35.5,6h-23C8.91,6,6,8.91,6,12.5v23      C6,39.09,8.91,42,12.5,42z' style='fill:#00C300;'/>
    <path d='M37.113,22.417c0-5.865-5.88-10.637-13.107-10.637s-13.108,4.772-13.108,10.637      c0,5.258,4.663,9.662,10.962,10.495c0.427,0.092,1.008,0.282,1.155,0.646c0.132,0.331,0.086,0.85,0.042,1.185      c0,0-0.153,0.925-0.187,1.122c-0.057,0.331-0.263,1.296,1.135,0.707c1.399-0.589,7.548-4.445,10.298-7.611h-0.001      C36.203,26.879,37.113,24.764,37.113,22.417z M18.875,25.907h-2.604c-0.379,0-0.687-0.308-0.687-0.688V20.01      c0-0.379,0.308-0.687,0.687-0.687c0.379,0,0.687,0.308,0.687,0.687v4.521h1.917c0.379,0,0.687,0.308,0.687,0.687      C19.562,25.598,19.254,25.907,18.875,25.907z M21.568,25.219c0,0.379-0.308,0.688-0.687,0.688s-0.687-0.308-0.687-0.688V20.01      c0-0.379,0.308-0.687,0.687-0.687s0.687,0.308,0.687,0.687V25.219z M27.838,25.219c0,0.297-0.188,0.559-0.47,0.652      c-0.071,0.024-0.145,0.036-0.218,0.036c-0.215,0-0.42-0.103-0.549-0.275l-2.669-3.635v3.222c0,0.379-0.308,0.688-0.688,0.688      c-0.379,0-0.688-0.308-0.688-0.688V20.01c0-0.296,0.189-0.558,0.47-0.652c0.071-0.024,0.144-0.035,0.218-0.035      c0.214,0,0.42,0.103,0.549,0.275l2.67,3.635V20.01c0-0.379,0.309-0.687,0.688-0.687c0.379,0,0.687,0.308,0.687,0.687V25.219z      M32.052,21.927c0.379,0,0.688,0.308,0.688,0.688c0,0.379-0.308,0.687-0.688,0.687h-1.917v1.23h1.917      c0.379,0,0.688,0.308,0.688,0.687c0,0.379-0.309,0.688-0.688,0.688h-2.604c-0.378,0-0.687-0.308-0.687-0.688v-2.603      c0-0.001,0-0.001,0-0.001c0,0,0-0.001,0-0.001v-2.601c0-0.001,0-0.001,0-0.002c0-0.379,0.308-0.687,0.687-0.687h2.604      c0.379,0,0.688,0.308,0.688,0.687s-0.308,0.687-0.688,0.687h-1.917v1.23H32.052z' style='fill:#FFFFFF;'/>
  </svg>
  </a></li>
<li><whatsapp expr:href='data:post.url' expr:text='data:post.title'/><a class='wa' expr:href='&quot;whatsapp://send?text=&quot;+ data:post.url'><i aria-hidden='true' class='fa fa-whatsapp' style='clear:both;font-size:24px!important'/></a></li>
<div id='showshare'><span class='shareplus' href='javascript:void(0)' onclick='document.getElementById(&apos;showother&apos;).style.display=&apos;none&apos;;document.getElementById(&apos;showshare&apos;).style.display=&apos;block&apos;'><i aria-hidden='true' class='fa fa-minus'/></span></div>
  </ul>
  </div>
</b:includable>

4. simpan kode berikut ini di bawah judul posting dan/atau di bawah postingan.

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='share-wrapper' id='share_btnper'>
<b:include data='post' name='sharethis'/>
  </div>
</b:if>

- Untuk ditampilkan di bawah judul, simpan di atas kode <data:post.body/> yang kedua atau ketiga.
- Untuk di bawah judul posting, simpan di bawah kode <data:post.body/> yang kedua atau ketiga atau di atas kode  <div class='post-footer'>

Demikian Cara Membuat Tombol Berbagi (Social Share Button) Show Hide Keren Responsive. Sumber dari codepen.io. Good Luck & Happy Blogging! (www.contohblog.com).*

October 25, 2018

NJW Grid - Template Blog SEO Terbaru Varian New Johny Wuss (Gratis)

NJW Grid - Template Blog SEO Terbaru Varian New Johny Wuss (Gratis)

NJW Grid - Template Blog SEO Terbaru Varian New Johny Wuss (Gratis)

Template Blogger SEO Friendly, Responsive, dan Fast Loadng terbaru ini mirip CB Gallery yang juga gratis.

Template ini masih menggunakan "bahan dasar" template New Johny Wuss yang sudah terbukti ramah mesin pencari dan mudah terindeks Google.

DEMO | DOWNLOAD

Features CB Grid:

• SEO Friendly
• Mobile Friendly - Responsive
• Fast Loading, Ringan.
• Simple, Clean.
• Auto Read more grid style 
• Related Post Thumbnail
• Numbered Blog Pager/Pagination
• Responsive Header & Menu
• Menu Navigation with Search Box
• Gratis!
• Cocok untuk jenis blog apa saja (multi purpose).

Template ini GRATIS. Untuk template premium yang sudah lebih dioptimalkan seo dan elemen lainnya, silakan buka Galeri Template CB. Good Luck & Happy Blogging! (www.contohblog.com).*

October 22, 2018

Cara Memasang Featured Post Slider Otomatis di Blog Blogger

Cara Memasang Featured Post Slider Otomatis di Blog Blogger

Featured Post Slider Otomatis adalah widget blog yang menampilkan posting terbaru atau posting unggulan berdasarkan label tertentu. Penampilannya seperti ini.

Lihat Demo

Cara Memasang Featured Post Slider Otomatis 

Langsung saja kita pasang! Untuk berjaga-jaga jika terjadi kesalahan, sebaiknya backup dulu template Anda.

1. Klik Tema > klik Edit HTML
2. Copas kode berikut ini di atas kode ]]></b:skin> :

#featuredSlider {background:#fff;float:left;margin:0; padding:0 0 10px;-webkit-box-shadow:1px 1px 5px #c3c3c3;-moz-box-shadow:1px 1px 5px #c3c3c3;-ms-box-shadow:1px 1px 5px #c3c3c3;-o-box-shadow:1px 1px 5px #c3c3c3;box-shadow:1px 1px 5px #c3c3c3;border:1px solid #fff; width:99%; position:relative;color:#666;}
#featuredSlider .featured-thumb {float:left; margin:10px; padding:0px;}
#featuredSlider .container {height:266px; margin:0 10px 0 0;overflow:hidden; position:relative;}
.featuredTitle{padding-top:15px;font:16px Oswald;text-shadow:1px 1px 1px #ccc;}
.featuredTitle a{color:#f7441a}
.featuredTitle a:hover{color:#000}
.navigation {position:relative;bottom:23px;float:right;overflow:hidden;}
ul.pagination {list-style-type:none; margin:0 auto; padding:0;}
ul.pagination a { float:left; margin:0 5px; display:inline; }
ul.pagination a { display:block;width:12px; padding-top:12px; height:0; overflow:hidden; background-image:url(http://2.bp.blogspot.com/-j2T8LeJpjkY/UBfzfSqJGSI/AAAAAAAAIDE/jiGwQpYoRO4/s1600/slider+pagination.png); background-position:0 0; background-repeat:no-repeat; }
ul.pagination a:hover { background-position:0 -12px; }
ul.pagination a:hover { background-position:0 -12px; }
ul.pagination a.activeSlide { background-position:0 -12px }
a.readmore {float:left;border:1px solid #444;background:#585858 url(http://2.bp.blogspot.com/-S4AKqSDPUEs/ToSYCWJy4qI/AAAAAAAAABI/conBgqSajOY/s1600/fade.png) repeat-x top;display:block;;font:bold 12px Arial;text-shadow: -1px -1px 0 #333;margin:10px 0 0 0;padding:4px 10px;color:#eee;-webkit-border-radius:3px;-moz-border-radius:3px;
border-radius:3px;-webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);}
a.readmore:hover {color:#ff0}

3. Copas kode berikut ini diatas kode </head> 

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
(function($) {
    $.fn.innerfade = function(options) {
        return this.each(function() { 
            $.innerfade(this, options);
        });
    };
    $.innerfade = function(container, options) {
        var settings = {
        'animationtype':    'fade',
            'speed':            'normal',
            'type':             'sequence',
            'timeout':          2000,
            'containerheight':  'auto',
            'runningclass':     'innerfade',
            'children':         null
        };
        if (options)
            $.extend(settings, options);
        if (settings.children === null)
            var elements = $(container).children();
        else
            var elements = $(container).children(settings.children);
        if (elements.length > 1) {
            $(container).css('position', 'relative').css('height', settings.containerheight).addClass(settings.runningclass);
            for (var i = 0; i < elements.length; i++) {
                $(elements[i]).css('z-index', String(elements.length-i)).css('position', 'absolute').hide();
            };
            if (settings.type == "sequence") {
                setTimeout(function() {
                    $.innerfade.next(elements, settings, 1, 0);
                }, settings.timeout);
                $(elements[0]).show();
            } else if (settings.type == "random") {
            var last = Math.floor ( Math.random () * ( elements.length ) );
                setTimeout(function() {
                    do {
current = Math.floor ( Math.random ( ) * ( elements.length ) );
} while (last == current );           
$.innerfade.next(elements, settings, current, last);
                }, settings.timeout);
                $(elements[last]).show();
} else if ( settings.type == 'random_start' ) {
settings.type = 'sequence';
var current = Math.floor ( Math.random () * ( elements.length ) );
setTimeout(function(){
$.innerfade.next(elements, settings, (current + 1) %  elements.length, current);
}, settings.timeout);
$(elements[current]).show();
} else {
alert('Innerfade-Type must either be \'sequence\', \'random\' or \'random_start\'');
}
}
    };
    $.innerfade.next = function(elements, settings, current, last) {
        if (settings.animationtype == 'slide') {
            $(elements[last]).slideUp(settings.speed);
            $(elements[current]).slideDown(settings.speed);
        } else if (settings.animationtype == 'fade') {
            $(elements[last]).fadeOut(settings.speed);
            $(elements[current]).fadeIn(settings.speed, function() {
removeFilter($(this)[0]);
});
        } else
            alert('Innerfade-animationtype must either be \'slide\' or \'fade\'');
        if (settings.type == "sequence") {
            if ((current + 1) < elements.length) {
                current = current + 1;
                last = current - 1;
            } else {
                current = 0;
                last = elements.length - 1;
            }
        } else if (settings.type == "random") {
            last = current;
            while (current == last)
                current = Math.floor(Math.random() * elements.length);
        } else
            alert('Innerfade-Type must either be \'sequence\', \'random\' or \'random_start\'');
        setTimeout((function() {
            $.innerfade.next(elements, settings, current, last);
        }), settings.timeout);
    };
})(jQuery);
// **** remove Opacity-Filter in ie ****
function removeFilter(element) {
if(element.style.removeAttribute){
element.style.removeAttribute('filter');
}
}
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
;(function($){var ver="2.94";if($.support==undefined){$.support={opacity:!($.browser.msie)};}function debug(s){if($.fn.cycle.debug){log(s);}}function log(){if(window.console&&window.console.log){window.console.log("[cycle] "+Array.prototype.join.call(arguments," "));}}$.fn.cycle=function(options,arg2){var o={s:this.selector,c:this.context};if(this.length===0&&options!="stop"){if(!$.isReady&&o.s){log("DOM not ready, queuing slideshow");$(function(){$(o.s,o.c).cycle(options,arg2);});return this;}log("terminating; zero elements found by selector"+($.isReady?"":" (DOM not ready)"));return this;}return this.each(function(){var opts=handleArguments(this,options,arg2);if(opts===false){return;}opts.updateActivePagerLink=opts.updateActivePagerLink||$.fn.cycle.updateActivePagerLink;if(this.cycleTimeout){clearTimeout(this.cycleTimeout);}this.cycleTimeout=this.cyclePause=0;var $cont=$(this);var $slides=opts.slideExpr?$(opts.slideExpr,this):$cont.children();var els=$slides.get();if(els.length<2){log("terminating; too few slides: "+els.length);return;}var opts2=buildOptions($cont,$slides,els,opts,o);if(opts2===false){return;}var startTime=opts2.continuous?10:getTimeout(els[opts2.currSlide],els[opts2.nextSlide],opts2,!opts2.backwards);if(startTime){startTime+=(opts2.delay||0);if(startTime<10){startTime=10;}debug("first timeout: "+startTime);this.cycleTimeout=setTimeout(function(){go(els,opts2,0,!opts.backwards);},startTime);}});};function handleArguments(cont,options,arg2){if(cont.cycleStop==undefined){cont.cycleStop=0;}if(options===undefined||options===null){options={};}if(options.constructor==String){switch(options){case"destroy":case"stop":var opts=$(cont).data("cycle.opts");if(!opts){return false;}cont.cycleStop++;if(cont.cycleTimeout){clearTimeout(cont.cycleTimeout);}cont.cycleTimeout=0;$(cont).removeData("cycle.opts");if(options=="destroy"){destroy(opts);}return false;case"toggle":cont.cyclePause=(cont.cyclePause===1)?0:1;checkInstantResume(cont.cyclePause,arg2,cont);return false;case"pause":cont.cyclePause=1;return false;case"resume":cont.cyclePause=0;checkInstantResume(false,arg2,cont);return false;case"prev":case"next":var opts=$(cont).data("cycle.opts");if(!opts){log('options not found, "prev/next" ignored');return false;}$.fn.cycle[options](opts);return false;default:options={fx:options};}return options;}else{if(options.constructor==Number){var num=options;options=$(cont).data("cycle.opts");if(!options){log("options not found, can not advance slide");return false;}if(num<0||num>=options.elements.length){log("invalid slide index: "+num);return false;}options.nextSlide=num;if(cont.cycleTimeout){clearTimeout(cont.cycleTimeout);cont.cycleTimeout=0;}if(typeof arg2=="string"){options.oneTimeFx=arg2;}go(options.elements,options,1,num>=options.currSlide);return false;}}return options;function checkInstantResume(isPaused,arg2,cont){if(!isPaused&&arg2===true){var options=$(cont).data("cycle.opts");if(!options){log("options not found, can not resume");return false;}if(cont.cycleTimeout){clearTimeout(cont.cycleTimeout);cont.cycleTimeout=0;}go(options.elements,options,1,!options.backwards);}}}function removeFilter(el,opts){if(!$.support.opacity&&opts.cleartype&&el.style.filter){try{el.style.removeAttribute("filter");}catch(smother){}}}function destroy(opts){if(opts.next){$(opts.next).unbind(opts.prevNextEvent);}if(opts.prev){$(opts.prev).unbind(opts.prevNextEvent);}if(opts.pager||opts.pagerAnchorBuilder){$.each(opts.pagerAnchors||[],function(){this.unbind().remove();});}opts.pagerAnchors=null;if(opts.destroy){opts.destroy(opts);}}function buildOptions($cont,$slides,els,options,o){var opts=$.extend({},$.fn.cycle.defaults,options||{},$.metadata?$cont.metadata():$.meta?$cont.data():{});if(opts.autostop){opts.countdown=opts.autostopCount||els.length;}var cont=$cont[0];$cont.data("cycle.opts",opts);opts.$cont=$cont;opts.stopCount=cont.cycleStop;opts.elements=els;opts.before=opts.before?[opts.before]:[];opts.after=opts.after?[opts.after]:[];opts.after.unshift(function(){opts.busy=0;});if(!$.support.opacity&&opts.cleartype){opts.after.push(function(){removeFilter(this,opts);});}if(opts.continuous){opts.after.push(function(){go(els,opts,0,!opts.backwards);});}saveOriginalOpts(opts);if(!$.support.opacity&&opts.cleartype&&!opts.cleartypeNoBg){clearTypeFix($slides);}if($cont.css("position")=="static"){$cont.css("position","relative");}if(opts.width){$cont.width(opts.width);}if(opts.height&&opts.height!="auto"){$cont.height(opts.height);}if(opts.startingSlide){opts.startingSlide=parseInt(opts.startingSlide);}else{if(opts.backwards){opts.startingSlide=els.length-1;}}if(opts.random){opts.randomMap=[];for(var i=0;i<els.length;i++){opts.randomMap.push(i);}opts.randomMap.sort(function(a,b){return Math.random()-0.5;});opts.randomIndex=1;opts.startingSlide=opts.randomMap[1];}else{if(opts.startingSlide>=els.length){opts.startingSlide=0;}}opts.currSlide=opts.startingSlide||0;var first=opts.startingSlide;$slides.css({position:"absolute",top:0,left:0}).hide().each(function(i){var z;if(opts.backwards){z=first?i<=first?els.length+(i-first):first-i:els.length-i;}else{z=first?i>=first?els.length-(i-first):first-i:els.length-i;}$(this).css("z-index",z);});$(els[first]).css("opacity",1).show();removeFilter(els[first],opts);if(opts.fit&&opts.width){$slides.width(opts.width);}if(opts.fit&&opts.height&&opts.height!="auto"){$slides.height(opts.height);}var reshape=opts.containerResize&&!$cont.innerHeight();if(reshape){var maxw=0,maxh=0;for(var j=0;j<els.length;j++){var $e=$(els[j]),e=$e[0],w=$e.outerWidth(),h=$e.outerHeight();if(!w){w=e.offsetWidth||e.width||$e.attr("width");}if(!h){h=e.offsetHeight||e.height||$e.attr("height");}maxw=w>maxw?w:maxw;maxh=h>maxh?h:maxh;}if(maxw>0&&maxh>0){$cont.css({width:maxw+"px",height:maxh+"px"});}}if(opts.pause){$cont.hover(function(){this.cyclePause++;},function(){this.cyclePause--;});}if(supportMultiTransitions(opts)===false){return false;}var requeue=false;options.requeueAttempts=options.requeueAttempts||0;$slides.each(function(){var $el=$(this);this.cycleH=(opts.fit&&opts.height)?opts.height:($el.height()||this.offsetHeight||this.height||$el.attr("height")||0);this.cycleW=(opts.fit&&opts.width)?opts.width:($el.width()||this.offsetWidth||this.width||$el.attr("width")||0);if($el.is("img")){var loadingIE=($.browser.msie&&this.cycleW==28&&this.cycleH==30&&!this.complete);var loadingFF=($.browser.mozilla&&this.cycleW==34&&this.cycleH==19&&!this.complete);var loadingOp=($.browser.opera&&((this.cycleW==42&&this.cycleH==19)||(this.cycleW==37&&this.cycleH==17))&&!this.complete);var loadingOther=(this.cycleH==0&&this.cycleW==0&&!this.complete);if(loadingIE||loadingFF||loadingOp||loadingOther){if(o.s&&opts.requeueOnImageNotLoaded&&++options.requeueAttempts<100){log(options.requeueAttempts," - img slide not loaded, requeuing slideshow: ",this.src,this.cycleW,this.cycleH);setTimeout(function(){$(o.s,o.c).cycle(options);},opts.requeueTimeout);requeue=true;return false;}else{log("could not determine size of image: "+this.src,this.cycleW,this.cycleH);}}}return true;});if(requeue){return false;}opts.cssBefore=opts.cssBefore||{};opts.animIn=opts.animIn||{};opts.animOut=opts.animOut||{};$slides.not(":eq("+first+")").css(opts.cssBefore);if(opts.cssFirst){$($slides[first]).css(opts.cssFirst);}if(opts.timeout){opts.timeout=parseInt(opts.timeout);if(opts.speed.constructor==String){opts.speed=$.fx.speeds[opts.speed]||parseInt(opts.speed);}if(!opts.sync){opts.speed=opts.speed/2;}var buffer=opts.fx=="shuffle"?500:250;while((opts.timeout-opts.speed)<buffer){opts.timeout+=opts.speed;}}if(opts.easing){opts.easeIn=opts.easeOut=opts.easing;}if(!opts.speedIn){opts.speedIn=opts.speed;}if(!opts.speedOut){opts.speedOut=opts.speed;}opts.slideCount=els.length;opts.currSlide=opts.lastSlide=first;if(opts.random){if(++opts.randomIndex==els.length){opts.randomIndex=0;}opts.nextSlide=opts.randomMap[opts.randomIndex];}else{if(opts.backwards){opts.nextSlide=opts.startingSlide==0?(els.length-1):opts.startingSlide-1;}else{opts.nextSlide=opts.startingSlide>=(els.length-1)?0:opts.startingSlide+1;}}if(!opts.multiFx){var init=$.fn.cycle.transitions[opts.fx];if($.isFunction(init)){init($cont,$slides,opts);}else{if(opts.fx!="custom"&&!opts.multiFx){log("unknown transition: "+opts.fx,"; slideshow terminating");return false;}}}var e0=$slides[first];if(opts.before.length){opts.before[0].apply(e0,[e0,e0,opts,true]);}if(opts.after.length>1){opts.after[1].apply(e0,[e0,e0,opts,true]);}if(opts.next){$(opts.next).bind(opts.prevNextEvent,function(){return advance(opts,1);});}if(opts.prev){$(opts.prev).bind(opts.prevNextEvent,function(){return advance(opts,0);});}if(opts.pager||opts.pagerAnchorBuilder){buildPager(els,opts);}exposeAddSlide(opts,els);return opts;}function saveOriginalOpts(opts){opts.original={before:[],after:[]};opts.original.cssBefore=$.extend({},opts.cssBefore);opts.original.cssAfter=$.extend({},opts.cssAfter);opts.original.animIn=$.extend({},opts.animIn);opts.original.animOut=$.extend({},opts.animOut);$.each(opts.before,function(){opts.original.before.push(this);});$.each(opts.after,function(){opts.original.after.push(this);});}function supportMultiTransitions(opts){var i,tx,txs=$.fn.cycle.transitions;if(opts.fx.indexOf(",")>0){opts.multiFx=true;opts.fxs=opts.fx.replace(/\s*/g,"").split(",");for(i=0;i<opts.fxs.length;i++){var fx=opts.fxs[i];tx=txs[fx];if(!tx||!txs.hasOwnProperty(fx)||!$.isFunction(tx)){log("discarding unknown transition: ",fx);opts.fxs.splice(i,1);i--;}}if(!opts.fxs.length){log("No valid transitions named; slideshow terminating.");return false;}}else{if(opts.fx=="all"){opts.multiFx=true;opts.fxs=[];for(p in txs){tx=txs[p];if(txs.hasOwnProperty(p)&&$.isFunction(tx)){opts.fxs.push(p);}}}}if(opts.multiFx&&opts.randomizeEffects){var r1=Math.floor(Math.random()*20)+30;for(i=0;i<r1;i++){var r2=Math.floor(Math.random()*opts.fxs.length);opts.fxs.push(opts.fxs.splice(r2,1)[0]);}debug("randomized fx sequence: ",opts.fxs);}return true;}function exposeAddSlide(opts,els){opts.addSlide=function(newSlide,prepend){var $s=$(newSlide),s=$s[0];if(!opts.autostopCount){opts.countdown++;}els[prepend?"unshift":"push"](s);if(opts.els){opts.els[prepend?"unshift":"push"](s);}opts.slideCount=els.length;$s.css("position","absolute");$s[prepend?"prependTo":"appendTo"](opts.$cont);if(prepend){opts.currSlide++;opts.nextSlide++;}if(!$.support.opacity&&opts.cleartype&&!opts.cleartypeNoBg){clearTypeFix($s);}if(opts.fit&&opts.width){$s.width(opts.width);}if(opts.fit&&opts.height&&opts.height!="auto"){$s.height(opts.height);}s.cycleH=(opts.fit&&opts.height)?opts.height:$s.height();s.cycleW=(opts.fit&&opts.width)?opts.width:$s.width();$s.css(opts.cssBefore);if(opts.pager||opts.pagerAnchorBuilder){$.fn.cycle.createPagerAnchor(els.length-1,s,$(opts.pager),els,opts);}if($.isFunction(opts.onAddSlide)){opts.onAddSlide($s);}else{$s.hide();}};}$.fn.cycle.resetState=function(opts,fx){fx=fx||opts.fx;opts.before=[];opts.after=[];opts.cssBefore=$.extend({},opts.original.cssBefore);opts.cssAfter=$.extend({},opts.original.cssAfter);opts.animIn=$.extend({},opts.original.animIn);opts.animOut=$.extend({},opts.original.animOut);opts.fxFn=null;$.each(opts.original.before,function(){opts.before.push(this);});$.each(opts.original.after,function(){opts.after.push(this);});var init=$.fn.cycle.transitions[fx];if($.isFunction(init)){init(opts.$cont,$(opts.elements),opts);}};function go(els,opts,manual,fwd){if(manual&&opts.busy&&opts.manualTrump){debug("manualTrump in go(), stopping active transition");$(els).stop(true,true);opts.busy=false;}if(opts.busy){debug("transition active, ignoring new tx request");return;}var p=opts.$cont[0],curr=els[opts.currSlide],next=els[opts.nextSlide];if(p.cycleStop!=opts.stopCount||p.cycleTimeout===0&&!manual){return;}if(!manual&&!p.cyclePause&&!opts.bounce&&((opts.autostop&&(--opts.countdown<=0))||(opts.nowrap&&!opts.random&&opts.nextSlide<opts.currSlide))){if(opts.end){opts.end(opts);}return;}var changed=false;if((manual||!p.cyclePause)&&(opts.nextSlide!=opts.currSlide)){changed=true;var fx=opts.fx;curr.cycleH=curr.cycleH||$(curr).height();curr.cycleW=curr.cycleW||$(curr).width();next.cycleH=next.cycleH||$(next).height();next.cycleW=next.cycleW||$(next).width();if(opts.multiFx){if(opts.lastFx==undefined||++opts.lastFx>=opts.fxs.length){opts.lastFx=0;}fx=opts.fxs[opts.lastFx];opts.currFx=fx;}if(opts.oneTimeFx){fx=opts.oneTimeFx;opts.oneTimeFx=null;}$.fn.cycle.resetState(opts,fx);if(opts.before.length){$.each(opts.before,function(i,o){if(p.cycleStop!=opts.stopCount){return;}o.apply(next,[curr,next,opts,fwd]);});}var after=function(){$.each(opts.after,function(i,o){if(p.cycleStop!=opts.stopCount){return;}o.apply(next,[curr,next,opts,fwd]);});};debug("tx firing; currSlide: "+opts.currSlide+"; nextSlide: "+opts.nextSlide);opts.busy=1;if(opts.fxFn){opts.fxFn(curr,next,opts,after,fwd,manual&&opts.fastOnEvent);}else{if($.isFunction($.fn.cycle[opts.fx])){$.fn.cycle[opts.fx](curr,next,opts,after,fwd,manual&&opts.fastOnEvent);}else{$.fn.cycle.custom(curr,next,opts,after,fwd,manual&&opts.fastOnEvent);}}}if(changed||opts.nextSlide==opts.currSlide){opts.lastSlide=opts.currSlide;if(opts.random){opts.currSlide=opts.nextSlide;if(++opts.randomIndex==els.length){opts.randomIndex=0;}opts.nextSlide=opts.randomMap[opts.randomIndex];if(opts.nextSlide==opts.currSlide){opts.nextSlide=(opts.currSlide==opts.slideCount-1)?0:opts.currSlide+1;}}else{if(opts.backwards){var roll=(opts.nextSlide-1)<0;if(roll&&opts.bounce){opts.backwards=!opts.backwards;opts.nextSlide=1;opts.currSlide=0;}else{opts.nextSlide=roll?(els.length-1):opts.nextSlide-1;opts.currSlide=roll?0:opts.nextSlide+1;}}else{var roll=(opts.nextSlide+1)==els.length;if(roll&&opts.bounce){opts.backwards=!opts.backwards;opts.nextSlide=els.length-2;opts.currSlide=els.length-1;}else{opts.nextSlide=roll?0:opts.nextSlide+1;opts.currSlide=roll?els.length-1:opts.nextSlide-1;}}}}if(changed&&opts.pager){opts.updateActivePagerLink(opts.pager,opts.currSlide,opts.activePagerClass);}var ms=0;if(opts.timeout&&!opts.continuous){ms=getTimeout(els[opts.currSlide],els[opts.nextSlide],opts,fwd);}else{if(opts.continuous&&p.cyclePause){ms=10;}}if(ms>0){p.cycleTimeout=setTimeout(function(){go(els,opts,0,!opts.backwards);},ms);}}$.fn.cycle.updateActivePagerLink=function(pager,currSlide,clsName){$(pager).each(function(){$(this).children().removeClass(clsName).eq(currSlide).addClass(clsName);});};function getTimeout(curr,next,opts,fwd){if(opts.timeoutFn){var t=opts.timeoutFn.call(curr,curr,next,opts,fwd);while((t-opts.speed)<250){t+=opts.speed;}debug("calculated timeout: "+t+"; speed: "+opts.speed);if(t!==false){return t;}}return opts.timeout;}$.fn.cycle.next=function(opts){advance(opts,1);};$.fn.cycle.prev=function(opts){advance(opts,0);};function advance(opts,moveForward){var val=moveForward?1:-1;var els=opts.elements;var p=opts.$cont[0],timeout=p.cycleTimeout;if(timeout){clearTimeout(timeout);p.cycleTimeout=0;}if(opts.random&&val<0){opts.randomIndex--;if(--opts.randomIndex==-2){opts.randomIndex=els.length-2;}else{if(opts.randomIndex==-1){opts.randomIndex=els.length-1;}}opts.nextSlide=opts.randomMap[opts.randomIndex];}else{if(opts.random){opts.nextSlide=opts.randomMap[opts.randomIndex];}else{opts.nextSlide=opts.currSlide+val;if(opts.nextSlide<0){if(opts.nowrap){return false;}opts.nextSlide=els.length-1;}else{if(opts.nextSlide>=els.length){if(opts.nowrap){return false;}opts.nextSlide=0;}}}}var cb=opts.onPrevNextEvent||opts.prevNextClick;if($.isFunction(cb)){cb(val>0,opts.nextSlide,els[opts.nextSlide]);}go(els,opts,1,moveForward);return false;}function buildPager(els,opts){var $p=$(opts.pager);$.each(els,function(i,o){$.fn.cycle.createPagerAnchor(i,o,$p,els,opts);});opts.updateActivePagerLink(opts.pager,opts.startingSlide,opts.activePagerClass);}$.fn.cycle.createPagerAnchor=function(i,el,$p,els,opts){var a;if($.isFunction(opts.pagerAnchorBuilder)){a=opts.pagerAnchorBuilder(i,el);debug("pagerAnchorBuilder("+i+", el) returned: "+a);}else{a='<a href="#">'+(i+1)+"</a>";}if(!a){return;}var $a=$(a);if($a.parents("body").length===0){var arr=[];if($p.length>1){$p.each(function(){var $clone=$a.clone(true);$(this).append($clone);arr.push($clone[0]);});$a=$(arr);}else{$a.appendTo($p);}}opts.pagerAnchors=opts.pagerAnchors||[];opts.pagerAnchors.push($a);$a.bind(opts.pagerEvent,function(e){e.preventDefault();opts.nextSlide=i;var p=opts.$cont[0],timeout=p.cycleTimeout;if(timeout){clearTimeout(timeout);p.cycleTimeout=0;}var cb=opts.onPagerEvent||opts.pagerClick;if($.isFunction(cb)){cb(opts.nextSlide,els[opts.nextSlide]);}go(els,opts,1,opts.currSlide<i);});if(!/^click/.test(opts.pagerEvent)&&!opts.allowPagerClickBubble){$a.bind("click.cycle",function(){return false;});}if(opts.pauseOnPagerHover){$a.hover(function(){opts.$cont[0].cyclePause++;},function(){opts.$cont[0].cyclePause--;});}};$.fn.cycle.hopsFromLast=function(opts,fwd){var hops,l=opts.lastSlide,c=opts.currSlide;if(fwd){hops=c>l?c-l:opts.slideCount-l;}else{hops=c<l?l-c:l+opts.slideCount-c;}return hops;};function clearTypeFix($slides){debug("applying clearType background-color hack");function hex(s){s=parseInt(s).toString(16);return s.length<2?"0"+s:s;}function getBg(e){for(;e&&e.nodeName.toLowerCase()!="html";e=e.parentNode){var v=$.css(e,"background-color");if(v.indexOf("rgb")>=0){var rgb=v.match(/\d+/g);return"#"+hex(rgb[0])+hex(rgb[1])+hex(rgb[2]);}if(v&&v!="transparent"){return v;}}return"#ffffff";}$slides.each(function(){$(this).css("background-color",getBg(this));});}$.fn.cycle.commonReset=function(curr,next,opts,w,h,rev){$(opts.elements).not(curr).hide();opts.cssBefore.opacity=1;opts.cssBefore.display="block";if(opts.slideResize&&w!==false&&next.cycleW>0){opts.cssBefore.width=next.cycleW;}if(opts.slideResize&&h!==false&&next.cycleH>0){opts.cssBefore.height=next.cycleH;}opts.cssAfter=opts.cssAfter||{};opts.cssAfter.display="none";$(curr).css("zIndex",opts.slideCount+(rev===true?1:0));$(next).css("zIndex",opts.slideCount+(rev===true?0:1));};$.fn.cycle.custom=function(curr,next,opts,cb,fwd,speedOverride){var $l=$(curr),$n=$(next);var speedIn=opts.speedIn,speedOut=opts.speedOut,easeIn=opts.easeIn,easeOut=opts.easeOut;$n.css(opts.cssBefore);if(speedOverride){if(typeof speedOverride=="number"){speedIn=speedOut=speedOverride;}else{speedIn=speedOut=1;}easeIn=easeOut=null;}var fn=function(){$n.animate(opts.animIn,speedIn,easeIn,cb);};$l.animate(opts.animOut,speedOut,easeOut,function(){if(opts.cssAfter){$l.css(opts.cssAfter);}if(!opts.sync){fn();}});if(opts.sync){fn();}};$.fn.cycle.transitions={fade:function($cont,$slides,opts){$slides.not(":eq("+opts.currSlide+")").css("opacity",0);opts.before.push(function(curr,next,opts){$.fn.cycle.commonReset(curr,next,opts);opts.cssBefore.opacity=0;});opts.animIn={opacity:1};opts.animOut={opacity:0};opts.cssBefore={top:0,left:0};}};$.fn.cycle.ver=function(){return ver;};$.fn.cycle.defaults={fx:"fade",timeout:4000,timeoutFn:null,continuous:0,speed:1000,speedIn:null,speedOut:null,next:null,prev:null,onPrevNextEvent:null,prevNextEvent:"click.cycle",pager:null,onPagerEvent:null,pagerEvent:"click.cycle",allowPagerClickBubble:false,pagerAnchorBuilder:null,before:null,after:null,end:null,easing:null,easeIn:null,easeOut:null,shuffle:null,animIn:null,animOut:null,cssBefore:null,cssAfter:null,fxFn:null,height:"auto",startingSlide:0,sync:1,random:0,fit:0,containerResize:1,slideResize:1,pause:0,pauseOnPagerHover:0,autostop:0,autostopCount:0,delay:0,slideExpr:null,cleartype:!$.support.opacity,cleartypeNoBg:false,nowrap:0,fastOnEvent:0,randomizeEffects:1,rev:0,manualTrump:true,requeueOnImageNotLoaded:true,requeueTimeout:250,activePagerClass:"activeSlide",updateActivePagerLink:null,backwards:false};})(jQuery);
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "http://2.bp.blogspot.com/-uitX7ROPtTU/Tyv-G4NA_uI/AAAAAAAAFBY/NcWLPVnYEnU/s1600/no+image.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 150;
summaryTitle = 25;
numposts = 5;
function removeHtmlTag(strx,chop){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}s=s.join("");s=s.substring(0,chop-1);return s}
function showrecentposts(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('<div class="slides">')
if (numposts <= json.feed.entry.length) {
maxpost = numposts;
}
else
{
maxpost=json.feed.entry.length;
}
for (var i = 0; i < maxpost; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var pcm;
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;
}
}
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
pcm = entry.link[k].title.split(" ")[0];
break;
}
}
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
postdate = entry.published.$t;
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;
//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';
var month = [1,2,3,4,5,6,7,8,9,10,11,12];
var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
var day = postdate.split("-")[2].substring(0,2);
var m = postdate.split("-")[1];
var y = postdate.split("-")[0];
for(var u2=0;u2<month.length;u2++){
if(parseInt(m)==month[u2]) {
m = month2[u2] ; break;
}
}
var trtd = '<div><p class="featured-thumb"><a href="'+posturl+'"><img width="350" height="262"src="'+img[i]+'"/></a></p><div class="featuredTitle"><a href="'+posturl+'">'+posttitle+'</a></div><p>'+removeHtmlTag(postcontent,summaryPost)+'... </p><a href="'+posturl+'" class="readmore">Read more &#187;</a></div>';
document.write(trtd);
j++;
}
document.write('</div>')
}
//]]>
</script>

4. Copas kode berikut ini di bawah kode <div id='main-wrapper'> atau semisalnya.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div id='featuredSlider'>
<div class='container'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
<div class='navigation'>
<ul class='pagination'/> <script>
$(&#39;.slides&#39;).cycle({
fx: &#39;fade&#39;,
speed: &#39;slow&#39;,
timeout: 3000,
pager: &#39;.pagination&#39;
});
</script>
</div> </div> <!--end .container-->
</div>
</b:if>

5. Save! Simpan tamplate Anda.

Demikian Cara Memasang Featured Post Slider Otomatis di Blog Blogger. Good Luck & Happy Blogging! (www.contohblog.com).*

October 16, 2018

Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar)

Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar)

Berikut ini Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar).

Navigasi menu yang tetap tampil saat halaman discroll ke bawah ini disebut juga static menu (menu statis),  floating menu (menu melayang), atau fixed menu.

Cara membuatnya mudah.

Hanya memasang dua jenis kode, yaitu kode CSS dan Javascript.

Tutorial ini terdiri dari dua, yaitu menjadikan menu yang ada menjadi stricky atau melayang dan satu lagi membuat menu statis --termasuk membuat menunya.

Lihat Demo

Cara Menjadikan Menu Tetap Muncul Saat Discroll 

1. Tema > Edit HTML
2. Copas kode berikut ini di atas kode ]]></b:skin>

.sticky {position: fixed;top: 0;width: 100%;}
.sticky + .content {padding-top: 60px;}

3. Copas kode Javascript berikut ini di atas kode </body>

<script>
window.onscroll = function() {myFunction()};
var navbar = document.getElementById("navbar");
var sticky = navbar.offsetTop;
function myFunction() {
  if (window.pageYOffset >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}
</script>

Perhatikan kode warna merah (navbar). Ganti dengan nama kode navigasi menu di template Anda, misalnya navmenu, menunav, main-menu, topmenu, dan semisalnya. 

4. Save!

Cara Membuat Menu Tetap Muncul Saat Discroll

Berikut ini Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar) termasuk membuat navigasi menunya. Bisa diterapkan bagi blog Anda yang belum punya menu, seperti template bawaan blogger.

1.Tema >  Edit HTML

2. Copas kode CSS berikut ini di atas kode ]]></b:skin>

/* Style the navbar */
#navbar {
  overflow: hidden;
  background-color: #333;
}
/* Navbar links */
#navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px;
  text-decoration: none;
}
/* Page content */
.content {
  padding: 16px;
}
/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}
/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
  padding-top: 60px;
}

3. Copas kode HTML berikut ini di bawah kode </header> atau di atas kode seperti <div id='content-wrapper'>  atau <div id='main-wrapper'>

<div id="navbar">
  <a href="#home">Home</a>
  <a href="#news">News</a>
  <a href="#contact">Contact</a>
</div>

4. Copas kode javascript berikut ini di atas kode </body>

<script>
window.onscroll = function() {myFunction()};
var navbar = document.getElementById("myTopnav");
var sticky = navbar.offsetTop;
function myFunction() {
  if (window.pageYOffset >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}
</script>

5. Save! Simpan Template.

Demikian Cara Membuat Menu Tetap Muncul Saat Discroll (Sticky Navbar). Good Luck & Happy Blogging! (www.contohblog.com).

Sumber

October 11, 2018