Tutorial Membuat Link Dalam Satu Halaman Blog : Kalau membuat link ke halaman lain sudah banyak yang tahu, yang gunanya untuk mengelink artikel kita sendiri di posting sebelumnya, atau membuat link ke artikel atau blog mlik orang lain yg tulisannya kita kutip. Berikut akan kita bahas cara...
Selengkapnya diMEMBUAT LINK DALAM SATU HALAMAN BLOG
Blog Tutorial
MEMBUAT LINK DALAM SATU HALAMAN BLOG
INSTALASI WORDPRESS OFFLINE MENGGUNAKAN XAMPP
INSTALASI WORDPRESS OFFLINE MENGGUNAKAN XAMPP : Langkah awal untuk melakukan instalasi wordpress pada local host (wordpress offline) adalah dengan menyediakan surce yang kita butuhkan untuk proses instalasinya. Yaitu XAMPP dan Paket CMS WordPress
Download XAMPP dan WordPress : Untuk proses...
Selengkapnya diINSTALASI WORDPRESS OFFLINE MENGGUNAKAN XAMPP
Blog Tutorial
PENGENALAN PERANGKAT KOMPUTER
PENGENALAN PERANGKAT KOMPUTER : Dalam artikel ini akan sedikit dijelaskan apa saja yang membangun sebuah Komputer, bisa dikatakan ini adalah Dasar – dasar Perangkat Komputer, untuk menunjang kegiatan komputasi anda, saya kira artikel Perangkat Dasar Komputer ini layak untuk dibaca, karena...
Selengkapnya diPENGENALAN PERANGKAT KOMPUTER
Blog Tutorial
Agar Blog Cepat Terindeks Google
Untuk artikel kali ini saya akan membahas Tips dan Trik Blog Cepat Terindeks Google , jika sebelumnya saya telah share artikel tentang Optimasi SEO Blog , saya kira artikel tersebut layak anda konsumsi juga untuk mengoptimalkan Blog atau Website dimata search Engine, untuk mempromosikan Blog...
Selengkapnya diAgar Blog Cepat Terindeks Google
Blog Tutorial
TIPS DAN TRIK SEO
TIPS DAN TRIK SEO : Setelah Anda membangun sebuah Blog atau Website, selain menulis Artikel, Anda wajib untuk tahu cara mengoptimasikan Blog Anda, agar nantinya Blog Anda diketahui oleh pengunjung Blog, sayangkan kalau sudah susah payah kita menulis, tapi tidak ada yang tahu tentang tulisan...
Selengkapnya diTIPS DAN TRIK SEO
Blog Tutorial
TIPS BERSELANCAR DI INTERNET (BROWSING)
Pada saat melakukan browsing, sedikit banyak pasti pernah mengalami satu permasalahan, misalnya kecepatan, keamanan ataupun yang lainnya. Untuk menghindari beberapa masalah tersebut, ada baiknya anda mempunyai kiat atau tips tersendiri saat melakukan browsing Internet. Kecepatan akses adalah...
Selengkapnya diTIPS BERSELANCAR DI INTERNET (BROWSING)
Blog Tutorial
anekahosting.com web hosting murah terbaik di indonesia
anekahosting.com web hosting murah terbaik di indonesia , menentukan layanan hosting yang baik bisa jadi merupakan pekerjaan yang cukup sulit mengingat semakin menjamurnya situs -situs penyedia layanan web hosting di indonesia tentunya dengan promosi – promosi keunggulan masing masing,...
Selengkapnya dianekahosting.com web hosting murah terbaik di indonesia
Blog Tutorial
Membuat Link Membesar Saat disentuh Kursor
- Masuk ke akun blogger sobat.
- Pilih Template > Edit HTML.
- Ceklis / Centang Expand Widget Template.
- Cari kode a:hover {
- Ganti kode font-size dengan ukuran yang lebih besar.
Contoh :a:hover {ganti dengan
color:#d2691e;
font-size:10px;
font-style:italic;
cursor:wait;
}a:hover {
color:#d2691e;
font-size:19px;
font-style:italic;
cursor:wait;
} - Terakhir klik Simpan Template.
Zhefa Blogger template
Platform Type | Blogger / Blogspot |
Nama Template | Zhefa Blogger template |
Deskripsi | Zhefa Blogger template adalah template blogger gratis dengan dua buah sidebar di sebelah kanan. |
Template Author | http://wadahtutorial.blogspot.com/ |
Instruksi URL | Cara Mengganti Template |
Membuat Gambar Membesar Saat disentuh Cursor
- Masuk ke akun blogger sobat.
- Pilih Template > Edit HTML.
- Ceklis / Centang Expand Widget Template.
- Cari kode ]]></b:skin> , gunakan fungsi Find dengan menekan tombol CTRL+F pada keyboard.
- Kalau sudah ketemu, letakkan kode berikut tepat di atas kode ]]></b:skin>.post img, table.tr-caption-container { border:none; max-width:560px; height:auto; -o-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; }
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.5); -o-transform: scale(1.5); -webkit-transform: scale(1.5); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6); } - Terakhir klik Simpan Template. Sekarang lihat hasilnya di blog Sobat.
Cara Menghapus Waktu Komentar
- Login ke akun Blogger Sobat.
- Pilih Template > Edit HTML.
- Cari kode <span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span> - Jika sudah ketemu hapus semua kode tersebut.
- Selanjutnya Simpan Template Sobat.
Membuat Dua Kolom Widget di Blogspot
- Login Blogger Sobat.
- Pilih Template > Edit HTML.
- Ceklis / Centang Expand Widget Template.
- Cari kode ]]></b:skin> dengan menekan tombol CTRL+F pada keyboard.
- Letakkan script berikut ini diatas ]]></b:skin> :#box-main-container {*Anda dapat mengubah padding ( jarak posisi gadget ) 0px 10px 10px 10px maksudnya adalah Jarak ( Atas, Kanan, Bawah, Kiri ).
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}
*Anda juga dapat merubah border ( garis tepi widget ) dengan warna, caranya hapus $bordercolor dan ganti dengan kode warna yang Anda inginkan. - Kemudian cari kode
- <div id='main-wrapper'>
- <div id='content-wrapper'>
- <div id='header'> atau <div id='header-wrapper'>
- <div id='sidebar-wrapper'>
- <div id='bottom'>
*<div id='main-wrapper'> adalah posisi halaman utama anda. Biasanya dipakai untuk penempatan menu horizontall atau daftar isi sebuah blog.
*<div id='content-wrapper'> adalah posisi postingan.
*<div id='header'> adalah posisi kepala. Biasanya ditempatkan judul blog dan deskripsi blog.
*<div id='sidebar-wrapper'> adalah posisi sidebar blog.
*<div id='bottom'> adalah posisi paling bawah. Atau Footer Blog Anda.
Silakan pilih salah satu, mau menempatkannya dimana. - Jika sudah didapat atau hampir sama dengan kode diatas, letakkan kode HTML di bawah ini<div id="box-main-container"> <div id="box1" style="float: left; margin: 0; text-align: left; width: 50%;"> <b:section class="box-column" id="col1" preferred="yes" style="float: left;"> </b:section></div> <div id="box2" style="float: right; margin: 0; text-align: left; width: 50%;"> <b:section class="box-column" id="col2" preferred="yes" style="float: right;"> </b:section></div>Silakan Anda letakkan di bagian atas atau dibawah salah satu kode tadi.
<div style="clear: both;"> </div></div>
*Sebagai contoh saya letakkan dibawah kode <div id='main-wrapper'>
*Hasilnya seperti gambar berikut - Jika sudah selesai klik Preview / Pratinjau dulu, baru klik Save Template / Simpan Template.
Cara Menghilangkan Link Langganan Entri Atom
- Login ke akun blogger sobat.
- Pada Dasbor blogger klik Template > Edit HTML > Lanjutkan.
- Beri tanda centang pada Expand Template Widget
- Cari kode di bawah ini, gunakan fungsi Find (Ctrl+F) biar mudah.<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div> - Hapus semua kode diatas.
- Lalu klik Simpan Templates
- Login ke akun blogger sobat.
- Pada Dasbor blogger klik Template > Edit HTML > Lanjutkan.
- Beri tanda centang pada Expand Template Widget.
- Cari kode ]]></b:skin , gunakan fungsi Find (Ctrl+F).
- Letakkan kode berikut, tepat diatas kode ]]></b:skin>.feed-links{display:none;}
- Setelah itu, klik Simpan Templates ( sebaiknya klik Pratinjau terlebih dahulu )
Memberi Efek Taburan Bintang di Blog
- Pada dashboard blogger klik Template > Edit html
- Beri centang pada Expand Template Widget
- Cari kode </body> lalu letakkan kode script efek di atas kode </body>, berikut script-nya:
Efek bintang berwarna kuning,<script src='http://wadah-tutorial.googlecode.com/files/bintangkuning.js' type='text/javascript'/>Efek bintang berwarna biru,<script src='http://wadah-tutorial.googlecode.com/files/bintangbiru.js' type='text/javascript'/>Efek bintang berwarna oren,<script src='http://wadah-tutorial.googlecode.com/files/bintangoren.js' type='text/javascript'/>Efek bintang berwarna pink,<script src='http://wadah-tutorial.googlecode.com/files/bintangpink.js' type='text/javascript'/> - Terakhir klik Save Template.
- Pada dashboard klik Tata Letak > Add a gadget > HTML/JavaScript.
- Letakkan script dibawah ini pada gadget.
Efek bintang berwarna kuning,<script src='http://wadah-tutorial.googlecode.com/files/bintangkuning.js' type='text/javascript'/></script>Efek bintang berwarna biru,<script src='http://wadah-tutorial.googlecode.com/files/bintangbiru.js' type='text/javascript'/></script>Efek bintang berwarna oren,<script src='http://wadah-tutorial.googlecode.com/files/bintangoren.js' type='text/javascript'/></script>Efek bintang berwarna pink,<script src='http://wadah-tutorial.googlecode.com/files/bintangpink.js' type='text/javascript'/></script> - Lalu klik Simpan / Save.
Tips Mengatasi Pencurian Artikel Blog
- Login ke Blog sobat.
- Klik Dasbor > Setelan > Lainnya.
- Pada "Izinkan Umpan Blog", ganti opsi Penuh menjadi Singkat.
- Simpan Setelan
- Login ke Blog sobat.
- Klik Dasbor > Setelan > Lainnya.
- Pada "Footer Feed Posting" klik "Tambahkan".
- Lalu masukan script dibawah ini:<a href="URL BLOG">Copyright by: NAMA BLOG</a>contoh :
<a href="http://wadahtutorial.blogspot.com/">Copyright by: Tutorial Blog</a> - Simpan Setelan
- Login ke Blog sobat.
- Klik Dasbor > Setelan > Lainnya.
- Pada "Izinkan Umpan Blog" pilih "Tak Satupun".
- Simpan Setelan.
Memberi Efek Taburan Hati di Blog
- Pada dashboard blogger klik Template > Edit html
- Beri centang pada Expand Template Widget
- Cari kode </body> lalu letakkan script efek di atas kode </body>, berikut script-nya:<script src='http://wadah-tutorial.googlecode.com/files/hearts.js' type='text/javascript'/>
- Terakhir klik Save Template.
- Pada dashboard klik Tata Letak > Add a gadget > HTML/JavaScript.
- Letakkan script dibawah ini pada gadget.<script src='http://wadah-tutorial.googlecode.com/files/hearts.js' type='text/javascript'/></script>
- Lalu klik Simpan / Save.
Mengatasi Duplikasi Deskripsi Meta
- Login ke akun blogger
- Klik pada Template.
- Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
- Beri tanda centang pada Expand Template Widget.
- Pada kode<meta content='Deskripsi' name='description'/>Sedikit saya tambah kode menjadi :
<meta content='keyword1, keyword2, keyword3, ...' name='keywords'/><b:if cond='data:blog.url == data:blog.homepageUrl'>Dengan begini meta description & meta keywords di tampilkan hanya untuk halaman utama (homepage).
<meta content='Deskripsi' name='description'/>
<meta content='keyword1, keyword2, keyword3, ...' name='keywords'/>
</b:if> - Terakhir klik Simpan Template.
Membuat Daftar Isi Blogger
- Login ke blogger.
- Klik Laman > Laman Baru > Laman Kosong.
- Beri judul Daftar Isi atau Sitemap atau apalah terserah Anda.
- Kemudian klik pada tab Edit HTML.
- Lalu letakkan kode berikut pada area artikel.<div style="overflow:auto;width:480px;height:450px;padding:10px;border:1px solid #eee">Keterangan :
<script src="https://html-scripts.googlecode.com/files/feeds.js"></script>
<script src="http://wadahtutorial.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script>
</div>- Ganti Alamat wadahtutorial.blogspot.com dengan url / alamat blog Sobat.
- width:480px : Lebar area, ganti dengan ukuran yang sobat inginkan.
- height:450px : Tinggi area, ganti sesuai keinginan sobat.
- Untuk tidak menggunakan text area atau scroll hapus tulisan yang saya beri latar kuning.
- https://html-scripts.googlecode.com/files/feeds.js : ganti dengan alamat daftar isi yang anda inginkan. Berikut beberapa kodenya :
- Berdasarkan Label :
https://html-scripts.googlecode.com/files/feeds-labels.js - Berdasarkan Tanggal :
https://html-scripts.googlecode.com/files/feed-dates.js - Berdasarkan Artikel terbaru :
https://html-scripts.googlecode.com/files/feeds.js
- Berdasarkan Label :
- Klik tombol Preview / Pratinjau untuk melihat hasilnya, jika sudah benar klik Publish Page / Tayangkan Laman. Lalu buka Blog Sobat dan lihat hasilnya…
- Pada dashboard blogger, klik Tata Letak.
- Klik Tambah Gadget.
- Pilih HTML/Javascript.
- Silakan beri judul pada widget. Lalu letakkan kode berikut :<div style="overflow:auto;height:250px;padding:10px;border:1px solid #eee">
<script src="https://html-scripts.googlecode.com/files/feeds.js"></script>
<script src="http://wadahtutorial.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">
</script>
</div>- Ganti Alamat wadahtutorial.blogspot.com dengan url / alamat blog Sobat.
- Ganti https://html-scripts.googlecode.com/files/feeds.js dengan kode daftar isi dibawah ini :
- Berdasarkan Label :
https://html-scripts.googlecode.com/files/feeds-labels.js - Berdasarkan Tanggal :
https://html-scripts.googlecode.com/files/feed-dates.js - Berdasarkan Artikel terbaru :
https://html-scripts.googlecode.com/files/feeds.js
- Klik tombol SAVE. Lalu lihat hasilnya di Blog Sobat.
Trik Mempercepat Loading Blog
- Masuk ke akun blogger anda
- Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
- Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
- Beri tanda centang pada Expand Template Widget.
- Cari kode </head> gunakan CTRL + F pada keyboard.
- Lalu letakkan kode berikut di atas kode </head>.<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://wadah-tutorial.googlecode.com/files/superload.js' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'> $(function() { $("img").lazyload({placeholder : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIsACWrnbiqs7bIQRmVOhfhsK9PcOuzQANXUP6MnjiKsJtIuGqjJYa_yPmDhpiDhvZjJp4guFHZCMBC08BPARtqbBH7BERQXz_SEBPHjSmJyUH2s6P2P8n63FczKtRyo6yGi0D0U6KXi8/",threshold : 200}); }); </script> - Terakhir klik Simpan Template.
Cara Mengetahui Duplikat Konten (Duplicate Content)
- Login ke Blogger.
- Masuk ke Webmasters tools
- Pilih blog yang ingin Sobat periksa.
- Klik Pengoptimalan > Penyempurnaan HTML.
disana akan di beritahu laman yang bermasalah dan jumlahnya, lihat gambar.
Memperbaiki Warning Rich Snippets Testing Tool
- Warning : Missing Required Field "Updated"
- Warning : Missing required hCard "author"
- Warning : Missing required field "entry-title"
- Warning : At least one field must be set for HatomFeed
- Memperbaiki Missing Required Field "Updated"
- Memperbaiki Missing Required hCard "Author"
- Mengatasi Missing Required Field "entry-title"
- Mengatasi Warning: At least one field must be set for HatomFeed
Elvetic Blogger Template
Platform Type | Blogger / Blogspot |
Nama Template | Elvetic Blogger Template |
Template Author | http://wadahtutorial.blogspot.com/ |
Instructions URL | Cara Mengganti Template |
Membuat Daftar Isi Label Tertentu
- Login ke dashboard blogger.
- Klik pada Tata Letak > Tambah Gadget.
- Pilih HTML/Java Script
- Lalu isikan kode berikut :<script src='http://html-scripts.googlecode.com/files/feedlabels.js'/></script>
<script src="http://wadahtutorial.blogspot.com/feeds/posts/summary/-/Blogger Templates?max-results=10&alt=json-in-script&callback=recentpostslist"></script>Keterangan :wadahtutorial.blogspot.com ganti dengan alamat blog Sobat.
Blogger Templates ganti dengan Label yang ingin ditampilkan.
10 ganti dengan jumlah postingan yang ingin di tampilkan. - Klik Save dan periksa blog Sobat.
- Login ke blogger Anda, kemudian buat sebuah halaman dengan judul Daftar Isi.
- Kemudian klik pada tab Edit HTML.
- Lalu masukkan kode berikut :<div style="overflow:auto;height:450px;padding:10px;border:1px solid #eee">
<script src='http://html-scripts.googlecode.com/files/feedlabels.js'/></script>
<script src="http://wadahtutorial.blogspot.com/feeds/posts/summary/-/Blogger Templates?max-results=999&alt=json-in-script&callback=recentpostslist"></script>
</div> - Klik tombol Preview / Pratinjau untuk melihat hasilnya, jika sudah benar klik Publish Page / Tayangkan Laman. Lalu buka Blog Sobat dan lihat hasilnya…
Mengatasi Missing Required Field "entry-title"
- Masuk ke akun blogger anda
- Klik pada Template. (backup dulu template anda).
- Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
- Beri tanda centang pada Expand Template Widget.
- Tekan Ctrl + F di keyboard lalu cari kode hentry, Sobat akan menemukan kode dibawah ini :<div class="post hentry">
<div class="post hentry uncustomized-post-template"> - Kalau sudah ketemu hapus kedua hentry pada kode di atas, jadi hasilnya seperti ini :<div class="post">
<div class="post uncustomized-post-template"> - Terakhir klik Simpan Template, dan cek di Rich snippet tools.
- Masih di menu Edit HTML.
- Tekan Ctrl + F di keyboard lalu cari kode<h3 class='post-title.........' ></h3>Tergantung pada template blog Anda, blog Anda mungkin menggunakan tag H1 / H2.
- Ganti kode di atas dengan kode di bawah ini:<h3 class='post-title entry-title'>
- Simpan Template, dan cek di Rich snippet tools.
Memperbaiki Missing Required hCard "Author"
- Login ke akun blogger anda
- Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
- Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
- Beri tanda centang pada Expand Template Widget.
- Cari kode <b:if cond='data:post.hasJumpLink'>, dan letakkan kode berikut di atasnya.<div class='vcard' id='hcard-Madie Zha'>
<span class='fn n'>
<span class='given-name'><data:top.authorLabel/>
<span class='fn'><data:post.author/></span></span>
</span></div>Yang warna biru ganti dengan nama Sobat.*Sebenarnya sobat bisa meletakkan kode tersebut pada Post-header ataupun Post-footer, jadi tidak harus di atas <b:if cond='data:post.hasJumpLink'>. - Terakhir Simpan Template dan cek blog sobat di Rich Snippets Testing.
<div class='vcard' id='hcard-NAMA'>
<span class='fn n'> <span class='given-name'><data:top.authorLabel/>
<span class='fn'><data:post.author/></span></span></span></div>
<a class='updated' href='http://wadahtutorial.blogspot.com/' rel='bookmark'>Nama Blog</a> Updated at: <abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></div>
Semoga berhasil memperbaiki Missing required hCard "author".
NofxSilver Blogger Template
Platform Type | Blogger / Blogspot |
Nama Template | NofxSilver Blogger Template |
Template Author | http://wadahtutorial.blogspot.com/ |
Instructions URL | Cara Mengganti Template |
Memperbaiki Missing Required Field "Updated"
- Masuk ke akun blogger anda
- Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
- Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
- Beri tanda centang pada Expand Template Widget.
- Cari kode <abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr>
- Ganti kata 'published' dengan kata 'updated', seperti kode berikut :<abbr class='updated' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr>
- Simpan Template dan cek lagi di Rich Snippets Testing.
Eywo Blogger Template
Platform Type | Blogger / Blogspot |
Nama Template | Eywo Blogger Template |
Description | Eywo Blogger Template adalah template blogger gratis yang ringan dengan 2 buah sidebar di sebelah kanan, space ads, minimalist, dan motif yang sederhana. |
Template Author | http://wadahtutorial.blogspot.com/ |
Instructions URL | Cara Mengganti Template |