-->
© 29-Nov-2011
About the Author
11:18 WIB
Snippet

Halo Sobat dimanapun Anda berada senyum Sebelumnya lutfi oXside akan menanyakan kabar kalian semua.. apakah kalian baik-baik saja..? soal oke semoga baik-baik saja yah hari inisengihnampakgigi . Oke kita langsung saja ke topik pembicaraan kali ini yaitu lutfi oXside akan membahas tentang cara menambah gambar sebelum judul posting di blog Anda.
Lalu apa gunanya.. soal
Gunanya Cuma untuk memperindah judul posting kita biar terkesan bagus dilihat oleh pengunjung blog Anda dan membuat blog Anda lebih Expresif encem .
Oke buat Anda yang pengen membuatnya silahkan ikuti cara dibawah ini..

Pertama-tama kita pastikan sudah log in ke blogger, setelah log in kita masuk menu Layout kemudian masuk menu Edit HTML


Lalu Cari Code CSS seperti dibawah ini yang mirip di blog Anda


.post h3 {
margin:.5em 0;
padding:30px 0px 0px 45px;
font-size:120%;
font-weight:bold;
font-style:italic;
line-height:1.3em;
color:#333;

Nah telah ketemu tambahkan Code semacam background:url(http://www.iconarchive.com/icons/mayosoft/aero-vista/TextoPlano-48x48.png) no-repeat left center; dan juda code height:48px; biar IE (internet Explore) bisa mengadaptasi jika di Mozilla Firefox tidak masalah tanpa code height, sehingga kurang lebih code CSSnya menjadi

.post h3 {
margin:.5em 0;
padding:48px 0px 0px 45px;
font-size:120%;
font-weight:bold;
font-style:italic;
line-height:1.3em;
color:#333;
height:48px;
background:url(http://www.iconarchive.com/icons/mayosoft/aero-vista/TextoPlano-48x48.png) no-repeat left center;

Setelah Anda tambah jangan lupa Atur paddingya agar gambarnya terlihat dengan ukuran yang sempurna... tapi jika Anda menggunakan Background yang saya kasih diatas paddingnya seperti ini padding:48px 0px 0px 45px;
Nah Code yang tercetak tebal dan merah diats adalah lokasi URL gambar, jika Anda ingin mencari koleksi gambar yang lainya Anda Bisa Cari di www.iconarchive.com.
Dan code height sesuaikan dengan tinggi background kamu.

Jika kamu belum mengerti padding silahkan baca Artikel yang ini dulu biar nanti posisinya terlihat sempurna.

Setelah Semua selesai dan beres tidak ada kesalahan lalu Simpan pengaturan Anda.. dan lihat hasilnya sengihnampakgigi

Nah jika Gambarnya kurang terlihat utak atik saja paddingnya...

Oke saya kira cukup sekian jika ada pertanyaan silahkan lontarkan saja di kotak komentar..
senyum

 

Judul blog berguna untuk memberi informasi tentang blog kita dan sangat penting dalam search engine.. tapi jika di blogger judul blog tampak di header dan jika kita membuat background header yang kita buat sedemikian unik, bagus dan keren menurut kita akan mengganggu pemandangan background header kita...

Nah pada pembicaraan kali ini lutfi oXside akan membuat suatu tuorial sederhana untuk menghilangkan judul blog di header namun tidak hilang judul blog kita sebenarnya hanya saja tidak tampak pada header. Yupzz kemaren lutfi oXside udah pernah buat tutorial sederhana mengenai cara menghilangkan Tanggal posting tapi sekarang lutfi oXside akan membuat tutorial cara menghilangkan Judul Blog di header... oke langsung saja

Masuk menu Layout kemudian masuk Edit HTML kemudian cari Code di blog Anda yang mirip seperti dibawah



#header h1 {
margin:50;
padding:5px 0 0 10px;
font-size: 100%;
font-weight:bold;
line-height: 1.2em;
letter-spacing:.0em;
font-style:italic;
color:#FFFFFF;
}

nahh seperti halnya menghilangkan tanggal posting kita tambahkan Code Css visibility:hidden; Kedalam Css Diatas Sehingga kurang lebih menjadi seperti dibawah

#header h1 {
margin:50;
padding:5px 0 0 10px;
font-size: 100%;
font-weight:bold;
line-height: 1.2em;
letter-spacing:.0em;
font-style:italic;
color:#FFFFFF;
visibility:hidden;
}
 Jika Sudah Simpan pengaturanya....

sekian semoga bermanfaat.. jangan lupa isi komentar key


 

Yupz sesuai dengan judul yang diatas aku akan menerangkan secuil ilmu yang aku dapatkan dari pengalaman. jika anda belum faham aku kan menerangkan dulu.
judul blog berjalan?
judul blog kita terlihat berjalan di title bar browser anda untuk lebih mempercantik blog kita dan blog kita telihat menarik jika dikunjungi oleh orang lain:D
gimana pengen tau caranya?
aku akan kasih tau caranya dech. yaitu:


  1. Login ke blogger kemudian ke menu Layout ---> Edit HTML
  2. Cari kode/script
    <title><data:blog.pageTitle/></title>
  3. Ganti kode diatas dengan
    <b:include data='blog' name='all-head-content'/>

    <script language='JavaScript'>
    var txt="<data:blog.pageTitle/>";
    var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;
    txt=txt.substring(1,txt.length)+txt.charAt(0);
    segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
    </script>

Catatan
text yang berwarna merah diatas adalah merupakan kecepatan pergerakanya jika kamu tambah angkanya maka pergerakanya akan lambat dan jika mengurangi angka maka pergerakanya akan semakin cepat

Mungkin Anda sering melihat blog dari blogger diatasnya ada sebuah Navigasi bar yang telah ada sejak daftar pertama kali di blogger, Navigator bar tersebut berfungsi Untuk bermacam-macam kegiatan yang disediakan di blogger, misalnya Sign in/Sign Out, Untuk mencari Blog,Untuk melaporkan kecurangan para blogger dan lain sebagainya.

Tapi banyak para blogger menghilangkan Navigator tersebut dengan alasan untuk mempercantik blognya dan biar seperti website sungguhan setelah di belikan Domain baru.
Tapi jangan kawatir buat yang pengen menghilangkan navigator bar di blogger ada caranya kok tapi anda harus menanggung ketidak lengkapan fasilitas di navigator bar, gimana pengen menghilangkanya? mari... mari.. aku kasih tau..

  1. Buka menu Layout kemudian Edit HTML
  2. Cari Kode ]]></b:skin> kemudian
  3. Taruh Script Di bawah ini diatas Kode diatas
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

  1. kemudian Save deh..

