SEDANG MEMUAT KONTEN HALAMAN
SILAKAN TUNGGU
Menampilkan Daftar Posting Sesuai Dengan Label Yang Anda Pilih. Klik Di Sini Untuk Menampilkan Semua Kategori Artikel.
Menampilkan Daftar Posting Sesuai Dengan Label Yang Anda Pilih. Klik Di Sini Untuk Menampilkan Semua Kategori Artikel.


Pada template default blogspot avatar pada komentar hanya ada jika kita ber komentar login sebagai account google dan sebagainya, jika kita berkomentar anonymous ataupun name/url maka avatar atau gambar pada komentar tidak ada alias kosong. Contohnya gambar di samping ini.
Pada artikel kontes seo saya yaitu ipaymu.com pembayaran online indonesia, banyak mendapatkan komentar dan salah satu di antaranya berkomentar sebagai anonymous tapi kebanyakan pakai name/url jadi kelihatan kosong dan kesannya tampilan blog jadi agak jelek.
Langsung saja cara pasang avatar otomatis pada komentar anonymous dan Name/url :
1.Pastikan Tampilkan gambar profil dalam komentar Di aktifkan, cek di login blogger > setelan > komentar > Tampilkan gambar profil dalam komentar? YES2.Masuk blogger > rancangan > edit html > centang expand template widgetcari dan pastikan kode berikut ini ada di blog sobat :
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
3.Jika kode di atas ada, maka selanjutnya cari kode ]]></b:skin> letakkan kode berikut ini tepat diatas kode ]]></b:skin>
#comments-block .avatar-image-container i
Baca selengkapnya -->>
32 komentar:
Label:

eltelu
Tutorial ni simple dan senang saja.. 
Misz eyza nak simpan widget dalam button pada sidebar.. bila tekan button tu baru widget tu keluar,, trik ni best juga sebab dapat mengurangkan berat loading blog..


Live demo,,

Bertukar banner sesama blogger adalah perkara yang bagus sangat2.. dan aku suka letak banner blogger2 lain walaupun aku sendiri x ada banner ketika entri ni di tulis.. hahaha

Tidak ada standard size untuk banner blogger,sebab tu ramai blogger buat banner ikut saiz yang mereka suka.. bagi aku saiz yang ideal 125 x 125.. tapi saiz tu kira besar jugak la.. klu banyak banner memang serabut la blog kau orang bila letak banner tu pada homepage..

terdapat banyak alternatif untuk kurangkan serabut tu.. tapi dalam entri ni alternatif yang aku guna ialah dengan cara buat scrolling box untuk banner tu.. senang ja..

Live Demo 1


Flying bat in a marqueeBlog RaDhio

Cara Membuat Menu Navigasi Breadcrumb,Breadcrumb,Navigasi Breadcrumb,Menu Navigasi Breadcrumb

Salah satu cara untuk meningkatkan navigasi sebuah blog adalah dengan menambahkan breadcrumb navigasi di blog sobat blogger. Mamfaat SEO dalam memasang breadcrumb adalah sebagai bagian dari teknik improvivasi navigasi untuk memfasilitasi Search Engine Optimization. Dalam tutorial ini, Rinjani Lovers akan memandu sobat blogger untuk menambahkan breadcrumb navigasi di blog sobat blogger. Tapi sebelumnya baca dulu ulasan singkat tentang navigasi Breadcrumb di bawah ini.
Breadcrumbs adalah nama yang diberikan untuk link navigasi yang biasanya ditampilkan di atas judul atau title posting di blog dan di bagian atas halaman. Breadcrumbs menyediakan sarana tambahan di mana visitor atau pengunjung blog dapat dengan mudah melakukan navigasi situs atau blog kita. Pada umumnya, Breadcrumbs menampilkan Halaman Depan atau home > Label> Judul Posting.

Cara Membuat Navigasi Breadcrumb di blog :

eltelu

Membuat background Gambar pada Kotak pencarian



Seperti yang telah anda lihat, bahwa kolom kotak pencarian bisa di hiasi dengan background gambar, sebenarnya cara ini sudah pernah saya jelaskan pada posting yang terdahulu Membuat Background dan Border pada Halaman Posting hanya saja dalam posting ini saya sedikit membuat hal yang baru yaitu menggabungkan antara cara membuat background danmembuat search box.

