Monday, November 17, 2014

November 17, 2014 hendra No comments

jika aku amati dalam postingannya masing-masing, jarang sekali ada yang menggunakan cara ini. Yakni menyembunyikan gambar atau sebuah objek dengan menggunakanspoiler buka tutup. Kalaupun ada, hal itu dilakukan semata-mata demi atas nama Loading blog. Karena panjangnya sebuah artikel hingga membuat loading blog atau web menjadi berat saat dibuka, maka dengan solusi atau dengancara inilah yang digunakannya. Yakni dengan cara membuat tombol/spoiler buka tutup. Namun demikian karena adanya permintaan, maka para mastah menciptakan sebuah script atau kode HTML untuk tombol buka tutup ini.

Dan aku yang termasuk kedalam golongan blogger yang Nubie dalam hal seperti ini mencoba untuk meneruskan cara memasang tombol/spoiler buka tutup ini. Dibawah ini adalah script atau kode untuk membuat tombol/spoiler buka tutup tersebut, sobat bisa langsung menyalinnya dan kemudian meletakkannya pada halaman mana saja yang hendak Anda pasangi tombol/spoiler buka tutup ini.

Contoh spoiler buka tutup:

Kode untuk tombol buka tutup :

<div style="margin-bottom: 2px;">judul spoiler <div style="margin-top: 5px; text-align: center;"><input value="Buka" style="margin-top: 5px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div>
<div style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;"> Letakan Isi Spoiler disini, Bisa gambar / tulisan </div></div></div>

Pada tulisan berwarna merah yang terdapat dalam script diatas harus anda ganti dengan gambar atau objek yang hendak anda sembunyikan, sementara tulisan yang berwarna Ungu, biru dan juga coklat bisa anda ganti sesuai dengan kebutuhan. Misalnya pada kata ‘buka’ bisa anda ganti dengan kata open, dan pada kata ‘tutup’ bisa anda ganti dengan kata close atau sejenisnya.

Demikianlah cara membuat tombol/spoiler buka tutup pada blog, semoga bisa sedikit membantu mohon maaf jika ada salah kata serta salah pada penulisannya. Bye-bye….

Saturday, November 15, 2014

November 15, 2014 hendra No comments

Cara Mudah Memasang Komentar Facebook Di Blog

Cara Mudah Memasang Komentar Facebook Di Blog. Dalam Membuat Sebuah Blog tentunya anda membutuhkan komentar-komentar yang sangat membangun. Berkomentar menjadi kegiatan utama blogwalking apalagi dengan berkomentar kita bisa juga mendapatkan link Back yang sangat berfungsi untuk menaikan trafik dan pengunjung kita, tapi banyak sekali blogger-blogger yang belum tau bagaimana cara berkomentar yang baik dan hal-hal apa saja yang harus di hindari dalam berkomentar.

Hal ini tidak dapat dibiarkan karena memang ini bukan suatu perbuatan yang baik dan harus di jauhi. Selain karena membuat blog yang di kunjungi menjadi tidak indah karena komentar-komentar yang tidak berbobot tapi ini juga berdampak negative terhadap si komentator sendiri, karena bisa jadi blognya akan di anggap spam. jadi jangan sampai melupakan fungsi utama berkomentar yaitu sekedar ingin menanyakan atau ingin memberikan pesan kepada si pemilik artikel/blog. Dengan berkomentar yang baik, itu akan mempengaruhi citra dan kredibilitas kita sebagai pemilik blog dan blog yang kita komentari.

Apakah yang dimaksud dengan komentar ? komentar adalah ulasan atau tanggapan atas Penjelasan yang telah dibuat atau dikatakan sebelumnya. Pada kesempatan kali ini sampul ilmu menjelaskan tentang Cara Mudah Memasang Komentar Facebook di Blog.

Gambar Komentar Facebook Dan Blogger

Langkah-langkah Pembuatannya Adalah

Siapkan ID Facebook Anda Terlebih Dahulu (untuk Cara Mudah Melihat ID Facebook Anda login kehalaman Facebook anda kemudian clik Profil anda setelah itu pada URL copy Nama Facebook anda)