Eh Udah dulu yah gw dah ngantuk banget nih, semoga berhasil buat kalian

Pada perjumpaan kali ini lutfi oXside ingin membicarakan tentang hati dan cinta. cie,. cie,. Eh tapi jangan salah bukanya lutfi oXside lagi jatuh cinta lagi ama seseorang tapi saking jatuh cintanya ama ngeblog and eka,lutfi oXside buat efek Hati bertaburan yang kaya gini.. he.. hee.

Efek Heart(Hati) bertaburan ini cocok Buat Anda yang mempunyai blog bernuansa cinta, terlebih jika Anda membuat blog dengan content puisi cinta, novel cinta bahkan nasehat-nasehat tentang cinta.
Tapi jika Anda Belum Faham lihat contoh disini..

Bicara soal cara pembuatanya trik yang kali ini cukup mudah dan tidak rumit... nah jika Ada ingin membuat efek cinta ini silahkan ikuti cara yang dibawah ini

Langkah pertama yang harus kamu lakukan adalah Log In ke Blogger lalu masuk menu Design kemudian masuk menu Edit HTML

Lalu taruh Code dibawah ini diatas code </body> atau kedalam tag <body>



<script src='http://sites.google.com/site/anasku2000/lovingheart.js'>
</script>

Nah jika Sudah Simpan dan lihat hasilnya