Untuk membuat search box dengan background gambar kode yang harus di pakai adalah ini.
<form action="/search" id="searchthis" method="get" style="display: inline;">
<input id="search-box" name="q" size="25" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNkOaDYJAHXdMy6d1vJbPmUR3RuWLt-416rFsztgsTlApcrBknJHfYw0oasMuWv0h0uOb10yPTSGwMbMU5lC56jldjcs6vt6rKOTPVfSFs12Orbk0x9ufkdo5uZ2bmIDsY5jYNVnRJzfI/s1600/batik%20solo.jpg); border: 2px solid #EF1515;" type="text" /><input id="search-btn" type="submit" value="Search" /></form>
Ket: Kode yang disorot dengan warna merah ad

eltelu

1.    Login  ke blogger

2.    Pilih tab >Design

3.    Add Gadget pada bagian bawah header template sobat

4.    Pilih HTML/JavaScript lalu pastekan kode di bawah ini















Salam blogging sobat-sobat ku semua, kali ini saya sedikit share tentang cara membuat label berputar-putar di blog, cara ini sudah banyak di bahas oleh master-master blog terdahulu.
Disini saya hanya mengulas ulang, siapa tahu ada sobat blogger yang belum mengerti, ataupun sudah pernah melihat dan ingin mempraktikkan di blog sobat. Dengan menggunakan cara ini tampilan widget label akan lebih ringkas, dan tidak terlihat terlalu panjang ataupun terlalu lebar, karena lebar dan panjangnya bisa sobat sesuaikan sendiri.
Saya kira cukup sekian saja penjelasan saya, mari kita menuju ke pokok pembahasan yaitu cara membuat label berputar-putar di blog.

eltelu

Selama ini mungkin kita hanya tahu bagaimana cara menambah Gadget di
halaman bagian samping atau bagian bawah. Tapi bagaimana caranya kalau kita pingin
menambah Gadget di bagian atas...?
Untuk mengetahuinya, silahkan ikuti langkah-langkah berikut ini :

 1. Login ke blog anda
2. Klik Tata Letak
3. Klik Edit HTML
4. Beri tanda centang pada kotak kecil Expand Template Widget
5. Silahkan cari kode berikut ini di dalam template anda

eltelu
1. Setelah kalian masuk di Blogger, klik Rancangan > Elemen Laman > Tambah Gadget/Widget. Kemudian pilihHTML/JavaScript.

2. Berikan judul dengan mengisi kolom judul, lalu copy kode di bawah ini dan paste di kolom Konten yang berada dibawah kolomJudul.


<div style="overflow:auto; width:auto; height:100px; padding:5px; border:1px solid #e6e4e3;">
<ol>

CODE SCRIPT WIDGET LIFE TRAFFICK
CODE SCRIPT WIDGET COUNTER FLAG
CODE SCRIPT WIDGET HISTATS
dan seterusnya

</ol></div>

eltelu

Kali ini saya akan posting tentang memasang share button  keren ini berfungsi untuk mengirim ke facebook, twitter dan masih banyak sosial network lainnya. Cara memasangnya tidak rumit hanya saja paham dengan tulisan. Berikut ini caranya :

  • Login ke blogger
  • masuk ke rancangan => edit html => centang expand template widget 
  • cari kode <data:post.body/> kemudian copas kode berikut letakkan dibawah kode yang berwarna merah
<!-- AddThis Button BEGIN -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div></b:if>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e71fdea5bff8d67"></script>

Assalamu'alaikum sobat blogger, ngomong-ngomong soal promosi blog tukar link merupakan salah satu cara yang ampuh untuk memperkenalkan blog kita kepada orang-orang yang membutuhkan informasi. Nah, untuk mempermudah dalam bertukar link, sekarang banyak sekali website yang menggunakan fasilitas "AUTO BACK LINK" bagaimana Auto BackLink bisa bekerja? sanagat praktis, untuk mencobanya, sobat saya perkenankan untuk mengKLIK salah satu benner kecil yang ada dibawah blog ini.

Jika sobat mengklik, dan menuju ke website tersebut, maka disana akan ada URL blog ini di bagian paling atas bukan? Nah, untuk mendapatkan yang seperti itu, sobat harus mengunjungi satu persatu website yang menyediakan baner atau widget tersebut.

Untuk menghindari hal semacam itu, Ghilankmayones mencoba membagikan kode backlink ini secara FREE dan cuma-cuma, hehe.... barangkali ada yang membutuhkan namun malas untuk bolak-balik ke website-website tersebut bisa langsung saja copas dari sini.






eltelu

Daftar Situs Penyedia Template Bloggger














