Berbagi Tutorial Bloggies

Memasang Domain CO.VU Gratis Selamanya

<div dir="ltr" style="text-align: left;" trbidi="on">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3LXHCC1uyXrvZKRsgna-NoytiibPw8fzF7eZ1HJUJi2UZ3AqGOoJcPAqOR50vOFvrdlWS2bNrjt26Cwmg9jUTOaSpxPGGUDvuxIs_EK15AseqIUdY80FI_aa5Foydq9RNRRpMxHzRhgU/s1600/bertubies.blogspot.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Cara Memasang Domain Gratis Selamanya" height="103" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3LXHCC1uyXrvZKRsgna-NoytiibPw8fzF7eZ1HJUJi2UZ3AqGOoJcPAqOR50vOFvrdlWS2bNrjt26Cwmg9jUTOaSpxPGGUDvuxIs_EK15AseqIUdY80FI_aa5Foydq9RNRRpMxHzRhgU/s400/bertubies.blogspot.png" title="Cara Memasang Domain CO.VU Gratis Selamanya" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Contoh Domain (dot)CO(dot)VU</td></tr>
</tbody></table>
<br />
<div>
<div style="text-align: justify;">
<b>Memasang Domain CO.VU Gratis Selamanya</b> - Layanan pemberi domain gratis ini sangat membantu blogger yang menyukai hal yang simple tanpa mengeluarkan biaya. Domain ini membuat link blog menjadi lebih pendek contohnya <i>bertubies.blogspot.com</i> menjadi <i>www.bertubies.co.vu </i>sehingga blog pun terlihat lebih professional. Untuk menambah sedikit pengetahuan tentang co.vu ini, saya akan memberitahu arti vu yang ada dibelakang domain. Jadi, kata "VU" merupakan singkatan dari Vanuatu, sebuah negara yang berada di kawasan lautan pasifik dekat Australia.</div>
<div style="text-align: justify;">
<br />
<br /></div>
<div style="text-align: justify;">
<b>Cara Mendaftarkan Domain dan Akun</b></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
1. Kunjungi <a alt="Cara mendaftarkan domain gratis co.vu" href="http://codotvu.com/" rel="nofollow" target="_blank" title="Cara Mendaftarkan Domain dan Akun di co.vu">CODOTVU</a><br />
2. Isi kotak "Enter a Domain Name" dengan nama domain yang diinginkan. Contoh:  bertubies<br />
3. Klik Search.<br />
4. Kalau alamat tersedia, klik Register Now. Kalau tidak tersedia, coba buat nama lain.<br />
5. Isi Username, Email, dan Password Anda di kotak formulir. Jika ingin cara cepat, Anda bisa daftar dengan menggunakan akun facebook.<br />
6. Klik Create Account.<br />
7. Kemudian, Anda buka Email Anda untuk verifikasi akun tersebut.<br />
8. Selesai. Sekarang Anda sudah punya akun dan domain baru.<br />
<br />
Tapi, belum seluruhnya selesai. Sekarang Anda harus mengarahkan domain tersebut untuk mengganti domain lama Anda.<br />
<br />
<br />
<b> Custom Domain Blogger: </b><b>Cara Mengganti Blogspot ke CO.VU</b><br />
<br />
1. Masuk ke akun Blogger Anda. Tapi jangan tutup website CODOTVU nya.<br />
2. Klik blog yang akan dirubah.<br />
3. Klik Settings/ Setelan.<br />
4. Pada tab Basic terdapat menu Penerbitan/ Publishing, klik +Set up a third-party URL for your blog<br />
6. Masukkan alamat co.vu Anda. Contoh: www.bertubies.co.vu<br />
7. Klik Simpan.<br />
8. Akan ada pesan error. Tapi, jangan khawatir. Terdapat 2 kolom yang berisi kode-kode, Copy kode-kode tersebut kemudian kembali ke website codotvu (Lihat Gambar)<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0vDFApak3i4QBSrnwFRLZZ7fny38_N_agcyNf5ozcL5YAn5nPupJcKt6OKO_jh3YAdVXLM0_VwTKuvep1_1K4xkLnlwwdWrbyoZWT8DMCW7PrpIlIU4paDp-oMyRb0wNuensybzR2jLo/s1600/bertubies.blogspot.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara mudah custom domain blogger 2015" height="235" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0vDFApak3i4QBSrnwFRLZZ7fny38_N_agcyNf5ozcL5YAn5nPupJcKt6OKO_jh3YAdVXLM0_VwTKuvep1_1K4xkLnlwwdWrbyoZWT8DMCW7PrpIlIU4paDp-oMyRb0wNuensybzR2jLo/s320/bertubies.blogspot.png" title="Cara mudah custom domain blogger 2015" width="320" /></a></div>
9. Pada website codotvu, Paste kode-kode tadi di kolom yang disediakan (Lihat Gambar)<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjruwYd0UEnP0tgOMtslPCSUjv9ZWyQiYeYAmJl5wTTPW56RKS92hNXlNTGDZy4s1chy8twY45kM8KjithKtL-3mo-nbIyzXKfY3eH_vykWrXYRBwkMBHx2vLJkipodQZhJxey3qnZjMe8/s1600/bertubies.blogspot.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara mendapatkan domain gratis 2015" height="102" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjruwYd0UEnP0tgOMtslPCSUjv9ZWyQiYeYAmJl5wTTPW56RKS92hNXlNTGDZy4s1chy8twY45kM8KjithKtL-3mo-nbIyzXKfY3eH_vykWrXYRBwkMBHx2vLJkipodQZhJxey3qnZjMe8/s400/bertubies.blogspot.png" title="Cara mendapatkan domain gratis 2015" width="400" /></a></div>
10. Kemudian Klik Create Verification CNAME.<br />
11. Anda kembali lagi ke Blogger.<br />
12. Klik Simpan.<br />
13. Jika sudah tersimpan, klik Edit.<br />
14. Centang kotak check box dengan tulisan Redirect bertubies.co.vu to www.bertubies.co.vu.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTZUKP0MnVt9O4pt0bs8Yn6jdhWNl6_qjU8RPZMA8-gdq8SXT0aXvSprClcvlHpVyVeUiJ2Pz7ZoaSqM9BceIIRYvnCQ-TxQNmPuNtxVFc98DxtSb4kSwEXOwJXu05NmeZwW0d7zBu8dM/s1600/bertubies.blogspot.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Terbaru Custom Domain Co.Vu" height="171" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTZUKP0MnVt9O4pt0bs8Yn6jdhWNl6_qjU8RPZMA8-gdq8SXT0aXvSprClcvlHpVyVeUiJ2Pz7ZoaSqM9BceIIRYvnCQ-TxQNmPuNtxVFc98DxtSb4kSwEXOwJXu05NmeZwW0d7zBu8dM/s400/bertubies.blogspot.png" title="Cara Terbaru Custom Domain Blogger Menjadi Co.Vu" width="400" /></a></div>
15. Klik Simpan. Selesai.<br />
<br />
<br />
<div style="text-align: center;">
===</div>
</div>
</div>
</div>