Sekian semoga bermanfaat bagi Anda dan selamat bercinta-cintaan dengan blog Anda

Pada kesempatan kali ini Kita akan membahas mengenai komentar di blogspot, Nah jika Komentar box anda belum embeded comments blogger atau belum berada dibawah postingan Tapi jika Commnets box anda sudah embeded mari kita otak-atik sehingga menjadi menarik, pada perjumpaan kali ini kita membahas mengenai tanggal komentar yang biasanya berada dibawah bagian pesan komentar, nah pada perjumpaan kali ini kita akan mengubahnya di sebelah Author commnets. Jika Anda belum Paham perhatikan gambar dibawah ini

Sebelum


Sesudah


Nah dari keterangam gambar diatas apakah anda sudah faham dan ingin membuatnya..?
kalau Anda ingin membuatnya silahkan ikuti cara dibawah ini

Pertama-tama seperti biasa harus Log in ke blogger terlebih dahulu, Kemudian masuk Menu Layout kemudian masuk menu Edit HTML

Jangan Lupa centang "expand widget templates"
Lalu cari code seperti dibawah ini

<data:commentPostedByMsg/> dan tambah tulisan "pada atau pada tanggal"

Kemudian Scroll agak kebawah sedikit dan temukan code seperti ini
<dd class='comment-footer'>

Dan dibawa code diatas ada code seperti dibawah


<span class='comment-timestamp'>

<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>




perhatikan code yang berwarna merah..
Lalu pindah Code diatas kesamping code <data:commentPostedByMsg/> tadi

sehingga kurang lebih Codenya menjadi seperti dibawah ini


<data:commentPostedByMsg/>
pada tanggal<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>




Lalu Simpan dan lihat hasilnya deh...

Gimana gampang kan.. Artikel tentang mengotak-atik Kotak Komentar akan menyusul

Satu lagi alternatif blogroll (tempat link teman di blog kita) setelah kemaren membahas tentang cara membuat blogroll dengan manual HTML sekarang saya akan mencoba membuat blogroll dengan gadget Blogger default yaitu link list.



Pada standartnya gadget ini tidak begitu sering digunakan oleh para peblogger karena jika Linknya banyak akan memenuhi halaman Blog kita dan jika linkya di klik tidak membuka jendela baru tapi malah akan membuka di jendela lama yang kita gunakan.

tapi saya ada suatu trik untu membuat gadget Link List ini menjadi sederhana dengan efek scroll dan efek pembukaan link di jendela baru.. Lihat contoh di blog saya (disini)


Masih banyak peblogger yang tidak ingin repot membuat tempat link teman dengan gadget bawaan dari blogger yaitu "link list" secara penggunaanya mudah gitu... Oke kita langsung saja ke cara pembuatanya

Lanhkah pertama yaitu sudah Log In ke blogger dan pasti sudah memasang Gadget "Link List"

Setelah langkah pertama terlaksanakan lalu masuk menu Layout kemudian masuk menu Edit HTML dan centang "expand widget templates"

Lalu Cari Code HTML seperti dibawah ini





<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>

Kemudian Ganti code diatas dengan Code dibawah ini..



<div style='width:100%; height:100px; overflow:auto;'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target' target='new'><data:link.name/></a></li>
</b:loop>
</ul>
</div>

Perhatikan code height:100px; itu adalah tinggi dari link list bisa kamu ubah-ubah sesuai selera kamu.. jadi jika linkya melebihi batas tinggi maka akan ada efek scrollnya

Kemudian Simpan dehh.. dan lihat hasilnya..

Gimana gampang kan silahkan berexperimen. yahh

