BLOGBEGO CREATION

BlogBego Creation Mohon Maaf lagi

noreply@blogger.com (Anonymous) — Thu, 6 Feb 2014 23:15:00 +0700

Setelah sebelumnya saya Putu BlogBego sebagai Admin BlogBego Creation mohon maaf karena kena serangan Virus, sekarang kembali :o; untuk kedua kalinya mohon maaf kembali karena masalah datang lagi walaupun dari luar tapi efeknya sangat fatal dan mengganggu BlogBego Creation :q; yang sampai sebulan tak bisa update, seandainya ada kawan sebagai pengunjung setia BlogBego Creation bertanya apa masalahnya, baiklah saya sampaikan :

Pertama Kabel Listrik Tegangan Tinggi didepan rumah kena petir, dari tiga kabel yang sebesar ibu jari tersebut putus dua, sampai saya takut keluar kehalaman rumah karena kabelnya jatuh di halaman rumah, datang petugas untuk menyambung kembali yang akhirnya normal kembali.
Setelah listrik menyala kembali tidak tahunya monitor ikut kena, semuanya sudah bisa saya atasi, tapi masalahnya bukannya selesai sampai disini, karena internet error alias mati
Box Link Lan dan Power suplynya mati, masih untuk masih garansi, cuma masalahnya menunggu penggantinya karena stok di toko penjual lagi kosong
Setelah pengganti didapat bukannya masalah sudah selesai, tidak juga, karena Internet Access di Komputer hilang, sampai 3 kali format dan install kembali komputer tetap tak ada tanda LAN
Setelah Terminal LAN tambahan saya pasang, baru bisa access internet walau belum stabil benar alias lagi nyambung lagi putus speedynya Telkom, yang berarti masalah belum selesai
Setelah Speedy sedikit stabil cuma noise pada telpon sangat keras, datang petugas telkom untuk memperbaiki yang hasilnya telpon membaik sebaliknya speedy untuk internet yang mati, lagi menunggu proses perbaikan
Datang petugas telkom khususnya masalah speedy yang akhirnya bisa normal kedua-duanya
Sehari setelahnya masalah datang lagi, pada speedy wifinya menghilang, karena Box Link Terminal LAN yang satunya mati

Itulah sekelumit cerita BlogBego Creation yang sampai saat posting ini saya buat, access speedy internet belum stabil seratus prosen karena kadang nyambung kadang putus, yang ini merupakan kebiasaan telkom apalagi pakai flexi

Sebagai penutup sekali lagi saya mohon maaf atas ketidaknyamanan yang kawan dapatkan disini, mudah-mudahan bisa memaklumi apa adanya, terima kasih

Menu Navbar Auto Hidden disisi Kanan

noreply@blogger.com (Anonymous) — Thu, 2 Jan 2014 23:16:00 +0700

Sebelumnya saya membahas tentang Cara Membuat Navigasi Menu Share Auto Hidden, :q; sekarang kembali saya akan membahas Menu Navigasi yang pada umumnya Navbar berada diatas atau dibawah Header Blog, tapi yang ini letaknya di sisi kanan Blog dengan variasi Auto Hidden :y; [akan keluar kalau mouse kawan dekatkan, dan akan kembali sembunyi bila mouse kawan pindahkan] yang saya beri Nama Menu Navbar Auto Hidden disisi kanan :z;

Cara membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Tata Letak - Tambah Gadget
Pilih tanda [+] pada HTML / JavaScript
Copas kode berikut kedalamnya

<style>
ul#navigation1 {position: fixed;margin: 0px;padding: 0px;top: 150px;right: 0px;list-style: none;z-index:9999;}
ul#navigation1 li {width: 40px;border:0px;display: block;padding:1px;}
ul#navigation1 li a {display: block;width: 150px;height: 30px;padding: 5px 10px 0 20px;margin-top: 10px;color: #F00;text-align: center;font-family:"Tahoma", Verdana;font-size:16px;font-weight:bold;background-color:transparent;background-repeat:no-repeat;background-position:left center;border:1px solid #ccc;-moz-border-radius:100px;-html-border-radius: 100px;-webkit-border-radius: 100px;opacity: 0.8;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);}

ul#navigation1 .Home a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM9iFLL2uJLgz79Nejb_x_Ap1NSKgCPhdRD2AY36Vj-lq4fx2OdRDx7Qep84EaQu-hqhjtAZ_NXgAyzaIpIzvq9iYIrqFRf8EjksIKSZMaJDihppkWLMBNqQAXH93r5KJTLsDmdgwkaXUI/s1600/Home.png);}
ul#navigation1 .Daftar-isi a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtufgDliw069edZ41dSrJ2bsvdRHYDZ0RzDpuV5jvPefLwxiS_fZWw-NhrXhFxe5ORw7IAYaxZ9tVBttEqPgUVDxAWNsLUtCAOmZlMMxZ-zzqCf5_hfDaTC77OWJRUvPT0pv5QHWSMhNtf/s1600/Daftar+Isi.png);}
ul#navigation1 .Hubungi-saya a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW-YbFxqhrCwjRwhHYupis12Hv16SRwDVfn7sKcOXtpZqAQfXdpdKLexuwtyLiEyy2gcDeysEvqxzACvJZX135D4CRMU8hS-KpPEA7w5i7DeUDkhLrON07Ud6DB8gFhxRZ70xunLQTZTj3/s1600/Hubungi+saya.png);}
ul#navigation1 .Template a {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixGfglDxxLpEucse3kLVk7po32S7e5t-Jhy0u7MkSBfiFGZkqvYj09J5Uk3-czzrcCC4iBQ7MdsfdaIKf8EEiz5w8UNVRI0f_B1Olz_YBZXzXH7mYjCoGvi_3bOQxxKz-1o_CZ32LGWX4B/s1600/Template.png);}
</style>
<script type="text/javascript" src="https://sites.google.com/site/jquery01/jquery-1.7.2.js"></script>
<script type="text/javascript">
$(function() {
$('#navigation1 a').stop().animate({'marginLeft':'5px'},1000);
$('#navigation1 > li').hover(
function () {
$('a',$(this)).stop().animate({'marginLeft':'-112px'},200);
},
function () {
$('a',$(this)).stop().animate({'marginLeft':'5px'},200);
}
);
});
</script>
<ul id="navigation1">
<li class="Home"><a href="http://blogbego-creation.blogspot.com/" target="_blank" title="Kembali ke Halaman Depan">BERANDA</a></li>
<li class="Daftar-isi"><a href="http://blogbego-creation.blogspot.com/2012/01/site-map-blogbego-creation.html" target="_blank" title="Daftar Isi BlogBego Creation">DAFTAR ISI</a></li>
<li class="Hubungi-saya"><a href="http://blogbego-creation.blogspot.com/2012/01/contact-us.html#.UsQxJdJdVQo" target="_blank" title="Cara menghubungi saya">CONTACT US</a></li>
<li class="Template"><a href="http://blogbego-creation.blogspot.com/search?q=template+blogger" target="_blank" title="Template Gratis untuk kawan">TEMPLATE</a></li>
</ul>

Teks yang saya beri warna biru [top:150px] posisi Navbar dari atas
Silahkan kawan ganti teks yang berwarna merah dengan Link kawan
Teks yang saya beri warna violet adalah Jquery, seandainya pada Template kawan sudah ada bisa dihilangkan [ biasanya berada dibawah ]]></b:skin> ]
Silahkan ganti Nama Navbar yang saya beri huruf tebal atau kawan bisa menambahkan dengan Menu yang lain sesuai kebutuhan
Simpan Blog kawan

Cara Membuat Navigasi Menu Share Auto Hidden

noreply@blogger.com (Anonymous) — Sun, 29 Dec 2013 10:16:00 +0700

Semenjak Blog kena virus saya jadi malas menulis artikel alias menambah postingan :b; karena :q; semuanya menjadi serba membengkak, sebagai Admin BlogBego Creation saya mohon maaf pada kawan pengunjung yang setia :w; biar tidak kosong sama sekali terpaksa saya copaskan postingan di Blog saya yang lain, yang akan saya bahas sekarang Cara membuat Navigasi Menu Share di sisi kanan yang bisa Auto Hidden