Memasang Domain CO.VU Gratis Selamanya

Contoh Domain (dot)CO(dot)VU Memasang Domain CO.VU Gratis Selamanya - Layanan pemberi domain gratis ini sangat membantu blogger yan...

00:03

Cara Memasang Scroll Untuk Blog Archive

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
Cara Memasang Scroll Untuk Blog Archive - Melalui Blog Archive, pengunjung dapat dengan mudah menelusuri postingan/ artikel suatu blog karena semua artikel yang telah dibuat akan secara otomatis ditampilkan pada Blog Archive. Jadi pemakaian widget Blog Archive bisa dikatakan cukup penting sebagai navigasi bagi pengunjung. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Blog Archive merupakan salah satu widget yang sudah disediakan oleh Blogger, jadi untuk memasang Blog Archive itu sangat mudah. Berikut ini adalah <b>Cara Pemasangan Blog Archive Blogger di Sidebar</b>.  </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
1. Log in akun Blogger Anda.</div>
<div style="text-align: justify;">
2. Masuk ke Layout.</div>
<div style="text-align: justify;">
3. Klik Add A Gadget.</div>
<div style="text-align: justify;">
4. Pilih Blog Archive.</div>
<div style="text-align: justify;">
5. Save.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Setelah memasang Blog Archive, Anda bisa lihat hasil tampilan widget tersebut di sidebar Anda. Jika Anda memiliki postingan artikel yang cukup banyak setiap bulannya maka semua judul akan ditampilkan dan akan membuat tampilan sidebar dipenuhi oleh deretan judul artikel. Nah, untuk membuat tampilan Blog Archive menjadi lebih rapi dan ringkas, Anda dapat memasang scroll box ini. Silakan ikuti <b>Cara Memasang Scroll Untuk Blog Archive</b>.<br />
<br /></div>
<div style="text-align: justify;">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh52U9w7YV-wJvIyFBidbziMHPqdMuuS6XGCyZZnWIH3oFJBrS6L6QwOFra8lIJA7K6zq5xGojUqPEFSWntluJitolBoTx5AS9Lvg0d4VmC9XB5ov__TMyiFrSIaYLEhUy6_LhZDKNL4R4/s1600/Bertubies+Blog+Archive+(2).jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Cara Memasang Scroll Box Untuk Blog Archive" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh52U9w7YV-wJvIyFBidbziMHPqdMuuS6XGCyZZnWIH3oFJBrS6L6QwOFra8lIJA7K6zq5xGojUqPEFSWntluJitolBoTx5AS9Lvg0d4VmC9XB5ov__TMyiFrSIaYLEhUy6_LhZDKNL4R4/s1600/Bertubies+Blog+Archive+(2).jpg" title="Cara Memasang Scroll Untuk Blog Archive" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Tampilan Sebelum dan Sesudah memakai Scroll Box</td></tr>
</tbody></table>
</div>
<div style="text-align: justify;">
1. Masuk ke Template Blog Anda.</div>
<div style="text-align: justify;">
2. Klik Edit HTML.</div>
<div style="text-align: justify;">
3. Dengan menggunakan fungsi find pada keyboard (tekan ctrl + F serentak), cari kode.</div>
<pre><div id='ArchiveList'></pre>
4. Lihat kode yang ada tepat di atas <div id='ArchiveList'>, Anda akan menemukan kode di bawah ini.<br />
<pre><div class='widget-content'></pre>
<div style="text-align: justify;">
5. Gantikan kode <div class='widget-content'> yang Anda temui di langkah 4 dengan kode di bawah.</div>
<pre><div class='widget-content' style='overflow:auto; height:<span style="color: magenta;">200</span>px'></pre>
Anda dapat mengatur ketinggiannya dengan mengganti <span style="color: magenta;">200</span> dengan ukuran yang dibutuhkan.<br />
<br />
<span style="color: red;">Preview Kode</span><br />
<div style="text-align: justify;">
<br />
Sebelum :</div>
<pre><div class='widget-content'>
<div id='ArchiveList'></pre>
<br />
<div style="text-align: justify;">
Setelah memasang scrollbox :</div>
<pre><div class='widget-content' style='overflow:auto; height:200px'>
<div id='ArchiveList'></pre>
<br />
6. Save. Lihat hasilnya.<br />
<div style="text-align: center;">
===</div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<br /></div>
</div>