Heading yang mempunyai arti kepala, pasti kepala tempatnya diatas.. ya iyalah masa di bawah.. he.. he.. Seperti halnya juga headings di blog yang tempatnya diatas tapi jangan salah Saya kali ini tidak membahas tentang header blog tapi melainkan headings yang biasa ditulis dalam code HTML dan CSS adalah seperti h2, h3, h4 dan sebagainya, Contoh headings di blog adalah seperti judul posting, judul sidebar, tanggal posting dan judul blog.

Seperti biasa tutorial kali ini saya akan coba membahas tentang cara memodifikasi CSSnya, untuk merubah tampilan headings di blog kita hal yang harus kita lakukan adalah mengotak-atik CSS (cascading style sheets) dari yang standar ke bentuk yang kita inginkan.

Oke langsung saja Saya akan jelaskan satu persatu dan cara memodifikasinya...
Masuk menu Layout kemudian masuk Edit HTML untuk mengota-atik CSSnya

Merubah tampilan Judul Posting

Jika Anda ingin merubah tampilan judul posting Anda maka code CSS yang harus Anda cari adalah seperti dibawah ini


.post h3 {
------------
-------------
-------------
-------------
}

Merubah Tampilan Judul Sidebar

Cari code CSS dibawah ini


.sidebar h2{
------------
-------------
-------------
-------------
}

Merubah Tampilan Judul Blog di Header

Cari CSS dibawah ini

#header h1 {
------------
-------------
-------------
-------------
}

Merubah Tampilan Tanggal Posting

Cari CSS dibawah


h2.date-header {
------------
-------------
-------------
-------------
}

Perhatikan Code CSS yang berwarna merah saja karena yang lainya adalah definisinya.
Nah sekarang kita lanjut ke cara otal-atik CSSnya biar tampilanya oke punya.

Ganti garis putus-putus dari code CSS diatas dengan definisi dibawah ini


margin:5px;
padding:5px;
border:1px dotted #000000;

font-size:140%;
untuk menentukan besarnya huruf , bisa kamu ubah sesuai selera kamu misalnya kamu ubah menjadi 100% atau 150% dan juga satuanya bisa kamu ganti dengan px (pixels) misalnya 14px.

font-weight:bold;
Untuk menentukan ketebalan huruf, Bold adalah jika kamu ingin hurufnya tebal apabila kamu ingin merubah hurufnya biasa ganti bold dengan normal, dan apabila kamu ingin mengganti hurufnya menjadi miring kamu ganti saja dengan code italic.

text-align:right;
Untuk menempatkan posisi text jika kamu isi dengan right maka text akan berada di kanan dan apabila kamu isikan left text akan berada di kiri dan juga center maka textnya akan berada di tengah.

color:#FFFFFF;
Untuk memberi warna huruf, #FFFFFF adalah code warna untuk warna putih carilah code warna yang sesuai dengan keinginan kamu di http://colorschemer.com/online.

Background:#000000;
untuk memberi warna background. silahkan ganti code warna sesuai keinginan kamu di http://colorschemer.com/online untuk mencari code warna.

text-transform:uppercase;
uppercase untuk menampilkan hurufnya dengan huruf besar semua meski dalam pengaturan anda menuliskan huruf kecil. jika Anda ingin mengubah dengan huruf kecil semua ganti dengan lowercase dan jika ingin huruf depanya saja yang besar maka ganti dengan capitalize.

Nah jika di blog Anda pasti CSSnya sudah ada definisinya tinggal mengedit dan menambahi yang kurang-kurang saja.

Sekian dulu artikel ini Saya rangkum dari berbagai sumber salah satunya dengan sistem browsing dan baca artikel dari kang rohman.
Semoga bermanfaat bagi Anda....

 
 
 


Terinspirasi dari blognya pencuri code yang bernuansa Seo Contest sapa lagi kalau bukan blognya kang noval, dalam blog kang noval tersebut post-footernya menarik karena ada tambahan Iconya, jadi post footer akan kelihatan sedikit lebih expressif.
Jika belum tau apa itu post footer area lihat aja gambar diatas, Nah post footer adalah informasi dari postingan yang kita tulis di blogger yang tempatnya dibawah postingan kita, dalam post footer area terdapat infromasi-informasi tentang postingan yang ada diatasnya, misalnya siapa penulisnya, jam berapa dipublikasikan, sudah ada berapa komentar, artikel tersebut masuk dalam kategori apa dan juga yang lainya.