untuk Demonya kawan bisa lihat disini

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Tata Letak - Tambah Gadget
Pilih tanda [+] pada HTML / JavaScript
Copas Kode berikut kedalamnya

<style>
ul#navigation1 {
position: fixed;
margin: 0px;
padding: 0px;
top: 100px;
right: 0px;
list-style: none;
z-index:9999;
}
ul#navigation1 li {
width:100px;
border:0px;
display: block;
padding-top:1px;
padding-bottom:1px;
}
ul#navigation1 li a {
display: block;
margin-right: -2px;
width: 100px;
height: 70px;
background-color:transparent;
background-repeat:no-repeat;
background-position:center center;
border:1px solid #FFF;
-moz-border-radius:10px 0px 0px 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-top-left-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
-khtml-border-top-left-radius: 10px;
/*-moz-box-shadow: 0px 4px 3px #000;
-webkit-box-shadow: 0px 4px 3px #000;
*/
opacity: 0.8;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);
}
ul#navigation1 .rss a{
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG0SS6GzqUdWisjIG_AG8kKRB5P-CNUfhZh0bbFnJk05OML32VGB__iBVBTzkdeHQjsRzflzoCuCsEoHHNTTU5ODHIwFBHdGjv4tkWOs82NPwasgd7CqIxBQzlzcznPw9dyQ83uISpfps/s400/rss.png);
}
ul#navigation1 .facebook a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYihKcnkbPLQIIIxcADQtaRlvOjrA_T0CN1A76tpP8GlvynesK8R0VUVZvKd42bwchKvOf2AjofwtM7IrF_SdOX92HzTHluIzLQgW5WRYt4QjOM_5fjhv83bB6j8nqYgM23w-iXTRNpdU/s400/facebook.png);
}
ul#navigation1 .twitter a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic-4_RI2On0cwJ9Zzhvt60VwjkwgI-NnGojaBQvdjUvHMcg_3950htsVRQQCbueGBYozcy65qxJ0FCR7LqKV2F0e4MxLOwx3UTtloQwMZooUMrI6vj4g1_hRNN9p9IlMaBybf1d1vQzBs/s400/twitter.png);
}
ul#navigation1 .profile a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUw673lh0qgXLkshK_pcyvPTdbcspVdYajqhdnHY-z-0L8w8oZdGXpzp_7UTHDIRlTu3m6aT1_dc_j0AOUbw7lz3AJNkV3bfyI-RvjVb6wacb3tsqxgVaRDK0qDwiFj3xtmaJjjL3pTMs/s400/photo.png);
}
ul#navigation1 .e-mail a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9h4iFcgELG5Im4gAEilVonNiyM_-_x09nUXt22IakHZbrTbnosShd-Z-CzYTR5Cw3qA7UpI2epf2gB_F3loIqaQu2n6B0ziuzJQISVhTe2OWpGhaoqaInbDJXo27cJu1sW-pWm9eUzoM/s400/mail_edit.png);
}
</style>
<script type="text/javascript" src="https://sites.google.com/site/jquery01/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function() {
$('#navigation1 a').stop().animate({'marginLeft':'85px'},1000);
$('#navigation1 > li').hover(
function () {
$('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
},
function () {
$('a',$(this)).stop().animate({'marginLeft':'85px'},200);
}
);
});
</script>

<ul id="navigation1">
<li class="rss"><a href="http://info-blogbego.blogspot.com/atom.xml" target="_blank"></a></li>
<li class="facebook"><a href="http://www.facebook.com/KASTAONE" target="_blank"></a></li>
<li class="twitter"><a href="http://twitter.com/KASTAONE" target="_blank"></a></li>
<li class="profile"><a href="http://www.blogger.com/profile/14829445231709686413" target="_blank"></a></li>
<li class="e-mail"><a href="https://mail.google.com/mail/u/0/?hl=id&shva=1#inbox" target="_blank"></a>
</li></ul>

Silahkan ganti teks yang saya beri warna dengan Link kawan
Teks yang saya beri warna biru [transparent] bisa kawan ganti dengan kode warna
Simpan Blog kawan

Seandainya Nanigasi Menu ini tidak mau Auto Hidden tambahkan jquery berikut dibawah ]]></b:skin> atau diatas </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

Mohon maaf BlogBego Creation kena Virus

noreply@blogger.com (Anonymous) — Thu, 19 Dec 2013 23:58:00 +0700

Beberapa hari terakhir ini bagi kawan yang setia mengunjungi BlogBego Creation pasti pernah mendapatkan Pemberitahuan dari Google bahwa Blog-blog saya kena virus :q; ya begitulah adanya Karena kesibukan pribadi sampai-sampai saya tak sempat mengurusnya, saya Putu BlogBego sebagai Pemilik dan Admin dari BlogBego Creation :a; saya mohon maaf yang sebesar-besarnya atas ketidak-nyamanan ini. Saya rasa semua Blogger tidak menginginkan hal ini bisa terjadi, karena sangat berpengaruh dengan Blog kita misalnya posisi, Page-Rank menjadi menurun, traffik menjadi sangat melorot [baca membesar] dan lain sebagainya

Perlu kawan ketahui, jangankan saya yang baru belajar Ngeblog, master Abu Farhan juga kena serangan ini, perhatikan gambar berikut :

Tapi khusus untuk BlogBego Creation, sekarang ini kawan tak perlu khawatir, karena semuanya sudah normal kembali seperti sebelumnya :z; dengan demikian kawan yang berkunjung bisa mendapatkan kenyamanan tanpa ada rasa was-was :q; di Blog saya ini

Terima kasih atas kunjungan kawan kembali

Cara Merubah Model ScrollBar

noreply@blogger.com (Anonymous) — Mon, 9 Dec 2013 13:45:00 +0700

Sekarang saya akan berbagi dengan kawan Cara merubah model ScrollBar :d; kawan tahu kan apa itu scrollbar yang biasanya berada dipinggir kanan Blog atau Komputer yang bisa digerakkan naik turun, :q; dengan kursor / mouse bertipe default milik webkit

Seperti yang di posting oleh master kita Taufik Nurrohman secara sederhana bisa dimanipulasi menjadi pointer

screenshot

Cara membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Cari tag ]]></b:skin>
Copas Kode berikut diatasnya