Gambar Contoh ID Facebook

Langkah selanjutnya copy paste URL dibawah ini kemudian ganti ID Facebook (Tulisan Warna Merah) dengan ID Facebook anda kemudian Enter
https://graph.facebook.com/ID Facebook

Maka Akan Muncul Tampilan Seperti Dibawah Ini

Gambar ID Facebook

Langkah Selanjutnya Login Ke dalam Dashboard Blog anda kemudian clik Template pilih Edit HTML setelah itu cari kata <div class='comments' id='comments'> Pada Code HTML Blog anda (Untuk Melakukan Pencarian Agar lebih Cepat Ditemukan Clik CTRL + F pada Keyboard kemudian ketikan Kata <div class='comments' id='comments'> padaSearch lalu clik Enter)

Setelah code diatas telah ditemukan langkah selanjutnya copy code dibawah ini dan kemudian paste tepat dibawah code <div class='comments' id='comments'>

Friday, November 14, 2014

Widget recent comment dengan efek avatar dan tooltip

November 14, 2014 hendra No comments

dibahas pada blog tersebut sehingga pembaca blog tersebut tertarik ataupun ikut serta dalam berdiskusi.

Widget recent comment berikut di lengkapi dengan avatar dan stylelist dengan css dengan tambahan efek tooltip.previewnya seperti di bawah ini :

Tutorial

Login ke akun blogger anda
Pada dasbor >> Pilih Tata Letak >> Add Gadget >> HTML/JavaScript
Kemudian Copy dan pastekan kode di bawah ini ke dalamnya :

4. ganti URL di atas dengan URL blog anda , anda dapat mengedit warna widgetnya tinggal utak – atik saja cssnya.
jika sudah , save template dan lihat hasilnya Demikian Tutorial membuat widget recent comment kali ini semoga bermanfaat :c:

CARA TINGKATKAN PENGHASILAN GOOGLE ADSENSE

November 14, 2014 hendra No comments

Trik Tingkatkan Pengahasilan Google Adsense - Setelah artikel sebelumnya membahas trik cepat di Approve Google Adsense, pada trik kali ini saya akan menerangkan bagaimana mengoptimalkan google adsense pada blog sobat. Mengutip artikel dari official Blog Google adsense,berikut ini adalah beberapa trik peletakan posisi adsense di blog untuk meningkatkan penghasilan dari klik adsense anda

Google AdSense is a free program from google to maximize revenue from your online content that empowers online publishers to earn revenue by displaying relevant ads on a wide variety of online content, including:

Site search results
Easily add a custom search engine to your site, and earn from ads on the search results pages.
Websites
Display ads on your website that are suited to your audience's interests, and earn from valid clicks or impressions.
Mobile webpages and apps
Connect your mobile users with the right ad at the right time as they seek information on the go.
Feeds
Display targeted ads in your RSS feeds, wherever they're viewed.

Now I will give trick and tips in video how to increase your google adsense in your site. This video create by the official adsense team.
The AdSense team has posted a six-part video series, with Top optimization tips and best practices that can help you in boosting the eCPM and revenue of your Adsense. Implementing these techniques into your website and Adsense ad layouts can help you in monetizing your traffic and let you quickly earn more revenue online.

Berikut ini Adalah Video Trik-Tips untuk meningkatkan penghasilan Google Adsense Anda. Video ini di posting oleh Tim Adsense dari Google, silakan disimak dan tingkatkan penghasilan adsense anda

1. Upgrade to high-performing units

2. Monetize more content

3. Optimize search box placement

4. Opt-in to text and image ads

5. Use link units

6. Opt-in to placement targetinghttp://bmccreative.blogspot.com/2012/10/cara-tingkatkan-penghasilan-google.html

MENGISI DAN MENAMPILKAN ARTIKEL TERTENTU DI HALAMAN BLOG

November 14, 2014 hendra No comments

Menampilkan artikel tertentu ini maksudnya adalah menampilkan artikel berdasarkan label dan memasukkannya ke halaman blog seperti yang ada di menu halaman blog ini atau seperti yang terlihat pada gambar berikut ini