Cara Memasang Scroll Untuk Blog Archive

Cara Memasang Scroll Untuk Blog Archive - Melalui Blog Archive, pengunjung dapat dengan mudah menelusuri postingan/ artikel suatu blog kar...

11:40

Membuat Daftar Isi atau Sitemap Blog Responsive

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHk7P-LsYbShqfDOP5tymUrQvB46_6Kd9F-ciHQFFU3eSEnZZMJMG3piInITlxO_u_bs-6zcEJQIQ5pmvPabnyzcijZYVB4ZmvLDVYsIz1ilrdVo2pvnNTnfok2hBWR-VGUCc0qxa5Y6g/s1600/Daftar+Isi+Bertubies.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Memasang daftar isi responsive di blog" height="252" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHk7P-LsYbShqfDOP5tymUrQvB46_6Kd9F-ciHQFFU3eSEnZZMJMG3piInITlxO_u_bs-6zcEJQIQ5pmvPabnyzcijZYVB4ZmvLDVYsIz1ilrdVo2pvnNTnfok2hBWR-VGUCc0qxa5Y6g/s1600/Daftar+Isi+Bertubies.png" title="Daftar Isi atau Sitemap Blog Responsive" width="320" /></a></div>
<div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="http://bertubies.blogspot.com/p/daftar-isi-bertubies.html" target="_blank">Demo</a></li>
</ul>
</div>
<br />
<br />
<br />
<span style="text-align: justify;">Cara Membuat Daftar Isi atau Sitemap Blog Responsive dan Keren - Tutorial ini akan menampilkan semua judul artikel berdasarkan label blog Anda secara terurut dari huruf A-Z. Selain itu, tutorial ini akan sangat berguna untuk saat ini karena sudah banyak sekali para blogger yang menggunakan template yang sudah responsive pada smartphone android dan tablet. Jadi, ini akan sangat cocok untuk dipasang pada blog Anda yang menggunakan template canggih sekarang ini dengan menggunakan script daftar isi yang akan saya share.</span><br />
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Kenapa harus responsive? tentunya agar daftar isi (sitemap) Anda bisa tampil dengan sempurna saat pengunjung mengunjungi laman daftar isi Anda melalui smartphone. Jadi, dengan menggunakan D<b>aftar Isi Responsive</b> ini, Anda dapat menyajikan daftar isi blog Anda sesuai dengan keadaan pengguna dan pembaca blog Anda agar lebih nyaman dan mudah dalam membaca artikel di blog Anda.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Langsung saja ikuti tutorial <b>Membuat Daftar Isi atau Sitemap Blog Responsive.</b></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
1. Masuk ke akun Blogger Anda.</div>
2. Terdapat dua pilihan tempat untuk memasang script daftar isi ini.<br />
<ul style="text-align: left;">
<li>Klik "New Post" > Klik tab "HTML" bukan Compose. (Pasang di Halaman Postingan)</li>
<li>Klik "Pages" > Pilih "New Page" > Klik tab "HTML" bukan Compose. (Pasang di Halaman Statis)</li>
</ul>
3. Copy kode berikut.
<br />
<pre><div dir="ltr" style="text-align: left;" trbidi="on">
<style type="text/css">
#toc{
width:99%;
margin:5px auto;
border:1px solid #FF427E;
-webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
-moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
}
.labl{
color:#FF5F00;
font-weight:bold;
margin:0 -5px;
padding:1px 0 2px 11px;
background:-moz-linear-gradient(right,#F9D7E3 0%,#FA8AA8 40%);
background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#FA8AA8),color-stop(1,#F9D7E3));
border:1px solid #FF427E;
border-radius:4px;-moz-border-radius:4px;
-webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
-moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;
}
.labl a{
color:#fff;
}
.labl:first-letter{t
ext-transform:uppercase;
}
.new{
color:#F83777;
font-weight:bold;
font-style:italic;
}
.postname{
font-weight:normal;
background:-moz-linear-gradient(right,#F9D7E3 0%,#fff 40%);
background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#F9D7E3));
}
.postname li{
border-bottom: #ddd 1px dotted;
margin-right:5px
}
</style>

<div id="toc">
<script src="https://googledrive.com/host/0ByNodV_m9cVLR0pmWFgwZ1NmdW8/" type="text/javascript"></script>
<script src="http://<span style="color: red;"><b>bertubies.blogspot.com</b></span>/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>
</div>
</pre>
<br />
4. Ganti tulisan berwarna <span style="color: red;">merah</span> dengan URL blog Anda.<br />
5. Simpan dan lihat hasilnya.<br />
<br />
<br />
<div style="text-align: center;">
===</div>
<br />
<br /></div>

Membuat Daftar Isi atau Sitemap Blog Responsive

Demo Cara Membuat Daftar Isi atau Sitemap Blog Responsive dan Keren - Tutorial ini akan menampilkan semua judul artikel berdasa...

22:09

Widget Random Post Untuk Blogger

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpxEMUMKQe2e_K_SvWZt8Jpb5V9RZyX8Ac27j7GJpz4bi0UlCaoUSIXWR9CCOyob0uDGB49dw7y145PEWhP12TcjcGgO__lvFdg8yHtaze68NlZtQu0kI-LRyfiwykmeCTw3es1T9HVQ4/s1600/bertubies.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="widget random post keren untuk blog" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpxEMUMKQe2e_K_SvWZt8Jpb5V9RZyX8Ac27j7GJpz4bi0UlCaoUSIXWR9CCOyob0uDGB49dw7y145PEWhP12TcjcGgO__lvFdg8yHtaze68NlZtQu0kI-LRyfiwykmeCTw3es1T9HVQ4/s1600/bertubies.png" title="Widget Random Post Untuk Blogger" width="272" /></a></div>
<span style="font-size: large;"><br /></span>
<span style="font-size: large;">Pengertian</span></div>
<br />
<div style="text-align: justify;">
<b>Widget random post</b> untuk blogger adalah widget yang akan menampilkan daftar postingan secara acak yang akan berubah setiap kali Blog dimuat (reload). Biasanya widget ini ditempatkan pada bagian Sidebar Blog. Saya pun memasang widget ini di sidebar blog, silakan lihat sidebar saya yang berjudul Random Post. </div>
<br />
<br />
<div style="text-align: justify;">
<span style="font-size: large;">Keuntungan menggunakan Widget Random Post di Blog</span></div>
<br />
<div style="text-align: justify;">
Widget ini sangat ringan dan sederhana sehingga tidak akan mengganggu kecepatan Loading Halaman Blog. Walaupun sederhana namun Widget ini bermanfaat untuk tetap menampilkan semua postingan sesuai batas yang dtentukan dan daftar postingan yang ditampilkan akan berubah setiap kali halaman dimuat.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Widget ini dapat membantu Anda untuk tetap menghidupkan postingan-postingan Anda yang sudah lama sekalipun, selain itu Internal Link yang memudahkan pengunjung untuk melihat postingan lain yang mungkin mereka minati akan meningkatkan PageView blog Anda. Jika PageView blog meningkat maka Rank Alexa dan Kualitas Blog Anda di mata mesin pencari juga akan semakin baik.</div>
<br />
<br />
<div style="text-align: justify;">
<span style="font-size: large;">Cara memasang <span style="text-align: left;">Widget Random Post Untuk Blogger</span></span></div>
<div style="text-align: justify;">
<br />
1. Login ke Blogger.</div>
<div style="text-align: justify;">
2. Copy Kode di bawah ini.<br />
<pre><script type="text/javascript"> var randarray = new Array(); var l=0; var flag; var numofpost=10; function randomposts(json){var total = parseInt(json.feed.openSearch$totalResults.$t,10);for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";document.write(item);}}}document.write('</ul>');} </script> <script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>
<div style="clear: both;font-size: 8px;text-align:right;"><a target="_blank" href="http://bertubies.blogspot.com/2015/03/widget-random-post-untuk-blogger.html">Random Po</a><a href="http://bertubies.blogspot.com/">sts</a></div>
</pre>
<br />
3. Paste-kan di Widget HTML/JavaScript (Layout > add a gadget > HTML / JavaScript).<br />
4. Kode yang berwarna merah (numofpost=<b><span style="color: red;">10</span></b>;) angkanya bisa Anda ganti. Itu menentukan jumlah postingan yang akan muncul.<br />
5. Simpan dan Selesai.<br />
<br />
<div style="text-align: center;">
===</div>
<br />
<br /></div>
</div>

Widget Random Post Untuk Blogger

Pengertian Widget random post untuk blogger adalah widget yang akan menampilkan daftar postingan secara acak yang akan berubah seti...

15:49

Widget Timeline Twitter

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
Cara memasang Widget Timeline Twitter di blog sangatlah mudah, karena Twitter sudah menyediakan fasilitas Widget. Jadi, kita tidak perlu menulis scriptnya sendiri. Kita hanya perlu mengisi Form dan mengikuti beberapa langkah sederhana dan Twitter akan secara otomatis mengenerate script widgetnya sehingga kita cukup perlu mencopy scriptnya di HTML/Javacript blog kita. Lihat juga: <a alt="Cara membuat widget burung twitter terbang berwarna-warni di blog" href="http://bertubies.blogspot.com/2015/03/widget-burung-twitter-terbang.html" target="_blank" title="Cara Memasang Widget Burung Twitter Terbang di Blog">Widget Burung Twitter Terbang di Blog</a>. Jangan lupa juga klik tombol follow di bawah ini :D<br />
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><b>Preview
</b></span></div>
<div style="text-align: center;">
<a class="twitter-timeline" data-widget-id="417930142791368704" href="https://twitter.com/YuliaaargH">Tweets by @YuliaaargH</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
<br />
<div style="text-align: justify;">
Berikut Langkah - langkahnya.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<span style="font-size: large;">Langkah Pertama, membuat Script Widget Timeline Twitter.</span></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
1. Login ke Akun Twitter Anda.</div>
<div style="text-align: justify;">
2. Klik "Setting".</div>
<div style="text-align: justify;">
3. Pilih "Widgets" (biasanya ada di tab paling bawah)</div>
<div style="text-align: justify;">
4. Selanjutnya klik tombol "Create New".</div>
<div style="text-align: justify;">
5. Pilih Source Widget Timelinenya, isi Formnya dan atur sesuai dengan keinginan Anda.</div>
<div style="text-align: justify;">
Penjelasan :</div>
<ul style="text-align: left;">
<li style="text-align: justify;">Pilih Apa yang akan Anda tampilkan di widgetnya nanti, apakah itu Timeline, Favorite, List atau Search.</li>
<li style="text-align: justify;">Pada form configuration Anda dapat mengatur Tinggi (Height), Tema (Theme), Warna Link (Link Color), dll.</li>
<li style="text-align: justify;">Kenapa cuma ada setting Height? karena Width (Lebar) widget Timeline Twitter ini akan secara otomatis menyesuaikan.</li>
</ul>
<div style="text-align: justify;">
6. Setelah Anda selesai mengatur konfigurasi widgetnya, Klik tombol "Create Widget" untuk membuat Script widgetnya. </div>
<div style="text-align: justify;">
7. Lalu Copy Scriptnya yang akan muncul di bawah "Preview".<br />
<br /></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<span style="font-size: large;">Langkah Kedua, Memasang widget Timeline Twitter di Blog.</span></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Login ke akun Blogger</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
1. Pilih Menu Tata Letak (Layout)</div>
<div style="text-align: justify;">
2. Selanjutnya Klik Tambah Gadget (Add a Gadget) di tempat dimana Anda ingin memasang widget Timeline Twitter.</div>
<div style="text-align: justify;">
3. Pilih Widget HTML/JavaScript.</div>
<div style="text-align: justify;">
4. Lalu Pastekan kode Script dari Twitter yang sudah dibuat tadi.</div>
<div style="text-align: justify;">
5. Klik tombol Simpan.</div>
<div style="text-align: justify;">
<br />
<br />
<div style="text-align: center;">
===</div>
<br />
<br /></div>
</div>

Widget Timeline Twitter

Cara memasang Widget Timeline Twitter di blog sangatlah mudah, karena Twitter sudah menyediakan fasilitas Widget. Jadi, kita tidak perlu m...

15:12

Widget Burung Twitter Terbang

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
Cara memasang Widget Burung Twitter Terbang atau Flying Twitter Bird di blogger, mungkin tutorial ini sudah tidak asing lagi karena sudah banyak yang mengulas tentang pemasangan widget ini. Namun, tidak ada salahnya jika saya mencoba mengulas kembali cara membuat widget burung twitter ini dengan berbagai style dan warna yang berbeda-beda. Lihat juga: <a alt="Cara membuat widget timeline twitter di blog" href="http://bertubies.blogspot.com/2015/03/widget-timeline-twitter.html" target="_blank" title="Cara Memasang Widget Timeline Twitter di Blog">Cara Memasang Widget Timeline Twitter di Blog</a>. Dan jangan lupa follownya ya :D</div>
<br />
Pertama-tama Anda harus memiliki akun Twitter. Jika sudah punya, silakan ikuti tutorial di bawah ini.<br />
<br />
1. Login ke akun blog Anda.<br />
2. Klik Layout > Add A Gadget > HTML/ JavaScript<br />
3. Copy/ Paste kode berikut.<br />
<pre>
<script type="text/javascript" src="https://googledrive.com/host/0B7X69YyzZu-IZjFKQ19VVi10RlE/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="<span style="color: blue;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAABpOi_Y5lmfLxoIa3Hwc0_HgdiPceznWfzXXbptHBfhbuwEjmY2cUtu5FCPvNffvSDcMA9Yr2XImTMD0V3SWk_rEFBwl0XOtVTb8tdwu6W0Zm12ANmsiy8RtLiDxeJI62k4YbTd97lI/s1600/burung+twitter+terbang.png</span>";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/<span style="color: magenta;">YuliaaargH</span>";
var tweetThisText = "Twitter - UserID <span style="color: magenta;">http://bertubies.blogspot.com/</span>";
tripleflapInit();
</script></pre>
<br />
<div style="text-align: justify;">
4. Ganti tulisan berwarna<span style="color: magenta;"> pink </span>dengan <u>Username Twitter</u> dan <u>Link Blog</u> Anda.</div>
<div style="text-align: justify;">
5. Anda dapat mengganti warna burung twitter ini. Silakan ganti kode berwarna<span style="color: blue;"> biru</span> dengan kode di bawah ini sesuai dengan warna pilihan Anda.</div>
<br />
Warna <span style="color: red;"><b>Merah</b></span><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipDNSSy9GFXAezg-30cvsTxA-xOOwBefbf1O14sE1YaInOODDOzzZQDPxXKeBNGFrwwu6NGHTWIKMD0qCElrxjLEvJlQ9dje3qRgRk8tCa3L2p9i9cU3HS18TM0A3lRN4QKhKZRhHpfQ0/s1600/red+bird.png</pre>
<br />
Warna <b style="background-color: black;"><span style="color: white;">Putih</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMXSDrCKXFpFACZMd8F5eLCpGnaWoKIYX1LgpdVYUgJBCnlKuikHe7x9ZHFOWLu25zp6NKuleUo217_3Vm0xOJGlV3wp84njO3x84v5CuV4jKqr-3rak_fxE3wrA81tOQ_6AzV3anU1ec/s1600/white+bird.png</pre>
<br />
Warna <b><span style="color: #674ea7;">Ungu</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzojuHRqzBguFZYqska1kHM6waOtHuI4S4uAclEwjTNNjamD3XC9Au8QB04kfksiioA5GSDMIzZlyg9NoVKfdqLKu9WE6szO2Yzagzc9VxSBinFc5_UUi0jDc5YB9t6Txt1DFvf7OCvM0/s1600/purple+bird.png</pre>
<br />
Warna <b><span style="color: lime;">Hijau</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWb0fF84EiHvXATIPtFtHsm8Jkt5_x6ZNPMC6U5mJRz1divD1ID_2togJ4yBJ3gqCPRIyhZBthyphenhyphen7hmrPuIwwPGmuArwEN2d9jut8mHqwPemF0bCFmKy2EIMkaix2nw98z08lBEG5JuDUk/s1600/Green+bird.png</pre>
<br />
Warna <b><span style="color: #783f04;">Coklat</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhtQgDdDk4dHoteVHMcFlrp96kXIQUP_-OY3Qy6IEC3Gazjph6hyphenhyphenfVbLGCm78gMZkm0SsZGraNJtLqFQCYFV89oGX-EiZOfidqWSUfvxJaRxtqKCG1yOIKNBZRKG7n4w6olci1tkRGQTg/s1600/brown+bird.png</pre>
<br />
Warna <b><span style="color: blue;">Biru</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAFVNpRFE3SV0s3EFmPj0bevgXE7IlDFW-wNmK-Bd-icgoDAhmSvfzTy1JnTFj-ipmoADJXTVrNmd64DLmHKeBXDgDMp-puzJGm22OhE0vqc1CnAm1OvjXZ-1JJt8CYCVzU7Gpyc7S2fs/s1600/Blue+bird.png</pre>
<br />
Warna<b> Hitam</b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOXcYypx8GnFV2Hvq6HmTmA7D8fGimXBI4CiDiWaHgwKTuBkJvP71CkU7dz1_UI3OtXdKILNiOn7kpj3un_Rq9rikSr39mZbvKA67hEub6UMAdHjlY7Sy0gnyY8xs6cJ6PsDvJiBOXIBw/s1600/black+bird.png</pre>
<br />
Warna <b><span style="color: #f1c232;">Kuning</span></b><br />
<pre>https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwxukY1ATiG5jAvytxY_J6OcHcPR712DCRfhGSMKOXqby7y0J4kaXCMLqVV6L_9b7ltoeHgsAY2xgQ4xesbAd6BTFMWcHcArkrUphY7VYvwA6jREosWcibNaI_bBesAEKiW7dBH6fgxcM/s1600/yellow+bird.png</pre>
<br />
<br />
6. Save dan lihat hasilnya.<br />
<br />
<br />
<div style="text-align: center;">
===</div>
<br />
<br /></div>

Widget Burung Twitter Terbang

Cara memasang Widget Burung Twitter Terbang atau Flying Twitter Bird di blogger, mungkin tutorial ini sudah tidak asing lagi karena sudah ...

14:28

Berbagi Tutorial Bloggies

Memasang Domain CO.VU Gratis Selamanya

Cara Memasang Scroll Untuk Blog Archive

Membuat Daftar Isi atau Sitemap Blog Responsive

Widget Random Post Untuk Blogger

Widget Timeline Twitter

Widget Burung Twitter Terbang

Trik

Tutorial

SEO

Widgets

Popular Posts

Blog Archive