::-webkit-scrollbar {width:14px;background: -moz-linear-gradient(top,#999,#FFF);background:-webkit-gradient(linear, left top, right bottom, from(#999),to(#FFF));}

::-webkit-scrollbar-thumb {width:10px;background: -moz-linear-gradient(top,#fff,#333);background: -webkit-gradient(linear, left top, right bottom, from(#fff),to(#333));border:1px solid #000;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}

Kalau kawan menginginkan tampil lain saya persilahkan meng-Edit ulang misalnya warna, width / lebar dan lain sebagainya
Simpan template kawan

Background Blog dengan Warna pilihan

noreply@blogger.com (Anonymous) — Tue, 3 Dec 2013 07:15:00 +0700

Kawan masih ingat dengan postingan saya yang berjudul Tool untuk mengetahui Postingan Terpopuler :q; yang pada prinsip dasarnya merubah background Blog dengan warna berbeda, begitu juga dengan postingan saya yang sekarang ini menekankan pada background yang bekerja secara manual :r; sesuai selera pengunjung dengan meng-Klik salah satu warna yang dikehendaki :z;

untuk Demo kawan bisa lihat

Cara membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Tata Letak - Tambah Gadget
Pilih tanda [+] pada HTML / JavaScript
Copas kode berikut kedalamnya

<script type="text/javascript">
function bgChange(bg)
{
document.body.style.background=bg;
}
</script>
<table border="1" cellspacing="5" width="100%" height="30">
<tr> <td
onclick="bgChange('#ffffff')" bgcolor="white">
<td
onclick="bgChange('#000000')" bgcolor="#000000">
<td
onclick="bgChange('#0000FF')" bgcolor="#0000FF">
<td
onclick="bgChange('#800000')" bgcolor="#800000">
<td
onclick="bgChange('#008000')" bgcolor="#008000">
<td
onclick="bgChange('#808080')" bgcolor="#808080">
<td
onclick="bgChange('#FFFF00')" bgcolor="#FFFF00">
<td
onclick="bgChange('#FF00FF')" bgcolor="#FF00FF">
<td
onclick="bgChange('#A6CAF0')" bgcolor="#A6CAF0">
</td
></td
></td
></td
></td
></td
></td
></td
></td
></tr>
</table>

Kawan bisa menambah / mengurangi elemen warna yang saya contohkan, :d; dengan cara menambahkan atau mengurangi seperti kode berikut

</td

Teks yang saya beri warna merah adalah kode warna silahkan disesuaikan
Simpan Blog kawan

Menu Navigasi dengan Image Hover

noreply@blogger.com (Anonymous) — Wed, 27 Nov 2013 06:00:00 +0700

Sudah banyak postingan saya tentang Navigasi maupun Navbar ada yang menggulung atau menggelinding alias berputar begitu juga dengan yang saya beri nama Navbar Auto Hidden disisi kanan :q; yang merupakan kreasi untuk membuat Blog Tampil Beda :z;

Sekarang saya akan berbagi lagi dengan kawan Cara Membuat Menu Navigasi dengan Image, yang kalau di-Klik akan berubah warnanya seperti hover

Tampilan Menu Navigasi

Seperti Judul Artikel ini Menu Navigasi sedangkan pada Demo hanya Navigasi Sosial itu hanyalah contoh saja, kalau kawan ingin untuk Menu, caranya sangat gampang, cukup siapkan image seperti berikut. :y;

Coba kawan perhatikan image tersebut, yang atas sedikit agak gelap, sedangkan yang bawahnya agak terang :r;

Oke kawan langsung ke Cara Membuatnya :

Siapkan Image sesuai kebutuhan
Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Copas kode berikut diatas ]]></b:skin>

ul#bbc{width: 180px; margin: 0px auto 0px auto;list-style: none;padding-bottom:30px}
* html ul#bbc{width: 185px;list-style: none;padding-left:10px;padding-bottom:0px;margin:0;}
ul#bbc li {display: inline;}
ul#bbc li a {display: block;float: left; height: 30px;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKO2bxauErE5x3CiKuVQ-aqBqoBOxNmUk5yvOflkL8KKmhxRbu2EphThWSUWt4QtvHVT7KNj_YTWGLNt-ARVO06T_VCsgNiTSArN_TNO31YFWjIG6pfc9gqddwXasdhPmvRZUvgE99PD4J/s1600/sprite_thumb.png'); text-indent: -9999px;}
ul#bbc li a.facebook {width:30px;background-position:0 0;}
ul#bbc li a.twitter {width:30px; background-position: -34px 0;}
ul#bbc li a.gplus {width:30px;background-position: -68px 0;}
ul#bbc li a.email {width:30px;background-position: -102px 0;}
ul#bbc li a.rss {width:30px;background-position: -136px 0;}
ul#bbc li a.facebook:hover,ul#bbc li a.facebook:focus {background-position: 0 -30px;}
ul#bbc li a.twitter:hover,ul#bbc li a.twitter:focus{background-position:-34px -30px;}
ul#bbc li a.gplus:hover, ul#bbc li a.gplus:focus {background-position: -68px -30px;}
ul#bbc li a.email:hover, ul#bbc li a.email:focus {background-position: -102px -30px;}
ul#bbc li a.rss:hover, ul#bbc li a.rss:focus {background-position: -136px -30px;}

Teks yang saya beri warna merah [180px dan 185px] untuk lebar image, silahkan disesuaikan kalau kawan ingin menambah atau menguranginya, sedangkan teks yang berwarna merah berikutnya untuk nama dan Link yang ditampilkan, nilainya silahkan dihitung sendiri

Selanjutnya Copas script berikut dan simpan sesuai keinginan kawan masih pada Template atau bisa disimpan pada gadget untuk pemanggilan

<ul id='bbc'><li><a class='facebook' href='http://www.facebook.com/pages/KASTAONE/19292868552' title='facebook'>Facebook</a></li><li><a class='twitter' href='https://twitter.com/BLOGBEGO' title='Twitter'>Twitter</a></li><li><a class='gplus' href='https://plus.google.com/101141011579420362463' title='GPlus'>GPlus</a></li><li><a class='email' href='http://feedburner.google.com/fb/a/mailverify?uri=blogbegocreation' title='Email'>Email</a></li><li><a class='rss' href='http://feeds.feedburner.com/blogbegocreation' title='RSS'>RSS</a></li></ul>

Silahkan kawan ganti Link-link saya tersebut dengan Link kawan
Simpan Template / Blog kawan

Pasang Avatar disamping Nama Author

noreply@blogger.com (Anonymous) — Sat, 23 Nov 2013 06:00:00 +0700

Sebelumnya saya berbagi Cara Pasang Image disamping Judul Artikel dan Cara Pasang Avatar Author disamping Judul Artikel :q; yang sekarang masih tetap pada Avatar cuma penempatannya disamping Nama Author atau Admin :q;

Nama Admin [pemilik Blog] biasanya diikuti dengan tanggal dan waktu posting yang penempatannya dibawah Judul atau dibawah Isi Artikel :r;

Kalau kawan ingin memasangnya di Blog Kodenya hampir sama dengan Cara Pasang Avatar Author disamping Judul Artikel, yang beda cuma ukurannya :y; kalau ditempatkan dibawah Judul ukurannya lebih kecil disebabkan memakai huruf lebih kecil sedangkan kalau dibawah Isi Artikel ukurannya sedikit lebih besar dibandingkan yang lainnya :x;

Cara membuatnya :

Seperti biasa masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Cari tag ]]></b:skin>
Kalau sudah ketemu hapus atau ganti dengan script berikut

.avatar-author{float:left;margin:0 5px 5px 0;border:0px solid #999;border-radius:50%;padding:0;width:20px;height:20px}
]]></b:skin>
<script>
//<![CDATA[
function av(a){var b=a.entry.author[0];c=b.name.$t;d=b.gd$image.src.replace(/\/s[0-9]+(-*c*)\//,'/s30$1/');document.write('<img alt="'+c+'" class="avatar-author" src="'+d+'" title="'+c+'"/>')}
//]]>
</script>

Teks yang saya beri warna biru adalah posisi penempatannya - disesuaikan

Teks yang saya beri warna merah adalah besarnya Avatar - disesuaikan

Selanjutnya cari <data:post.body/> yang kedua, terus scroll keatas untuk mencari Judul atau kebawah untuk akhir Isi Artikel, yang kodenya kurang lebih seperti berikut :

<span class='vcard author'><span class='fn'>
<span itemprop='reviewer'><data:post.author/>
</span></span></span>,
<data:post.dateHeader/>
<script>document.write(date);</script>
- <span class='updated'>
<data:post.timestamp/></span>
-------------------dstnya
<data:post.body/>

Tambahkan kode berikut diatasnya <script expr:src='"/feeds/posts/default/" + data:post.id + "?alt=json-in-script&amp;callback=av"'/> sehingga menjadi seperti berikut

<script expr:src='"/feeds/posts/default/" + data:post.id + "?alt=json-in-script&amp;callback=av"'/>
<span class='vcard author'><span class='fn'>
<span itemprop='reviewer'><data:post.author/>
</span></span></span>,
<data:post.dateHeader/>
<script>document.write(date);</script>
<span class='updated'>
<data:post.timestamp/></span>
--------------- dstnya
<data:post.body/>

Simpan Template kawan

Pasang Avatar Author disamping Judul Artikel

noreply@blogger.com (Anonymous) — Tue, 19 Nov 2013 06:00:00 +0700

Sebelumnya saya sudah berbagi dengan kawan Cara Pasang Image disamping Judul Artikel :q; sekarang saya akan berbagi lagi hal yang sama, cuma yang sekarang ini dengan Avatar Author atau Foto Profil kawan sendiri :r; bagaimana, perhatikan screenshotnya dibawah ini

Kalau kawan ingi tahu caranya, silahkan dilanjutkan membacanya ! :y;

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Copas script berikut diatas ]]></b:skin>

.avatar-author{float:left;margin:0 10px 5px 0;border:0;border-radius:50%;padding:0;width:30px;height:30px}