Mengisi dan menampilkan artikel tertentu di halaman blog ini memiliki tampilan yang sama dengan tampilan artikel yang ada di halaman depan blog, lengkap dengan gambar artikel (thumbnail) dan hanya menampilkan berdasarkan kategori label yang terpasang didalamnya yaitu yang terpasang pada kode script dari feed blog artikel yang sudah ada. Sebelum mengisi halaman blog dengan artikel tertentu, anda harus membuat halaman blog terlebih dahulu dan memasukkan kode html ini kedalamnya.

Cara Mengisi dan Menampilkan Artikel Tertentu di Halaman Blog
Kode yang ada dibawah ini merupakan hasil salinan yang saya ambil dari blogger senior kita, Kang Rohman yang terbit pada 23 Desember 2010 dan sedikit saya modifikasi agar tampilannya seperti yang terlihat pada gmbar diatas.

Masuk ke akun Blogger anda
Pilih menu Template >> Edit HTML >> tekan tombol Ctrl+F di keyboard
Cari kode ]]></b:skin> Jika sudah ketemu, salin kode berikut tepat diatas atau sebelum kode ]]></b:skin>
img.label_thumb{float:left; padding:5px; border:1px solid #8f8f8f; background:#D2D0D0; margin-right:10px; margin-bottom:15px;height:100px; width:100px}
img.label_thumb:hover{background:#f7f6f6}
.label_with_thumbs{float:left; width:100%; min-height:110px; margin:0px 10px 2px 0px; adding:0}
ul.label_with_thumbs li{padding:8px 0; min-height:105px; margin-bottom:15px}
.label_with_thumbs a{font-size:20px;font-weight:bold;}
.label_with_thumbs strong{}
Keterangan :
img.label_thumb adalah ID yang menampilkan gambar artikel (thumbnail), untuk mengatur besar kecil tampilan gambar, ganti ukurannya di bagian height dan width
.label_with_thumbs adalah mengatur tampilan gambar agar sesuai dengan yang lainnya. Jika ukuran gambar di img.label_thumb 100px, maka ukuran di .label_with_thumbs harus lebih besar
ul.label_with_thumbs li adalah mengatur tampilan gambar agar sesuai dengan yang lainnya. Jika ukuran gambar di img.label_thumbs 110px, maka ukuran di ul.label_with_thumbs harus lebih kecil
.label_with_thumbs a adalah ID yang digunakan untuk menampilkan ukuran font pada judul artikel, disini saya menggunakan ukuran 20px dengan karakter font besar (bold)
margin-bottom:15px adalah mengatur jarak di bagian bawah antar artikel
Cari kode </head> dan salin kode berikut tepat diatas atau sebelum kode </head>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<ul class="label_with_thumbs">');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.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!="")){thumburl=d;}else thumburl='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcjWA-8JiyWAP2YqyHlTOMih7f8RG5yfIdEDT3xOB6YHdqQKm2hOjdp0y0m7KFQ2zkrROLS8ssoEZMjQslNOVkfcu2_NhLwxl7lhC4Dd_7NJR2fv6IQ2yVqVjX_TctaS_v7BBXMqHXjlCM/';}
var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true)
document.write('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');if("content"in entry){var postcontent=entry.content.$t;}
else
if("summary"in entry){var postcontent=entry.summary.$t;}
else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('');document.write(postcontent);document.write('');}
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}}
var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}
if(showcommentnum==true)
{if(flag==1){towrite=towrite+' | ';}
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;}
if(displaymore==true)
{if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">More »</a>';flag=1;;}
document.write(towrite);document.write('</li>');if(displayseparator==true)
if(i!=(numposts-1))
document.write('');}document.write('</ul>');}
//]]>
</script>
Catatan :
karena diatas merupakan kode script dan mungkin terlalu banyak untuk ditampilkan kedalam template, silahkan anda kompres kode tersebut agar lebih kecil. Jika di kompres, kode script diatas akan menjadi link script seperti contohhttp://namaanda.googlecode.com/files/namakode.js dan untuk panduannya, silahkan buka artikelmembuat link kode javascript
Kalau sudah, simpan template
Selanjutnya, buka menu Laman dan buatlah judul laman sesuai dengan label yang akan ditampilkan kedalaman halaman blog nantinya
Masukkan kode berikut kedalam area penulisan artikel
<script type='text/javascript'>var numposts = 5;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 80;</script>