Ghilank Mayones | Blogger memudahkan penggunanya dalam mengganti atau memodifikasi template sehingga bisa menyesuaikan dengan selera masing-masing. Berikut ini beberapa daftar situs penyedia template yang bisa anda kunjungi dan download.
http://btemplates.com/
http://blogtemplate4u.com/
http://www.finalsense.com/
http://www.bloggertemplates.org/
http://www.blogcrowds.com/
http://www.idwebtemplate.com/
http://www.ourblogtemplates.com/
http://www.bloggerstyles.com/
Daftar situs tersebut akan terus diperbaharui karena masih banyak lagi situs penyedia layanan template gratis di internet. Silahkan anda coba!.

eltelu
Dengan Twitterfeed anda tidak perlu repot update posting Blog anda ke Fanspage Facebook maupun jaringan sosial yang anda punya. Dengan Twitterfeed memungkinkan anda secara otomatis mengirimkan feed artikel terupdate dari blog anda. 


Terus terang saya baru menggunakan Twitterfeed kemarin. Bagi anda yang Fanspage Facebook nya ingin update otomatis sesuai posting blognya seperti Blog Ghilank Mayones ini, saya akan beri tutorial Update Otomatis Posting Blog ke Fanspage Facebook
  • Silakan kunjungi Twitterfeed.com dan lakukan pendaftaran seperti biasa. Gratis dan gak seribet mendaftar Facebook. (hehe)
  • Setelah selesai mendaftar, anda langsung disuguhkan halaman Create Feeds. Silakan masukan nama feed (bebas) dan Url blog atau url blog feed anda. Jika anda menggunakan Blogspot, maka Url Feednya:
    http://namablog.blogspot.com/atom.xml
    atau

eltelu
Kali ini saya akan sharing ilmu baru lagi yaitu Cara membuat link bersinar.Apa itu link bersinar?link bersinar maksudnya adalah link yang jika didekati cursor akan keluar bintang-bintang di sekelilingnya pasti kalian udah pada penasaran kan.yaudah kalo gitu langsung aja kita praktekin tapi sebelum itu kalian harus follow blog saya dulu hehehehe karena apa? karena dengan mem-follow blog saya anda akan tau kalo ada postingan baru yang menarik lagi oke kalo gitu kita mulai:

1.Login ke akun blogger anda
2.Pilih tab rancangan
3.Pilih Edit html
4.Cari kode </head> (gunakan f3 agar lebih mudah mencari)
5.Kalo udah ketemu letakkan kode dibawah ini diatas kode </head>
 
<style>
a:hover { text-decoration:blink; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilk-oFoMsRFaR7zzIw3t6wEEf99kfE69RT1snvy52IJhdZaSZJi45p9yo_tGDud3vkZENaHHAObXk5otCUgPDhRZjOcJx_RZeuH7sVrU2pjAxt65UxL6a47pa3q6iwQ4cKGq8JYYcmvW0/s1600/blink.gif); }
</style>

6.Kalo udah tinggal di save.

eltelu
Selamat pagi Sobat Blogger di manapun berada, dalam pertemuan kali ini saya akan berbagi ilmu  blogging dengan Sobat yaitu tentang bagaimana cara mengetahui jumlah pengunjung yang sedang online di blog kita.Disini saya akan memberikan cara yang paling mudah untuk di pahami sekaligus di praktekan oleh Sobat Blognoler, yaitu dengan memasang widget gratis dari Whos.amung.us.
  Sebelum memasang Widgetnya di blog sobat, silahkan sobat lihat contohnya di blog ini bagian kiri atas.Bagaimana, apakah sobat tertarik? jika ya, saya akan memberikan  contoh  gambar Widget yang lain dan kode HTML nya gratis buat sobat.Dan sobat bisa memilih mana yang paling sobat sukai.


1. Widget untuk bagian kiri atas blog.(Seperti punya BLOGNOLER.COM)


Hi, Kawan kembali lagi bersama saya hari ini untuk Membuat Related Post Dalam Kotak Scroll yang sebelumnya rekan saya http://setya21.blogspot.com/ tanyakan. Cara inipun tidak jauh berbeda dengan postingan saya sebelumnya tentang membuat-artikel-terkait-plusikon. Semoga Artikel ini bermanfaat unutk kawan-kawan blog yang lainnya yang tidak bisa disebutkan namanya satu persatu namun tak mengurangi rasa horamat saya kepada kawan sekalian ( Pidato X ya ) !!!


Adapun Cara Membuat Related Post Dalam Kotak Scroll adalah sebagai berikut :
1. Masuk Ke halam Dasboard > Tata Letak > Edit HTML.

2. BackUp template kesayangan Anda, Agar dapat dinormalkan apabila mengalami eror. caranya disini.

Apakah teman2 mempunyai sebuah blog di blogspot?
Apakah teman2 kadang merasa "sebal" dengan domain yang panjaaangg sekali seperti namakita.blogspot.com ?
Jika jawabannya iya, maka kali ini saya akan berbagi ilmu bagaimana cara merubah domain blogspot kita menjadi .co.cc dengan cara redirect.