Selanjutnya Copas script berikut dibawah ]]></b:skin> atau diatas </head>

//<![CDATA[

function av(a){var b=a.entry.author[0];c=b.name.$t;d=b.gd$image.src.replace(/\/s[0-9]+(-*c*)\//,'/s30$1/');document.write('<img alt="'+c+'" class="avatar-author" src="'+d+'" title="'+c+'"/>')}

//]]></script>

Simpan sementara Template kawan
Temukan <b:if cond='data:post.title'> yang kodenya kurang lebih seperti berikut

<b:includable id='post' var='post'>

Copas script berikut disini....!

<b:if cond='data:post.title'>

<h2 class='post-titles' itemprop='name'>
<b:if cond='data:post.link'>
.................. seterusnya....

Copas script berikut diatas <b:if cond='data:post.title'>

Simpan Template kawan dan lihat hasilnya

Pasang Image disamping Judul Artikel

noreply@blogger.com (Anonymous) — Fri, 15 Nov 2013 23:04:00 +0700

Selamat malam kawan-kawan yang setia mengunjungi BlogBego Creation ini, :z; mudah-mudahan kawan masih betah berkunjung kemari karena sekarang saya akan mencoba berbagi dengan kawan Cara Pasang Image disamping Judul Artikel :q;

Cara membuatnya :

Silahkan kawan membuat image yang ukuranya kecil dulu, selanjutnya disimpan pada hosting kawan atau ditempat kawan menyimpan file, terus ambil Link-nya :r;

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Cari dan temukan kode sebagai berikut atau yang mirip-mirip seperti itu, dikarenakan struktur Template Blogger berbeda-beda

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

<b:else/> atau seperti ini : <a expr:href='data:post.url' expr:title='data:post.title' rel='bookmark'><data:post.title/></a>
        <b:else/> 
atau seperti ini : 
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
     <b:else/> 








Sisipkan Link image yang kawan buat tadi sebelum <data:post.title/></a> contohnya sebagai berikut : 

<a expr:href='data:post.url'> sisipkan disini Link image <data:post.title/></a>

<b:else/>

atau

<a expr:href='data:post.url' expr:title='data:post.title' rel='bookmark'> sisipkan disini Link image <data:post.title/></a>

<b:else/>

Contoh jadinya :

<b:else/>

Biasanya kode tersebut diatas lebih dari satu, silahkan dicoba - coba penempatannya
    untuk spasi antara image dengan Judul Artikel bisa ditambah atau dihilangkan
Silahkan ganti image saya tersebut dengan image yang kawan buat tadi
Simpan Template

Pesan Contact us langsung masuk Email Blogger

noreply@blogger.com (Anonymous) — Wed, 6 Nov 2013 06:00:00 +0700

Postingan saya tentang Cara Membuat Contact us di Docs Google, ::q; seandainya ada pesan masuk kita hanya bisa melihatnya di Google Drive bagi kawan yang ingin mencoba membuat Contact us, Kontak kami, Hubungi saya atau apalah namanya :r; silahkan kawan baca dulu disini, karena sekarang saya akan melanjutkan postingan tersebut biar pesan masuk nantinya bisa langsung ke Email kita :z;

Setelah Contact us tercipta atau mungkin kawan mengulang membuatnya, karena sekarang saya akan melanjutkan ke tahap kedua yaitu Mengolah Data / Pesan yang masuk

Caranya :

Masuk atau buka halaman Dasbor Google Drive
Perhatikan dibagian atas klik - Pilih Tujuan Tanggapan
Isi tanda cek pada opsi Spreadsheet Baru dan tulisan dibawahnya bisa kawan ganti bisa tidak

Gambar-1

Pilih button Buat dan tunggu sampai Pilih Tujuan Tanggapan berubah menjadi Lihat Tanggapan, silahkan kawan klik untuk melihat Spreadsheet Formulir Kontak Tanggapan kawan

Gambar-2

Berikutnya kawan klik Alat dan pilih Editor Skrip....

Disini kawan akan disuguhkan halaman Proyek tak berjudul, yang bernama Kode.gs; copas javascript berikut ke dalamnya

function sendFormByEmail(e) {
// Tentukan teks subjek/perihal yang nantinya akan muncul pada pesan masuk email setiap kali pesan baru terkirim
var emailSubject = "PESAN BARU!";
// Tentukan alamat email di sini atau beberapa alamat email sekaligus yang dipisahkan dengan tanda koma
var yourEmail = "email@domain.com";
// Masukkan kunci spreadsheet yang terhubung dengan formulir kontak ini
// Bisa ditemukan pada URL ketika Anda melihat spreadsheet tersebut
var docKey = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx";
// Jika Anda menginginkan skrip ini mengirim data secara otomatis ke semua editor sheet, set nilainya menjadi `1`
// Jika Anda hanya ingin mengirimkan data ke `yourEmail`, set nilainya menjadi `0`
var useEditors = 1;
// Apakah Anda telah menambahkan kolom yang ternyata tidak Anda gunakan pada formulir?
// Jika ya, set nilai ini ke nomor urut kolom terakhir yang Anda tambahkan pada spreadsheet.
// Sebagai contoh: Kolom `C` ada pada nomor urut ke 3
var extraColumns = 0;
if (useEditors) {
var editors = DocsList.getFileById(docKey).getEditors();
var notify = (editors) ? editors.join(',') : yourEmail;
} else {
var notify = yourEmail;
}
// Variabel `e` memegang semua data di dalam array.
// Loop semua data di dalam array dan sisipkan nilainya ke pesan.
var s = SpreadsheetApp.getActive().getSheetByName("Data1");
if (extraColumns) {
var headers = s.getRange(1, 1, 1, extraColumns).getValues()[0];
} else {
var headers = s.getRange(1, 1, 1, s.getLastColumn()).getValues()[0];
var message = "";
}
for (var i in headers) {
message += headers[i] + ' = ' + e.values[i].toString() + '\n';
}
MailApp.sendEmail(notify, emailSubject, message);
}
// Script oleh : DTE

silahkan ganti teks yang saya beri warna merah dengan milik kawan, khusus untuk var docKey bisa didapat pada jendela penelusuran [perhatikan Gambar-2 diatas]
contohnya :
https://docs.google.com/spreadsheet/ccc?key=0AmHOiaoeYjG2dDRONFhPN0ZoeW92N2FWb0tGNXEybVE#gid=0

Tetap pada halaman Spreadsheet dan lihat kebawah teks Respons Formulir spasinya dihilangkan

Halaman Spreadsheet bagian bawah

Selanjutnya klik Sumber Daya - Pemicu proyek saat ini
Klik pada tautan No triggers set up. Click here to add one now

Klik Save setelah kawan mengadakan perubahan seperlunya, Perhatikan Image berikut

Terakhir akan muncul pesan authorisasi pilih Terima

Silahkan kawan mencoba Contact us yang baru dibuat, jika pesan sudah masuk di Email berarti kawan sudah berhasil,

Perpendek Komentar dengan Slide Panel

noreply@blogger.com (Anonymous) — Sat, 2 Nov 2013 06:00:00 +0700

Postingan sekarang ini saya dapatkan pada master Taufik Nurrohman pada Blognya DTE yaitu Cara Memperpendek Komentar dengan Slide Panel :q; maksudnya Formulir dan Komentar yang ada di Blog akan menjadi Slide Buka Tutup dan akan menutup dengan sendirinya setelah beberapa detik :r;

Oke langsung saja ke Cara membuatnya

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Sebaiknya simpan Template kawan dulu
Temukan Tag ]]></b:skin>
Kalau sudah ketemu Hapus atau dengan script berikut :