<script type="text/javascript" src="/feeds/posts/default/-/label?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

<a href="http://judulbloganda.blogspot.com/search/label/template" style="float: right; font: normal 12px Arial; padding: 5px 0;">Artikel berikutnya »</a>
Keterangan :
var numposts » menampilkan jumlah postingan
var showpostthumbnails » menampilkan gambar artikel (thumbnail)
var displaymore » menampilkan readmore
var showcommentnum » menampilkan jumlah komentar
var showpostdate » menampilkan tanggal terbit
var showpostsummary » menampilkan ringkasan artikel
var numchars » menampilkan jumlah kata dalam ringkasan artikel
label » ganti dengan label blog
Jika laman blog sudah berhasil dibuat, klik pulish atau terbitkan
Selesai. Lihat hasilnya..
Tambahan:
Pada hasil akan menampilkan 5 artikel sesuai dengan jumlah yang terpasang pada var numposts = 5, agar pengungjung bisa melihat artikel yang lainnya yang sesuai dengan label yang terpasang, silahkan anda tambahkan kode berikut ini dibagian bawah kode yang ada di laman artikel
<a href="http://judulbloganda.blogspot.com/search/label/template" style="float: right; font: normal 12px Arial; padding: 5px 0;">Artikel berikutnya »</a>

Itulah cara mengisi dan menampilkan artikel tertentu di halaman blog yang jika dikembangkan lagi sesuai kreatifitas anda, tidak hanya digunakan di halaman blog tapi bisa digunakan dimanapun yang anda inginkan terpasang berdasarkan label blog yang telah anda. Okey, jika masih ada yang belum jelas mari kita diskusikan bersama dengan meninggalkan komentar untuk artikel ini, Mengisi dan Menampilkan Artikel Tertentu di Halaman Blog

November 14, 2014 hendra No comments

Ana Sriwahyuni

74 Komentar

mengisi halaman blog

Sunday, March 31, 2013

Mengisi dan Menampilkan Artikel Tertentu di Halaman Blog - Artikel ini merupakan artikel update-an dari artikel yang pernah saya bahas sebelumnya yaitu membuat isi halaman blog berdasarkan label yang sama-sama memiliki fungsi menampilkan artikel tertentu di halama blog.
Menampilkan artikel tertentu ini maksudnya adalah menampilkan artikel berdasarkan label dan memasukkannya ke halaman blog seperti yang ada di menu halaman blog ini atau seperti yang terlihat pada gambar berikut ini