Gimana apakah Anda ingin membuat post footer area Anda lebih expressif dengan tambahan Icon?
Ikuti petualangan saya dibawah ini.

Seperti biasa yaitu masuk menu Layout (tata letak) lalu masuk meni Edit HTML.

taruh code CSS dibawah ini diatas code ]]></b:skin>
 
/* post fotter
---------------------------*/
.post-author {
background: url(http://i296.photobucket.com/albums/mm169/anasku/profile.gif) no-repeat;
padding-left: 20px;
color: #c70823;}
.post-timestamp {
background: url(http://i296.photobucket.com/albums/mm169/anasku/jam.gif) no-repeat;
padding-left: 15px; margin-left: 10px;
}
.post-labels {
background: url(http://i296.photobucket.com/albums/mm169/anasku/forder-biru.png) no-repeat;
padding-left: 25px; margin-left: 10px;
}
.comment-link {
background: url(http://i296.photobucket.com/albums/mm169/anasku/comment-icon.gif) no-repeat;
padding-left: 15px; margin-left: 10px;
}
.post-backlinks {
background: url(http://i296.photobucket.com/albums/mm169/anasku/favorit.gif) no-repeat;
padding-left: 15px;
}

Kalau sudah tinggal Save dan jadi deh...

Nah code yang berwarna merah diatas adalah URL gambar... bisa kamu ganti dengan gambar sendiri, ingat sesuaikan ukuranya..

Nah gimana caranya gampang kan??

jika ada pertanyaan silahkan tanya aja gak usah malu-malu okey.

Widget Followers adalah widget baru dari blogger blogspot yang mempunyai fitur memberikan informasi postingan (updatetan) terbaru pada blog yang diikuti pada dashboard para blogger yang mengikuti blog tersebut, Sebagaimana langganan Feed via Email jika ada postingan terbaru dari blog yang sudah di subscribe maka akan ada informasi di Email orang yang mensubscribe blog tersebut.

Widget ini mempunyai tampilan standart seperti ini, jika dalam keadaan Log In



Dan jika tidak keadaan Log In tampilanya akan seperti


Ada perbedaan Antara kedua gambar pada waktu Log In dan tidak, diantaranya adalah jika keadaan Log In Pesanya "STOP FOLLOWING" dan jika keadaan tidak log in pesanya "FOLLOW THIS BLOG" dan juga dibagian bawah jika log in pesanya "MANAGE" dan jika tidak log in pesanya tertulis "VIEW ALL".

Nah pada pertemuan kali ini kita akan membahas tentang cara bagaimana memodifikasi pesan yang terinfeksi link perintah oleh Widget Followers ini.

Untuk mengedit Link perintah kamu harus masuk menu Layout kemudian masuk menu Edit HTML

Jangan lupa centang "expand widget templates"

1. menghapus count (jumlah) Followers pada judul sidebar

<data:totalFollowerCount/>

Jika ingin menghilangkan jumlah follower tinggal hapus saja code diatas

2. Mengganti perintah "Follow this Blog"

<data:followThisMessage/>

3. Mengganti perintah "Stop Following"

<data:stopFollowingMessage/>

4. Mengganti Teks jumlah follower pada bagian bawah.


<data:followersFooterMessage/>

5. Mengganti perintah dan teks jika belum ada follower (kosong)

<data:emptyFollowersMessage/>

6. Mengganti Perintah "Manage" (dalam keadaan Log In di blogger)

<data:manageFollowersMessage/>

7. Mengganti perintah "View All" (keadaan tidak Log in)

<data:viewAllMessage/>

ganti code-code link perintah diatas sesuai dengan kreasi kamu sendiri!

Nah code-code diatas bisa kamu cari (untuk mempermudah tekan ctrl+F pada browser kamu dan masukkan code yang kamu cari) pada menu Edit HTML dan keadaan "Expand widget templates" tercentang

kalau sudah tinggal SAVE

Semoga artikel ini bisa sedikit membantu Anda!
sekian semoga bermanfaat bagi Anda, jika ada pertanyaan silahkan isi komentar!


Berkaitan dengan artikel yang kemaren yaitu tambahan Icon pada post footer dan artikel kali ini hampir serupa mengenai tambahan icon, seperti yang kita tau Label/category adalah pengelompokan beberapa artikel yang terkait, dan sebagai icon yang cocok adalah Folder karena folder adalah tempat untuk mengelompokkan file-file terkait atau kelompok file tertentu. Sekarang saya akan membuat artikel yang cukup ringan tapi semoga bermanfaat bagi para blogger untuk membuat blognya lebih hidup dan menarik! Istilah dalam iklan di TV adalah lebih punya taste gitu loh!. Maka dari itu ijinkanlah saya membuat artikel untuk menambah Icon pada Label/category.

Sebenarnya dalam label/category icon standarnya yaitu list style yang berbentuk bulat tapi kali ini Saya mencoba untuk menggantinya jika ada list stylenya dan menambah jika belum ada list stylenya, moga-moga nggak bingung dengan penjelasanku...

Nah sekarang langsung ke TKP (tempat kejadian project) yaitu ke blogspot!
silahkan Baca, Pahami dan Praktikan!

pertama harus log in ke blogger, kedua masuk menu Layout (tata letak) kemudian masuk menu Edit HTML

Taruh Code dibawah ini diatas Code ]]></b:skin>
 
/*Label
----------------------*/
#Label1 ul, #Label2 ul{
list-style:none;
margin:0 0 0;
padding:0 0 8px;
}
#Label1 li, #Label2 li{
background:url(http://i296.photobucket.com/albums/mm169/anasku/folder-explorer-16x16.png) no-repeat;
padding-top:0;
padding-right:0;
padding-bottom:3px;
padding-left:20px;
margin-bottom:3px;
border-bottom:1px dotted #063E3F;
line-height: 1.2em;
}

Nah tulisan yang tercetak merah diatas adalah URL gambar icon bisa kamu ganti punya kamu sendiri atau bisa menggunakan icon folder yang saya sediakan dibawah ini

Photobucket
http://i296.photobucket.com/albums/mm169/anasku/folder-16x16.png

Photobucket
http://i296.photobucket.com/albums/mm169/anasku/folder-open-16x16.png

Photobucket
http://i296.photobucket.com/albums/mm169/anasku/folder-explorer-16x16.png

Photobucket
http://i296.photobucket.com/albums/mm169/anasku/forder-biru.png

Nah kalau sudah silahkan SAVE untuk melihat hasilnya silahkan buka blog Anda.

Nah setelah Anda menggunakan trik kali ini pasti blog Anda akan kelihatan Cool kaya yang punya mungkin :D

nah sekian dulu! artikel yang ringan ini semoga sedikit membantu Anda untuk mempercantik Blog Anda,


Komentar sudah menjadi hal yang tak bisa dipisahkan dengan postingan, seperti ibarat motor dengan bensin, tetapi pada postingan saya kali ini akan membahas bagaimana cara mengubah bentuk komentar lama blogger menjadi komentar baru blogger yang lebih canggih dengan ada photo author disebelah post comments.

Apabila Anda menggunakan template lawas photo author ini tidak muncul selayaknya yang ada pada template baru blogger yang ada photo author disebelahnya.

Coba lihat gambar dibawah ini untuk membedakan komentar lawas dengan komentar baru.

Nah terlihat skema di atas ada perbedaan dengan ditambahi foto komentator.

Apakah Anda ingin mengubahnya ?

Langkah pertama masuk pada menu "Settings" lalu "Comments" dan pastikan pilih "YES" untuk pertanyaan "Show profile images on comments?" lalu SAVE

langkah kedua masuk menu Edit HTML dan centang box "Expand Widget Templates"

Lalu cari kode dibawah ini
 
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='&quot;comment-&quot; + data:comment.id'>
<a expr:name='&quot;comment-&quot; + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='&quot;#comment-&quot; + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

Pahami dan sesuaikan codenya untuk template Anda.

Lalu Ganti code diatas dengan code dibawah ini


<div expr:class='data:post.postAuthorClass' expr:id='data:widget.instanceId + &quot;_comments-block-wrapper&quot;'>
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd expr:class='&quot;comment-body &quot; + data:comment.commentAuthorClass' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
<span class='interaction-iframe-guide'/>
</p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
</div>

Nah tinggal SAVE dan lihat hasilnya deh.

Dan apabila ada pertanyaan silahkan lontarkan saja komentar disini, mulai sekarang saya semangat untuk membalas komentar-komentar Anda.

 


Hai sobat blogger, bagaimanakah kabar Anda sekalian ? semoga dalam keadaan sehat dan selalu ceria. Pada tulisan kali ini, saya akan membagikan ilmu yang sudah saya pelajari kepada Anda yaitu masih tentang blogger dan topik yang saya bahas kali ini adalah seputar "Menampilkan widget pada halaman tertentu" yang sering digunakan pada template megazine, misalnya anda ingin menampilkan widget dihalaman post saja atau tidak ada hanya dihalaman post.

Nah langsung saja kita pelajari bersama-sama.

Langkah pertama yang harus Anda lakukan adalah masuk menu "Design" kemudian masuk ke bagian "Edit HTML" lalu centang kotak "Expand widget templates"

lalu cari code widgetnya seperti ini
<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>

</b:includable>
</b:widget>
Untuk mempermudah pencarian silahkan masukkan judul widget seperti "Pesan" kedalam kotak pencarian browser (ctrl + F)

Kemudian tambah code

<b:if cond='data:blog.url == data:blog.homepageUrl'>

dan ditutup dengan code </b:if> untuk menempatkan di hanya halaman depan saja

dan ditempatkan seperti dibawah ini



<b:widget id='HTML1' locked='false' title='Pesan' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

Perhatikan penempatan code yang berwarna hijau !

kemudian save.

Dan dibawah ini adalah code yang bisa digunakan untuk penempatan lainya


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

Untuk menempatkan di halaman Archive saja

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

Untuk menempatkan dihalaman item/posting saja digunakan code

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

Dan untuk pada halaman pages atau static page blogger digunakan

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

Dan untuk tambahan, jika Anda ingin menempatkan di halaman tertentu dengan menggunakan URL gunakan code dibawah ini

<b:if cond='data:blog.url == "URL_HERE"'>

Ganti code URL_HERE dengan URL yang ingin anda tampilkan.

Dan untuk pengecualian, misalnya anda tidak menempatkan widget hanya di halaman depan saja dengan cara mengganti tanda = pertama dengan tanda !

Contoh


<b:if cond='data:blog.pageType != data:blog.homepageUrl'>

Nah tidak terlalu sulit kan? semoga bermanfaat bagi Anda.

Sekian silahkan berkomentar jika ada pertanyaa, :D


Pada episode yang lalu saya sudah menerangkan tentang kemunculan widget attribution blogger dan cara memindahkanya, pada episode kali ini pun masih membahas tentang widget attribution blogger namun yang saya bahas kali ini adalah cara menghilangkanya.

Caranya cukup simple dan mudah banget, ikuti Saja langkah dibawah ini.

pertama masuk pada "Design" Lalu "Edit HTML"

masukkan code css dibawah ini diatas code ]]></b:skin>
 
#Attribution1 {height:0px;
visibility:hidden;

display:none
}

Tinggal SAVE deh.

Dan jika Anda menggunakan code CSS di postingan ini, tinggal ganti code yang berwarna biru dengan code diatas.