a.openpanel {display:block;clear:both;width:auto;padding:0px 0px;text-align:center;
font-weight:bold;line-height:32px;background-color:#000;color:white;text-decoration:none;margin:0px 0px;-webkit-box-shadow:0px 1px 1px rgba(0,0,0,0.2);
-moz-box-shadow:0px 1px 1px rgba(0,0,0,0.2);box-shadow:0px 1px 1px rgba(0,0,0,0.2);
position:relative;}
a.openpanel em {width:0px;height:0px;display:block;position:absolute;top:15px;right: 15px;border:6px solid transparent;border-top-color:white;}
a.openpanel.active {background-color:#900;}
a.openpanel.active em {top:6px;border-color:transparent transparent white transparent;}
div.paneline {height:0px;border-bottom:4px solid #800;}
div.hompiPanel {padding:10px 20px 20px;-webkit-box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);-moz-box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);margin:0px 0px !important;}
]]></b:skin><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/><script type='text/javascript'>
//<![CDATA[
var panelSelector = '#comments',
openPanelText = "Poskan Komentar",
closePanelText = "Tutup Komentar",
slideDownPanelSpeed = 600,
slideUpPanelSpeed = 400;
//]]>
</script>
<script src='http://dte-project.googlecode.com/svn/trunk/blogger-slide-panel-comments.js'></script>

Seandainya pada Template kawan sudah berisi jquery sejenis, yang saya beri warna merah bisa kawan hilangkan atau hapus
Simpan Template kawan

Tool untuk Mengetahui Postingan ter-Populer

noreply@blogger.com (Anonymous) — Tue, 29 Oct 2013 20:02:00 +0700

Kali ini saya akan berbagi dengan kawan pengunjung setia BlogBego Creation Tool untuk mengetahui Postingan yang paling sering dilihat :z; dengan kata lain Populer, maksudnya postingan Blog kita yang dilihat akan berbeda warnanya dengan latar belakangnya aslinya :q; maaf bahasanya sedikit Ribet

Oke langsung saja ke cara membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Sebaiknya simpan Template kawan dulu

Ada 2 [dua] Caranya, silahkan pilih salah satu

Cara Pertama

Copas script berikut tepat diatas </body>

<b:if cond='data:blog.pageType == "item"'>
<script type='text/javascript'>
//<![CDATA[
var bgU=location.href;bgPP=document.getElementById('PopularPosts1');bgTN=bgPP.getElementsByTagName('a');if(bgTN){bgH=bgTN.item(0).href;if(bgU.indexOf(bgH)!=-1){document.write('<style type="text/css">body{background:#ff00ff!important}</style>')}}
//]]>
</script>
</b:if>

Cara Kedua

Copas script berikut diatas <b:if cond='data:showThumbnails == "false"'>

<b:if cond='data:post.href == data:blog.url'>
<style type='text/css'>body{background:#ff00ff!important}</style>
</b:if>

Teks yang berwarna violet adalah warna latar belakang, silahkan disesuaikan asal berbeda dengan warna latar belakang Blog kawan :r;
Simpan Template kawan

Slide Carousel Recent Post untuk Blogger

noreply@blogger.com (Anonymous) — Wed, 23 Oct 2013 06:00:00 +0700

Kawan masih ingat postingan saya tentang Slide Carousel untuk Daftar Isi, :y; sekarang masih tetap tentang Slide Carousel cuma tampilannya sangat berbeda dengan yang dulu setelah saya adakan perbaikan-perbaikan maupun pengurangan atau menghilangkan kode-kode yang tidak perlu, :z; hal ini terispirasi dari Artikel Terkait berisi Thumbnail perhatikan screenshotnya dibawah ini :q;

Tampilan Carousel sekarang

Carousel lama

Cara Membuatnya :
Bagian Template

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Copas Script berikut diatas ]]></b:skin>

#bbccarousel{width: 100%;height:175px;position:relative; display:block;background: transparent;margin:0 10px 8px auto;}

#bbccarousel h3{color:#00f;margin:0 2px 2px;font-size:10px;}

#bbccarousel .container{position:absolute;left:0px;width:580px; height:175px; overflow:hidden;padding:0;margin:0 auto 0;}

#bbccarousel .thumb{float:left;margin-right:10px;}

#bbccarousel .thumb:hover{filter:alpha(opacity=70);opacity:.7}

#bbccarousel ul{width:100000px;position:relative;margin-top:10px;}

#bbccarousel ul li{background:#FFF;display:inline;text-align:center; font:bold 12px Arial;width:102px;height:150px;border:1px solid #000;margin:0 2px 20px 4px;padding:6px;}

#bbccarousel ul li a.slider_title{color:#222;display:block;margin:0;padding:0;}

#bbccarousel ul li a.slider_title:hover{color:#F00;}

#bbccarousel a img{display:block;background:none;margin-top:0;}

Teks yang saya beri warna merah silahkan disesuaikan dengan lebar penempatannya
Selanjutnya Copas Script berikut dibawah ]]></b:skin> atau diatas </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/><script src='https://sites.google.com/site/blogbegocreation/javascript/bbccarousel.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1QETtdEwZmF6MVkrwH5cvCvSojSV079laU4um2kYZ2SO2E2J3IlnD6qzMWs1m9pNiXfo69G7Zqx0f9PitRu0t2uG3SAgMYBNmzfZhdOQwJMgMPQYsbiiW28AXU4pN05OW5kxzeXn46Bk/s1600/no+image.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 140;
summaryTitle = 25;
recentposts1 = 10;
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('<ul>');
for (var i = 0; i < recentposts1; 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","Ags","Sep","Okt","Nov","Des"];
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 daystr = day+ ' ' + m + ' ' + y ;
var trtd = '<li class="car"><div class="thumb"><a href="'+posturl+'"><img width="100" height="80" class="alignnone" src="'+img[i]+'"/></a></div><h3>'+daystr+'</h3><a class="slider_title" href="'+posturl+'">'+posttitle+'</a></li>';
document.write(trtd);
j++;
}
document.write('</ul>');
}
//]]>
</script>

Teks yang beri warna merah [jquery], kalau pada Template kawan sudah ada walau sejenisnya, jquery tersebut bisa kawan hilangkan
Teks yang berwarna Biru untuk lebar dan tinggi image
Simpan Template kawan

Bagian Tata Letak

Pada Tata Letak pilih Tambah Gadget
Pilih tanda [+] pada HTML / JavaScript
Copas Kode berikut kedalamnya

<div id='bbccarousel'>
<div class='container'>
<script>
document.write(" <script src=\"/feeds/posts/default?max-results="+recentposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script>
<div class='clear'/></div>
<script type='text/javascript'>
(function($) { $(document).ready(function(){
$("#bbccarousel .container").bbcCarousel({
auto:800,
scroll: 1,
speed: 3000,
visible: 5,
start: 1,
circular: true,
});
})})(jQuery)
</script></div></div>

Visible: 5, adalah jumlah yang ditampilkan - disesuaikan
Simpan Blog kawan

Cara Membuat Artikel Terkait berisi Thumbnail

noreply@blogger.com (Anonymous) — Fri, 18 Oct 2013 17:20:00 +0700

Seharusnya Cara Membuat Artikel Terkait berisi Thumbnail ini sudah lama saya bagikan biar ngumpul dengan Cara Membuat Artikel Terkait lainnya :y; tapi dasar saya sedikit pelupa ya terlupakan jadinya,

Screenshot

Cara Membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Copas script berikut dibawah ]]></b:skin> atau diatas </head>

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {float:center;text-align:left;margin: 0 auto 0;text-transform:none;height:100%;min-height:100%;padding:5px 5px 0 5px;}
#related-posts h2{font-size: 1.6em;font-weight: normal;color: black;font-family: Georgia, “Times New Roman”, Times, serif;margin-bottom: 0.75em;padding-top: 0em;}
#related-posts a{color:black;padding:0 2px;margin:0 5px 0;}
#related-posts a:hover{color:black;padding:0;background-color:#999;}
</style>
<script type='text/javascript'>
var defaultnoimage='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6xesVi58KTfVlSoPZno24MtyEM7or7skmEpJbuusnLYOdsyq-7TkPlmqyc238iPYZ5bu7bEzZY4Otdbs6n6VYFFvzQ32NqrG8RpG9IC9yjGYoB6loxww99-LpGhmjU023iJ8MIv85gi8/s400/noimage.png';
var maxresults=6;
var splittercolor="#ff0000";
var relatedpoststitle="Artikel Terkait";
</script>
<script src='https://sites.google.com/site/blogbegocreation/javascript/related_posts_with_thumbnails_min.js' type='text/javascript'/>
</b:if>

Selanjutnya cari <div class='post-footer-line post-footer-line-1'>
Copas Kode berikut dibawahnya

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

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/summary/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=7"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>