Masuk ke akun Blogger anda
Pilih menu Template >> Edit HTML >> tekan tombol Ctrl+F di keyboard
Cari kode ]]></b:skin> Jika sudah ketemu, salin kode berikut tepat diatas atau sebelum kode ]]></b:skin>
img.label_thumb{float:left; padding:5px; border:1px solid #8f8f8f; background:#D2D0D0; margin-right:10px; margin-bottom:15px;height:100px; width:100px}
img.label_thumb:hover{background:#f7f6f6}
.label_with_thumbs{float:left; width:100%; min-height:110px; margin:0px 10px 2px 0px; adding:0}
ul.label_with_thumbs li{padding:8px 0; min-height:105px; margin-bottom:15px}
.label_with_thumbs a{font-size:20px;font-weight:bold;}
.label_with_thumbs strong{}
Keterangan :
img.label_thumb adalah ID yang menampilkan gambar artikel (thumbnail), untuk mengatur besar kecil tampilan gambar, ganti ukurannya di bagian height dan width
.label_with_thumbs adalah mengatur tampilan gambar agar sesuai dengan yang lainnya. Jika ukuran gambar di img.label_thumb 100px, maka ukuran di .label_with_thumbs harus lebih besar
ul.label_with_thumbs li adalah mengatur tampilan gambar agar sesuai dengan yang lainnya. Jika ukuran gambar di img.label_thumbs 110px, maka ukuran di ul.label_with_thumbs harus lebih kecil
.label_with_thumbs a adalah ID yang digunakan untuk menampilkan ukuran font pada judul artikel, disini saya menggunakan ukuran 20px dengan karakter font besar (bold)
margin-bottom:15px adalah mengatur jarak di bagian bawah antar artikel
Cari kode </head> dan salin kode berikut tepat diatas atau sebelum kode </head>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<ul class="label_with_thumbs">');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.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!="")){thumburl=d;}else thumburl='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcjWA-8JiyWAP2YqyHlTOMih7f8RG5yfIdEDT3xOB6YHdqQKm2hOjdp0y0m7KFQ2zkrROLS8ssoEZMjQslNOVkfcu2_NhLwxl7lhC4Dd_7NJR2fv6IQ2yVqVjX_TctaS_v7BBXMqHXjlCM/';}
var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true)
document.write('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');if("content"in entry){var postcontent=entry.content.$t;}
else
if("summary"in entry){var postcontent=entry.summary.$t;}
else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('');document.write(postcontent);document.write('');}
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}}
var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}
if(showcommentnum==true)
{if(flag==1){towrite=towrite+' | ';}
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;}
if(displaymore==true)
{if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">More »</a>';flag=1;;}
document.write(towrite);document.write('</li>');if(displayseparator==true)
if(i!=(numposts-1))
document.write('');}document.write('</ul>');}
//]]>
</script>
Catatan :
karena diatas merupakan kode script dan mungkin terlalu banyak untuk ditampilkan kedalam template, silahkan anda kompres kode tersebut agar lebih kecil. Jika di kompres, kode script diatas akan menjadi link script seperti contohhttp://namaanda.googlecode.com/files/namakode.js dan untuk panduannya, silahkan buka artikelmembuat link kode javascript
Kalau sudah, simpan template
Selanjutnya, buka menu Laman dan buatlah judul laman sesuai dengan label yang akan ditampilkan kedalaman halaman blog nantinya
Masukkan kode berikut kedalam area penulisan artikel
<script type='text/javascript'>var numposts = 5;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 80;</script>

<script type="text/javascript" src="/feeds/posts/default/-/label?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

<a href="http://judulbloganda.blogspot.com/search/label/template" style="float: right; font: normal 12px Arial; padding: 5px 0;">Artikel berikutnya »</a>
Keterangan :
var numposts » menampilkan jumlah postingan
var showpostthumbnails » menampilkan gambar artikel (thumbnail)
var displaymore » menampilkan readmore
var showcommentnum » menampilkan jumlah komentar
var showpostdate » menampilkan tanggal terbit
var showpostsummary » menampilkan ringkasan artikel
var numchars » menampilkan jumlah kata dalam ringkasan artikel
label » ganti dengan label blog
Jika laman blog sudah berhasil dibuat, klik pulish atau terbitkan
Selesai. Lihat hasilnya..
Tambahan:
Pada hasil akan menampilkan 5 artikel sesuai dengan jumlah yang terpasang pada var numposts = 5, agar pengungjung bisa melihat artikel yang lainnya yang sesuai dengan label yang terpasang, silahkan anda tambahkan kode berikut ini dibagian bawah kode yang ada di laman artikel
<a href="http://judulbloganda.blogspot.com/search/label/template" style="float: right; font: normal 12px Arial; padding: 5px 0;">Artikel berikutnya »</a>

November 14, 2014 hendra No comments

CARA MEMASANG TOMBOL SHARE FB, DIGG, TWITTER, GOOGLE+ DI BLOG

3:41:00 PM Blogger Kreatif No comments