Buku tamu merupakan salah satu hal yang tidak wajib ada di blog kita, namun buku tamu bisa mempercantik blog kita. Selain itu pengunjung blog kita bisa dengan mudah menyapa kita sebagai admin (atau pengunjung lainnya), walau cuma sebatas kalimat (mampir gan, malam, kunjungi blog saya juga ya, dsb...)

Buku tamu tersembunyi juga baru saya pasang di sidebar blog ini. Setelah niat untuk pasang buku tamu tersembunyi di blog ini akhirnya timbullah niat untuk menuliskan bagaimana cara memasang buku tamu tersembunyi di sidebar blogger.
 Ok ga perlu panjang lebar, langsung saja ke topik utama kita.

 Cara Membuat Buku Tamu Tersembunyi Di Blogger


widget ini berfungsi untuk membuka halaman belakang pada sebuah blog. Cara kerjanya praktis, anda tidak perlu membuka halaman demi halaman secara urut untuk menuju halaman akhir, cukup dengan melihat angka halaman, klik...maka halaman tersebut akan terbuka.
Mari...kita lihat cara menerapkannya...!!Lihat contoh dibawah ini :





Contoh Digunakan oleh EPG Studio






  • Sign ke Blogger dengan ID anda.

eltelu
hari ini sekedar share tentang cara membuat menu horizontal dengan search box dan pemasangannya tanpa ribet cukup di pastekan pada gadget sobat tanpa mengedit template

Untuk melihat demonya sobat klik tombol di bawah ini

LIHAT DEMONYA

Bagaimana apa sobat tertarik dengan menu ini?

Mari kita lanjutkan saja tutorial ini selengkapnya :

1.    Login  ke blogger

2.    Pilih tab >Design

3.    Add Gadget pada bagian bawah header template sobat

4.    Pilih HTML/JavaScript lalu pastekan kode di bawah ini

<style type="text/css">
.black_horizontal{
float:left; margin-bottom:10px;
padding:0px; width: 100%;
overflow: hidden; background: #499bea;
background: -moz-linear-gradient(top, #999 0%, #000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999), color-stop(100%,#000));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#999', endColorstr='#000',GradientType=0 );
-moz-box-shadow: 1px 1px 10px #888;
-webkit-box-shadow:1px 1px 10px #888;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;}
.black_horizontal ul{
margin: 0; padding: 0; padding-left: 10px;
font: bold 14px Verdana;
list-style-type: none; }
.black_horizontal li{
display: inline; margin: 0;}
.black_horizontal li a{
float: left; text-decoration: none;
margin: 0; padding:12px; color: white;}
.black_horizontal li a:visited{color: white; }
.black_horizontal li a:hover, .black_horizontal li.selected a{background:#000000;
text-decoration:underline;
}
#cari_apa{
width:250px; float:right; padding: 4px; margin:0px; }
#cari_apa form input.searchinput{
background: #fff; padding:6px; margin:0px; width: 160px;
border: solid 1px #999; outline: none;
-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;
-moz-box-shadow: inset 0 1px 3px #666;
-webkit-box-shadow: inset 0 1px 3px #666;
box-shadow: inset 0 1px 3px #aaa; }
#cari_apa form input.submitbutton{
cursor:pointer; width: 60px;
background: #FCFCFC;
background: -moz-linear-gradient(top, #FCFCFC 0%, #E8E8E8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FCFCFC), color-stop(100%,#E8E8E8));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FCFCFC', endColorstr='#E8E8E8',GradientType=0 );
border:1px solid #d8d8d8;
-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;
color:#000; padding:4px; text-shadow:1px 1px #fff;}
</style>
<div class='black_horizontal'>
<ul><li><a href="#">Home</a></li>
<li><a href="#">Tutorial</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">About</a></li>
</ul>
<div id="cari_apa"><form action="/search" id="searchform" method="get" style="display: inline;"><input id="s" maxlength="255" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Cari apa bro..&quot;;}" onfocus="if (this.value == &quot;Cari apa bro..&quot;) {this.value = &quot;&quot;}" type="text" value="Cari apa bro.." /> <input class="button" id="searchsubmit" name="Click" type="submit" value="Click" /></form></div></div>

5.    Simpan gadget sobat dan lihat hasilnya

Selesai sudah tutorial Cara Membuat Menu Horizontal Dengan Search Box, selamat mencoba, semoga berhasil dan bermanfaat
Posting Lama Beranda
Langganan: Postingan (Atom)