</b:if>

Teks [angka 6 dan 7] yang saya beri warna merah adalah jumlah yang ditampilkan, dengan selisih 1[satu]
Teks yang saya beri warna Biru adalah Judul silahkan disesuaikan
Simpan Tmplate kawan

Jquery Emoticos untuk Blogger

noreply@blogger.com (Anonymous) — Fri, 11 Oct 2013 22:16:00 +0700

Sebelumnya saya sudah pernah berbagi tentang Tambahkan Emoticon pada Blog, yang bisa ditampilkan baik pada Komentar maupun pada Postingan :y; dan untuk Blog yang memakai Komentar Thread hanya akan tampil pada Komentarnya saja :q; seperti Emoticons yang diciptakan oleh master DTE yang sudah saya Edit supaya kawan tidak berkecil hati karena bisa tampil baik di Komentar maupun di Postingan Blog, cuma Logo Iconnya berbeda [maaf saya belum sempat untuk meng-Editnya] agar sama :z;
Perlu kawan ketahui, pada umumnya Emoticons mempergunakan simbol misalnya :) :# atau simbol yang lainnya untuk pemanggilan, tapi saya tetap mempergunakan : [titik-dua], abjad [a s/d z] ; [titik-koma] tanpa spasi kalau tidak lain dari yang lain bukan BlogBego namanya

Khusus untuk Postingan

Khusus untuk Komentar

Caranya sebagai berikut :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Scrool ke bawah sampai </body>
Copas script berikut tepat diatasnya

<style type='text/css'>