Memasang Tombol Share FB,Digg,Twitter,Google+ di Blog | Cara Memasang Tombol Share FB,Digg,Twitter,Google+ di Blog | Cara Memasang Tombol Share diatas Postingan Blog | Cara Memasang Tombol Share dibawah Postingan Blog- Kali ini saya akan membahas sebuah tombol share dari Facebook,Digg,Twitter,Google Plus+ mungkin anda tahu semua jejaring sosial tersebut sangatlah besar.nah mungkin dengan memasang tombol share tersebut mungkin blog sobat sedikit bisa menjadi ramai pegunjung terus.Bagaimana Cara Memasang Tombol Share FB, Digg, Twitter, Google+ di Blog berikut tips dan langkah-langkahnya.

1. Login ke Blogger
2. Pilih Template > Unduh Template Lengkap > EDIT HTML > Expand Template Widget
3. Cari kode <data:post.body/> ,bila sobat sudah Memasang Read More di blogbiasanya kode tersebut ada dua sobat bisa pilih kode yang kedua dan copy kode di bawah ini di bawah kode <data:post.body/>.

<b:if cond='data:blog.pageType == "item"'>
<div style='border-top:1px solid #ccc;border-bottom:1px solid #ccc; padding:8px 0px;margin:5px 0px 5px 0px;width:100%;float:left;height:20px;'>
<div style='float:left;padding-left:0px;font:normal 12px Georgia;'>
Share this on :
</div>
<div style='float:left;padding-left:10px;'>
<a name='fb_share' type='button_count'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'>
</script></div>
<div style='float:left;padding-left:10px;'>
<a class='DiggThisButton DiggCompact'/>
<script type='text/javascript'>
(function() {
var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://widgets.digg.com/buttons.js';
s1.parentNode.insertBefore(s, s1);
})();
</script>
</div>
<div style='float:left;padding-left:10px;'>
<a class='twitter-share-button' data-count='horizontal' data-via='User Name' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</div>
<div style='float:left;padding-left:10px;'>

<g:plusone size='medium'/>

<script type='text/javascript'>
(function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div>
</div>
</b:if>

Sobat bisa ganti tulisan Share This On : dengan selera sobat masing-masing.

4. SIMPAN TEMPLATE

Blogger, Internet, Komputer, Tips&Trick

November 14, 2014 hendra No comments

Merubah Older Post Pada Blog Menjadi Angka

POSTED BY FENDI SAPUTRA POSTED ON 6/23/2012 WITH 2 COMMENTS

Sempat saya googling di mbah google mencari trick untuk mengubah older post dan home menjadi urutan angka akhirnya ketemu , Secara umum, navigasi untuk pindah halaman di blogspot biasanya menggunakan link dengan teks "Older Posts (posting lama)" dan "Newer Posts (posting baru) ".

Beda dengan wordpress yang navigasinya bisa berbentuk angka sehingga bisa memudahkan untuk loncat ke beberapa halaman ke postingan yang lama maupun baru.
nah trick kali ini akan menjelaskan bagaimana cara mengganti link "Older Posts (posting lama)" dan "Newer Posts (posting baru)" menjadi angka seperti gambar di bawah ini

1. Langkah awal tentu saja harus menuju ke desain template anda kemudian ke "Edit HTML"
2. setelah itu cari kode ini ]]></b:skin> kalo sudah ketemu taruh script dibawah ini sebelum kode tersebut

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

3. setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut.

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>

kalau sudah silahkan di lihat ...semoga berhasil:)

DOLLAR GRATIS

cari dollar lewat internet, baik itu PTC,PPC dan lain - lain

Monday, November 17, 2014

Saturday, November 15, 2014

Cara Mudah Memasang Komentar Facebook Di Blog

Friday, November 14, 2014

Widget recent comment dengan efek avatar dan tooltip

Tutorial

CARA TINGKATKAN PENGHASILAN GOOGLE ADSENSE

Site search results

Websites

Mobile webpages and apps

Feeds

MENGISI DAN MENAMPILKAN ARTIKEL TERTENTU DI HALAMAN BLOG

CARA MEMASANG TOMBOL SHARE FB, DIGG, TWITTER, GOOGLE+ DI BLOG

Merubah Older Post Pada Blog Menjadi Angka

Popular Posts

Categories

Blog Archive

Total Pageviews

Blog Sahabat

Twitter

Followers