.emoWrap {background-color:#585858;border:0px solid #D3BA59;padding:10px 14px;color: black;font:normal bold 12px/normal Tahoma,Arial,Sans-Serif;text-align:center;}

.emo,.emoKey {display:inline-block; /* Penting! */ *display:inline;vertical-align:middle;}

.emoKey {border:1px solid #ccc;background-color:white;font:normal bold 11px/normal Arial,Sans-Serif;padding:1px 2px;margin:0 0 0 2px;color:black;}

</style>

<strong id="dte_emo-bar">Klik untuk melihat kode:

<br/>

<style type='text/css'>

.emoWrap {background-color:#585858;border:0px solid #D3BA59;padding:10px 14px;color: black;font:normal bold 12px/normal Tahoma,Arial,Sans-Serif;text-align:center;}

.emo,.emoKey {display:inline-block; /* Penting! */ *display:inline;vertical-align:middle;}

.emoKey {border:1px solid #ccc;background-color:white;font:normal bold 11px/normal Arial,Sans-Serif;padding:1px 2px;margin:0 0 0 2px;color:black;}

</style>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

<script type='text/javascript'>

//<![CDATA[

var emoRange = "#comments p, div.emoWrap",

putEmoAbove = "#comment-editor",

emoMessage = "Untuk menyisipkan emoticon setidaknya Anda harus menambahkan satu spasi di awal simbol.";

//]]>

</script>

<script src='https://sites.google.com/site/blogbegocreation/javascript/autoemoticons.js' type='text/javascript'/>

<script src='https://sites.google.com/site/blogbegocreation/javascript/Editor_Smyle.js' type='text/javascript'/>

</strong>

Simpan Template kawan
Selanjutnya cari <b:includable id='threaded-comment-form' var='post'> atau yang mirip seperti berikut ini kodenya

<b:includable id='threaded-comment-form' var='post'>
<div class='comment-form' id='comment-form'> <!...Kotak Pesan kalau ada...>
<p><data:blogCommentMessage/></p>
<br/>
<strong id="dte_emo-bar">Klik untuk melihat kode:
</strong> <!...Kode Pesan yang kawan Tambahkan...>
<data:blogTeamBlogMessage/>
<b:if cond='data:mobile'>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe class='blogger-iframe-colorize blogger-comment-from-post' id='comment-editor' name='comment-editor' src='' style='display:none;border:none;background:none;width:100%;height:300px;'/>
<b:else/> <!...Ciri yang kawan Cari...>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe class='blogger-iframe-colorize blogger-comment-from-post' id='comment-editor' name='comment-editor' src='' style='border:none;background:none;width:100%;height:300px;'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
</script>
</div></b:includable>

Teks yang saya beri warna merah adalah Kotak Pesan untuk Template yang sudah ditambahkan
Teks yang saya beri warna biru adalah Pesan untuk melihat Kode Emoticons - ditambahkan
Simpan Template kawan

Mempercantik Border Table dengan CSS

noreply@blogger.com (Anonymous) — Sat, 5 Oct 2013 22:13:00 +0700

Terus terang sekarang lagi Blank Mau posting apa.... !!! :r; sedangkan disatu sisi lainnya jadwal posting wajib untuk mengecilkan Traffic Blog, untuk itu saya mohon maaf untuk kawan yang setia mengunjungi BlogBego Creation :z; karena apa yang akan saya bagikan sekarang ini sudah umum diterapkan oleh para Blogger, tapi tak ada salahnya untuk kawan Blogger Pemula yang belum tahu atau mengetahui, Cara Mempercantik Border Table dengan CSS :y;

Sebelum melangkah lebih jauh alangkah baiknya kawan mengetahui Pedoman Dasar CSS, karena tanpa ini Tampilan Blog kawan sebagai contoh bagus di Chrome belum tentu bagus di Mozilla :q;

Dasar CSS Border

screenshot untuk Tab Menu

Cara Membuatnya :

CONTOH	<div style="border: 2px solid #000; margin: 0; padding: 5px; text-align: center;"> CONTOH </div>
CONTOH	<div style="border:2px solid #000000;-moz-transform: skew(32deg,12deg);- webkit-transform: skew(32deg,12deg);"> CONTOH </div>
CONTOH	<div style="-moz-transform: skew(02deg,150deg); -webkit-transform: skew(02deg,150deg); border: 2px solid #000000; ">  CONTOH </div>
CONTOH	<div style="border:2px solid #000000;-moz-border-radius-topright: 0px 0px;-moz-border-radius-bottomright: 10px 10px; -webkit-border-top-right-radius: 0px 0px;-webkit-border-bottom-right-radius: 10px 10px; border-top-right-radius:0px 0px;border-bottom-right-radius: 10px 10px; "> CONTOH </div>
CONTOH	<div style="border:2px solid #000000;-moz-border-radius-topleft: 10px 10px;-moz-border-radius- bottomleft: 0px 0px; -webkit-border-top-left-radius: 10px 10px;-webkit-border-bottom-left-radius: 0px 0px; -border-top-left-radius:10px 10px;-border-bottom-left-radius: 0px 0px;">CONTOH</div>
CONTOH	<div style="border:2px solid #000000;-moz-border-radius-topleft: 10px 10px;-moz-border-radius-bottomleft: 10px 10px; -webkit-border-top-left-radius: 10px 10px;-webkit-border-bottom-left-radius: 10px 10px; -border-top-left-radius: 10px 10px;-border-bottom-left-radius: 10px 10px;"> CONTOH </div>
CONTOH	<div style="border:2px solid #000000;-moz-border radius-topright: 10px 10px;-moz-border-radius-bottomright: 10px 10px; -webkit-border-top-right-radius: 10px 10px;-webkit-border-bottom-right-radius: 10px 10px; border-top-right-radius: 10px 10px;border-bottom-right-radius: 10px 10px; ">CONTOH</div>
CONTOH	<div style="border:2px solid #000000;-moz-border-radius-topleft: 10px 10px;-moz-border-radius-bottomleft: 10px 10px; -webkit-border-top-left-radius: 10px 10px;-webkit-border-bottom-left-radius: 10px 10px; -border-top-left-radius: 10px 10px;-border-bottom-left-radius: 10px 10px;-moz-border-radius-topright: 10px 10px;-moz-border-radius-bottomright: 10px 10px; -webkit-border-top-right-radius: 10px 10px;-webkit-border-bottom-right-radius: 10px 10px; border-top-right-radius: 10px 10px;border-bottom-right-radius: 10px 10px;"> CONTOH </div> atau cara simpelnya <div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: 2px solid #000000;">CONTOH </div>
CONTOH	<div style="-moz-border-radius: 100px; -webkit-border-radius: 100px; border-radius: 100px; border: 2px solid #000000; height: 90px; padding: 5px; text-align: center; width: 90px;"> CONTOH </div>

Semoga ada manfaatnya

Menu Navigasi Pilihan BlogBego

noreply@blogger.com (Anonymous) — Wed, 2 Oct 2013 00:35:00 +0700

Sekarang saya akan berbagi dengan kawan beberapa Menu Navigasi yang kelihatan sedikit unik lain dari yang lain hasil karya oleh Master-master Blogger :q; mudah-mudahan selera kawan sama dengan selera saya, yang semuanya ini saya temukan saat Blogwalking. Silahkan kawan Lihat langsung Demonya maupun untuk mendownload kalau ingin mencoba memakainya

How to Create a CSS3 Wheel Menu

Selengkapnya....

CREATIVE CSS3 ANIMATION MENUS

Selengkapnya...

CSS3 vertical multicolor 3D menu

Selengkapnya....

Elegant Dark CSS3 Menu Template

Selengkapnya.....

Flat Turquoise Vertical

Selengkapnya....

Pure CSS DropDown Menu

Selengkapnya...

Sweet tabbed navigation using CSS3

Selengkapnya....

Sebenarnya masih banyak lagi yang lainnya, kalau ada waktu lain waktu saya sambung lagi :q; untuk sekarang saya cukupkan hanya sampai disini dulu
Selamat mencoba

Sembunyikan Isi Artikel di Beranda

noreply@blogger.com (Anonymous) — Sat, 28 Sep 2013 23:22:00 +0700

Sebelumnya saya sudah berbagi dengan kawan Cara Menyembunyikan Postingan di Home Page sedangkan yang sekarang saya akan mencoba berbagi dengan kawan Cara Menyembunyikan Isi dari Artikel / Postingan pada Home Page [Beranda] :q; yang saya maksud disini pada Home Page hanya akan kelihatan Judulnya saja, sedangkan Isi sampai Readmore [Selengkapnya] akan kelihatan setelah mouse didekatkan :q; perhatikan gambar berikut

Untuk Demo kawan bisa lihat

Cara membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Copas Kode berikut tepat diatasnya

.post .sembunyi {display:none;}
.post:hover .sembunyi {display:inline;}

Selanjutnya cari <data:post.body/>

yang selengkapnya kurang lebih seperti berikut

<data:post.body/>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'>
<data:post.jumpText/></a>
</div></b:if>
<div style='clear: both;'/> 
</div>

Teks yang saya beri warna merah adalah Kode Readmore [selengkapnya]

Hapus atau ganti dengan kode berikut

<div class='sembunyi'><b:if cond='data:blog.pageType != "item"'><div expr:id='"summary" + data:post.id'><data:post.body/></div> <b:if cond='data:post.hasJumpLink'> <div class='jump-link'> <a expr:href='data:post.url + "#more"'><data:post.jumpText/></a> </div> </b:if></b:if></div><b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if> <div style='clear: both;'/>  </div>

Kalau Template kawan sudah memakai Readmore Otomatis, yang kodenya kurang lebih seperti berikut :

<b:if cond='data:blog.pageType != "item"'><div expr:id='"summary" + data:post.id'><data:post.body/></div><script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script><span class='rmlink' style='float:right'><a expr:href='data:post.url'>READ MORE</a></span></b:if><b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if><div style='clear: both;'/>  </div>

Hapus atau ganti dengan kode berikut :

<div class='sembunyi'><b:if cond='data:blog.pageType != "item"'><div expr:id='"summary" + data:post.id'><data:post.body/></div><script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script><span class='rmlink' style='float:right'><a expr:href='data:post.url'>READ MORE</a></span></b:if></div><b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if> <div style='clear: both;'/> </div>

Simpan Template kawan

Seandainya kawan ingin biar Readmore kelihatan, kawan cukup memindahkan </div> teks yang saya beri warna merah keatas kode Readmore; begitu juga sebaliknya biar Readmore saja yang tidak kelihatan maka yang perlu kawan pindahkan hanya <div class='sembunyi'> taruh diatas kode Readmore :r;

Perpendek Link.......... dibayar ?!

noreply@blogger.com (Anonymous) — Wed, 25 Sep 2013 14:59:00 +0700

Kawan masih ingat postingan saya Ngeblog.... mau cari apa ?! yang isinya tentang cara mendapatkan Ceperan atau Penghasilan Tambahan pada Blog, :z; itulah yang akan saya bahas sekarang dengan Judul Perpendek Link....... dibayar ?! :q;

Sebenarnya diluaran sana banyak web/site yang menyediakan layanan seperti ini cuma yang saya bahas sekarang khusus untuk P.pw kenapa ?! :r; karena saya bergabung dan mencoba cara ini yang khususnya sampai saat ini tersimpan untuk Template yang sudah saya bagikan :x;

Program yang ditawarkan disamping Memperpendek Link juga ada program Referralsnya yang dengan kata lain kita bisa mengajak teman untuk bergabung yang tentunya dibayar juga, bagaimana seruuu bukan :y; kelebihan lainnya ini merupakan pengalaman saya pribadi kita bisa mendownload file sendiri, dihitung dan dibayar juga nantinya :q; selanjutnya kalau kawan berminat dan ikut bergabung dengan saya di P.pw, saya bisa menrekomendasikan » selanjutnya pilih dan isikan Data kawan sesuai Form yang tersedia untuk membuat Account, kalau semuanya sudah terisi dengan benar, nanti kawan akan mendapatkan Email Konfirmasi

contoh : jumlah penghasilan saya

System pembayaran : Penghasilan kawan akan dibayar setiap bulannya setelah minimal berjumlah $5. untuk Paypal dan $10 untuk Payoneer, sedangkan untuk Paypal bisa menyusul pembuatannya.

Cara Kerja : setiap pengunjung yang meng-Klik Link kita yang sudah dipendekan itu akan menunggu 5 detik untuk dialihkan ke P.pw atau selengkapnya silahkan kawan baca disini
cuma satu pesan saya sesuai aturan mainnya, kawan jangan meminta, menyuruh untuk meng-Klik Link tersebut dengan menjanjikan Hadiah, Bonus atau sejenisnya

Selamat Bergabung !!!

Daftar Isi berdasarkan Katagori Pilihan

noreply@blogger.com (Anonymous) — Sun, 22 Sep 2013 06:00:00 +0700

Daftar Isi sekarang ini diciptakan oleh Master Duy Pham, Blogger tetangga :q; kita yang hampir mirip modelnya seperti yang diciptakan oleh Master Taufik Nurrohman :z; yang masing-masing mempunyai kelebihan dan kekurangannya seperti Katagori [Label] bisa dipilih untuk ditampilkan maupun disembunyikan begitu juga dengan jumlah Judul yang ditampilkan dengan kata lain ada selanjutnya / sebelumnya [Next - Prev] perhatikan screenshotnya :

Langsung ke Cara membuatnya silahkan kawan mampir karena toolnya sudah tersedia, kawan cukup memasukan datanya saja

screenshot

Masukan url Blog kawan pada Địa chỉ blog
Tentukan Judul yang ingin ditampilkan pada Số lượng bài hiển thị trên 1 trang
Ketik Katagori yang tak ingin kawan tampilkan pisahkan dengan Koma [,] pada Tên nhãn không cho hiển thị, phân cách bởi dấu phẩy (,)
Selanjutnya pilih Get code
Copas scriptnya pada HTML
Kawan bisa edit kembali script tersebut supaya sesuai selera

<div style='width:96%;padding:5px;margin:0;border:1px solid #999;background:#ccc;'><style type='text/css'>
#show-cat{float:left;margin-right:5px;width:95px;height:310px;overflow-x:hidden;overflow-y:auto;line-height:.8em}#show-cat ul{margin:0;padding:0;border-top:1px solid #333;}#show-cat ul li{list-style-type:none;margin:0;border:1px solid #333;padding:0}#show-cat ul li a{display:block;padding:10px}#show-cat ul li a,#navi-cat a{background:#fff;color:#00F;text-decoration:none}#show-cat ul li a,#navi-cat a,#navi-cat span{font-size:14px}#show-cat ul li a:hover,#navi-cat a:hover{background:#999;color:#fff}#show-post{float:left;width:77%;font-size:12px;line-height:1.8em;}#show-post ul li{list-style-type:none}#navi-cat{padding:20px 0}#navi-cat a{margin-right:5px;border:1px solid #333;}#navi-cat a,#navi-cat span{padding:5px 10px;}#navi-cat span{float:right}</style>
<div id='show-cat'></div>
<div id='show-post'>
<script type='text/javaScript'>
var cat_home='http://blogbego-creation.blogspot.com';cat_numb=10;cat_pre='Prev';cat_nex='Next';cat_remove=['Admin','software','blog','Blogger','link'];
var cat_name;var cat_start;var cat_class;
function show_post2(a){var tt=a.feed.openSearch$totalResults.$t;dw='';dw+='<ul>';for(var i=0;i<cat_numb&&i<a.feed.entry.length;i++){var entry=a.feed.entry[i];cat_title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=='alternate'){var cat_url=entry.link[j].href}}dw+='<li>';dw+=(cat_start+i)+'. <a href="'+cat_url+'" rel="nofollow">'+cat_title+'</a>';dw+='</li>'}dw+='</ul>';dw+='<div id="navi-cat">';if(cat_start>1){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start-cat_numb)+'\',\''+cat_class+'\');return false">'+cat_pre+'</a>'}if((cat_start+cat_numb-1)<tt){dw+='<a href="" onclick="show_post(\''+cat_name+'\',\''+(cat_start+cat_numb)+'\',\''+cat_class+'\');return false">'+cat_nex+'</a>'}dw+='<span>'+cat_start;if(cat_start!=tt){dw+=' – '+(cat_start+i-1)}dw+=' / '+tt+'</span>';dw+='</div>';document.getElementById('show-post').innerHTML=dw+'<style type="text/css">.cat-'+cat_class+' a{background:#464546!important;color:#fff!important}<\/style>'}function show_post(a,b,c){var d=document.getElementsByTagName('head')[0];e=document.createElement('script');e.type='text/javascript';e.setAttribute('src',cat_home+'/feeds/posts/default/-/'+a+'?alt=json-in-script&start-index='+b+'&max-results='+cat_numb+'&callback=show_post2');d.appendChild(e);cat_name=a;cat_start=parseInt(b),cat_class=c}function show_cat(a){var cat=a.feed.category;dw='';dw+='<ul>';for(var i=0;i<cat.length-1;i++){for(var j=i+1;j<cat.length;j++){if(cat[i].term>cat[j].term){cat_hv=cat[i].term;cat[i].term=cat[j].term;cat[j].term=cat_hv}}}for(var i=0;i<cat.length;i++){for(var j=0;j<cat_remove.length;j++){if(cat[i].term==cat_remove[j]){cat.splice(i,1)}}}for(var i=0;i<cat.length;i++){dw+='<li class="cat-'+i+'">';dw+='<a href="" onclick="show_post(\''+cat[i].term+'\',\'1\',\''+i+'\');return false">';dw+=cat[i].term;dw+='</a>';dw+='</li>'}dw+='</ul>';document.getElementById('show-cat').innerHTML=dw}document.write('<script type="text/javascript" src="'+cat_home+'/feeds/posts/default?alt=json-in-script&max-results=0&callback=show_cat"><\/script>');
</script>
</div>
<div style='clear:both'></div>
</div>

Teks yang saya beri warna Biru adalah kode tambahan

Teks yang berwarna Merah adalah kode setelah saya Edit

Hasilnya seperti screenshot pertama

Selamat Mencoba

Animasi Gadget Social Bookmark

noreply@blogger.com (Anonymous) — Thu, 19 Sep 2013 06:00:00 +0700

Kali ini saya tetap berbagi tentang Gadget Social BookMarking dengan model Animasi :q; yang saya dapatkan pada tempat yang sama, terus terang sekarang ini saya lagi males membuat postingan dikarenakan saya fokus pada merancang Template, :z; sedangkan postingan harus tetap ditambah untuk mengecilkan posisi yang tempo hari membengkak hampir 200% [maaf nggak nyambung] :r;

screenshot

Cara Membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Copas Script berikut diatas atau sebelum </body>

<div class='shr_ss shr_publisher'/>


<script type='text/javascript'>
var SHRSS_Settings = {"shr_ss":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}};
</script>


<script type='text/javascript'>
(function() {
var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true;
sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js";
var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s);
})();
</script>

Simpan Template kawan

Refrensi : Paul Crowe

Slide Social Bookmarking Gaya Telor

noreply@blogger.com (Anonymous) — Mon, 16 Sep 2013 06:00:00 +0700

Kali ini saya akan berbagi dengan kawan Cara Membuat Slide Social Bookmarking Gaya Telor :r; yang saya dapatkan saat jalan-jalan ke Webnya Master Paul Crowe yang tampilannya tetap ditempat [fixed] dan saat mouse didekatkan maka akan terbuka untuk melihat isinya

screenshot

Cara Membuatnya :

Masuk Account Blogger dengan ID kawan
Pada Dasbor pilih Template - Edit HTML
Copas Script berikut dibawah ]]></b:skin> atau diatas </head>

<script src='http://w.sharethis.com/gallery/shareegg/shareegg.js' type='text/javascript'/>
<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>
<script type='text/javascript'>stLight.options({publisher: 'bea50586-2b9f-448d-947a-01385f28e305', onhover:false});</script>
<link href='http://w.sharethis.com/gallery/shareegg/shareegg.css' media='screen' rel='stylesheet' type='text/css'/>

Selanjutnya Copas Script berikut diatas </body>

<div style='position: fixed; bottom: 2%; right: 2%;'>
<div class='shareEgg' id='shareThisOrnament'/>
<script type='text/javascript'>stlib.shareEgg.createEgg('shareThisOrnament', ['facebook','twitter','googleplus','pinterest','stumbleupon','linkedin','email','sharethis'], {title:' <data:blog.pageTitle/>',url:'<data:blog.url/>',theme:'holiday'});
</script>
</div>

Teks yang saya beri warna merah bisa kawan ganti sesuai keinginan untuk tampilan

Simpan Template kawan

Blogger Template Kolom Simpel Gratis

noreply@blogger.com (Anonymous) — Fri, 13 Sep 2013 06:00:00 +0700

Template yang sekarang ini terispirasi oleh Master Choen dengan judul Minisimpel-templateblogger dan Douglas Bowman dengan template Minimanya :q; yang semuanya sudah sangat lawas di Dunia Blogger, ini saya sampaikan untuk kawan ketahui sebelum ada yang bertanya nantinya, karena backgroundnya punya Douglas Bowman, sedangkan tampilan Beranda mirip kepunyaan Choen :z;

Kalau kawan menyukainya, saya persilahkan karena saya bagikan secara Gratis, cuma pesan saya tolong jangan dihapus Link saya pada bagian Credit

BLOGBEGO CREATION

BlogBego Creation Mohon Maaf lagi

Menu Navbar Auto Hidden disisi Kanan

Cara Membuat Navigasi Menu Share Auto Hidden

Mohon maaf BlogBego Creation kena Virus

Cara Merubah Model ScrollBar

Background Blog dengan Warna pilihan

Menu Navigasi dengan Image Hover

Pasang Avatar disamping Nama Author

Pasang Avatar Author disamping Judul Artikel

Pasang Image disamping Judul Artikel

Recent Post Thumbnail plus Komentar

Pesan Contact us langsung masuk Email Blogger

Perpendek Komentar dengan Slide Panel

Tool untuk Mengetahui Postingan ter-Populer

Slide Carousel Recent Post untuk Blogger

Cara Membuat Artikel Terkait berisi Thumbnail

Jquery Emoticos untuk Blogger

Mempercantik Border Table dengan CSS

Menu Navigasi Pilihan BlogBego

Pure CSS DropDown Menu

Sembunyikan Isi Artikel di Beranda

Perpendek Link.......... dibayar ?!

Daftar Isi berdasarkan Katagori Pilihan

Animasi Gadget Social Bookmark

Slide Social Bookmarking Gaya Telor

Blogger Template Kolom Simpel Gratis