Zenixs Blog

" Hanya 1 yang punya "

Showing posts with label Triks Blogger. Show all posts

Showing posts with label Triks Blogger. Show all posts

Membuat Komentar Admin Berbeda

Semangat pagi. salam hangat dari admin Zenixs Blog. ditengah suasana yang cukup hening ini blog ZENIXS akan membahas cara membuat kotak komentar admin berbeda di blog. tutorial ini pastinya sudah dibahas oleh blog-blog sebelah yang mungkin sudah tidak update lagi jika membahasnya sekarang. tapi di blog ini saya baru membahasnya karena saya baru saja saya mencobanya di blog saya.

Blogger telah menerapkan sistem komentar baru dengan reply / balas atau istilahnya Threaded Comments, maka tutorial kali ini akan menjelaskan cara membuat komentar admin berbeda pada sistem threaded comments. Hal ini tentunya supaya pengunjung mudah membedakan, mana komentar admin dan mana komentar visitor. kurang lebih screenshotnya seperti dibawah ini.

Klik Gambar Untuk Memperbesar

Berikut Caranya :

Log in ke akun blogger sobat
Selanjutnya Klik Rancangan ➨ Edit HTML. Jangan lupa untuk selalu memback up template anda takut terjadi kesalahan CentangExpand Template Widget ➨ Download Template.
Selanjutnya cari kode </body>
Pastekan kode dibawah ini sebelum kode </body> <script src='http://code.jquery.com/jquery-latest.js'/>  <script> $(function() { function highlight(){ $('.user.blog-author,.ssyby').closest('.comment-block') .css('border', '1px solid #cc0000') .css('background','#444444 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCRxMhHKubVrZeOYzc49DdFeyxhfBaglRbW6QxdPaY88DMOEhW9d_vQAjUuvjo7rL1hs4HPO5O46kdfZ4pnHiE1fA01qNhFVfiHXvpUKTwS_UQWcroPZLk4EXEXslKVSt1up18VUsGVYE/s1600/admin2.png") no-repeat bottom right') .css('padding', '10px'); } $(document).bind('ready scroll click', highlight); }); </script>
Simpan Template anda

NOTE : Silahkan melakukan pengaturan pada warna background (kode warna biru) dan untuk menghapus tulisan admin anda cukup menghapus kode yang berwarna merah.

Bagaimana cukup mudah bukan cara membuat komentar admin berbeda disetiap artikelnya. Jika anda mengalami kesulitan harap tinggalkan komentar.

..: Semoga Bermanfaat :..

Tags: Tips Blogger, Triks Blogger

Settingan intuit untuk Blogger

Settingan Intuit For Blogger- wkwkwkwkw..... ini nihhh situs yang menjual domain wkwkkw dan nyebelinye sekarang blogger dah tambah ribet untuk settingan domain,,, alhamdullillah ane nemu caranye :D. gini.... langsung aja ya :D (hanya di zenixs blog)

1. Login Ke Intuit anda
2. Pilih menu domain

3.pilih Advanced DNS settings pada domain kamu

4. isi seperti : >>>>>
Pada Form A Records Tambahkan kode di bawah ini

216.239.32.21
216.239.34.21
216.239.36.21
216.239.38.21

Pada form CNames tambahkan ghs.google.com dikolom kedua
Dikolom pertama tuliskan kode "pada saat tambah domain khusus error dan keluar error 12 maka dapat kode yang harus dimasukan dan kode dibawah 'www' masukan ke bagian Host dan kode yang panjang masukan ke bagian POIN TO"

NB: wkkwkw... kalo nulis tulisan panjang dikotak POIN TO kan kgk bisa hehehe... nah mangkanye agan install FireBug di Mozzila dan gunain deh. {klik sini pasang Firebug}

jika sudah klik submit-submit :D selesai hehehee..... kalo kurang jelas tulis di ChatBox aja oke

Tags: Tips Blogger, Triks Blogger

Masalah Google Code Subversion Repository

Google Code Subversion Repository - disebabkan karena terjadinya error pada kode javascript yang telah tertanam pada blog, baik itu pada widget maupun pada bagian template si pemilik blog tersebut. dan biasanya pesan ini akan muncul pada brows firefox, untuk browser yang lain saya juga belum tahu. dan sepengetahuan saya mengapa terjadinya error Google Code Subversion Repository itu dikarenakan kode JS (seperti yang kita ketahui bahwa kode JS banyak jenisnya seperti recent comment artikel terkait dsb yang di upload pada googlecode) si pemilik telah kadaluarsa/dihapus/dipindahkan dan bahkan di banned oleh googlecode (bila si pemilik JS mengupload pada googlecode).

Ciri blog yang terkena error "Google Code Subversion Repository" - dengan menggunakan jendela firefox akan keluar pesan seperti gambar dibawah ini dengan otomatis pada blog yang terkena error "Google Code Subversion Repository".

Tips mengatasi error "Google Code Subversion Repository"

kurang lebih pesan error "Google Code Subversion Repository" seperti ini.

Cara mencari sumber error - Sobat cari kode JS yang sekiranya terdapatkan error seperti recent comment, popular post dan kode-kode yang mengandung JS/pihak ketiga lainnya yang tidak muncul pada homepage/halaman posting.

Asal kira - Nah lo, bener nggak nih min ZenixsBlog cara mengatasi error "Google Code Subversion Repository". Untuk permaslahan ini, si admin pernah mengalami permasalahan error ini pada blog gaptek32. yah sobat boleh percaya 75% tentang keampuhan cara mengatasi error "Google Code Subversion Repository" ini, namanya juga asal kira :D .

Tips cara mempulihkan error - Coba sobat baca di point ketiga, nah bila sudah menemukan terdapat JS yang mencurigakan dengan terjangkitnya error, tinggal hapus saja kode tersebut. Dan bila sobat ingin menggunakan kode JS yang sama (seperti recent comment, popular post yang menggunakan JS/pihak ketiga). Dan dibawah ini adalah contoh kode JS recent comment milik bloggerbugis yang disimpan pada googlecode ;

<script type="text/javascript" src="https://sites.google.com/site/bloggerbugis/js/Recent_Comments_New_Bloggerbugis.js"></script>
Mungkin sedikit tips dari admin, jangan pernah menggunakan kode JS/pihak ketiga yang disimpan sama seperti sebelumnya, karena kemungkinan besar kode tersebut telah kadaluarsa/dihapus/dipindahkan dan bahkan di banned oleh googlecode. carilah kode tersebut yang di simpan oleh sobat yang lain.

Sobat dapat menambahkan Tips mengatasi error "Google Code Subversion Repository" untuk melengkapi Tips cara mempulihkan error ini hingga menjadi 100% :D.

Semoga dapat membantu permasalahan dengan Tips mengatasi error "Google Code Subversion Repository"

Tags: Tips Blogger, Triks Blogger

Memasang FansPage Show/Hide

Cara Membuat fan page Facebook Auto Hide ( muncul tanpa di klik ) - Ada beberapa cara memodifikasi fanpage facebook , setidaknya kali ini saya akan kasih salah satunya.., kali ini akan memposting tentang fanpage facebook auto hide.

Hampir mirip dengan chatbox milik ane yang bisa sobat liat di sebelah kanan halaman ini, widget ini akan muncul di bagian tepi sebelah kanan halaman blog sobat juga. DEMO

Tertarik untuk memasang widget fanpage facebook auto hide, ikuti langkah -langkahnya..

Tahap 1

1. log in ke akun Blog sobat.

2. Klik Rancangan --> Edit HTML --> Cari kode </head> ( gunakan Ctrl + F )

3. Letakkan kode berikut di atasnya.

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

Tmbhn : Jika sobat dapati kode tersebut memang sudah ada, hiraukan tahap ini dan langsung ke tahap berikut..

4. Klik Save

Tahap 2

1. Klik Elemen Laman

2. Klik Tambah Gadget

3. Pilih HTML/Javascript

4. Masukkan kode berikut ke dalam kotak yang di sediakan

<script type="text/javascript">
//
</script>
<style type="text/css">
.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/SyafriBlog&width=245&colorscheme=light&show_faces=true&connections=9&stream=false&header=false&height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://christiantatelu.blogspot.com/2012/01/cara-membuat-fan-page-facebook-auto.html">Tutorial Here</a></span></div></div>

Tmbhn : Ganti tulisan bercetak tebal dengan URL page sobat
seperti gambar berikut..

5. Klik save dan lihat hasilnya!!

Semoga tips di atas bisa membantu sobat blogger.. Sekian.

Tags: Tips Blogger, Triks Blogger

Membuat Panel Info

Assalamualaikum ....
Apa kabar mas broo hehehee

sore ini saya mau kasih tutorial cara buat panel info tadi sempet jalan" keblog-blog dan nemu ini artikle hehehe.... Tutorial ini untuk membuat Panel Info , sebenarnya bukan hanya panel info yang bisa di masukan di dalam situ buku tamu, dll juga bisa, kalau mau liat yang buku tamu silahkan klik disini tutorial nya, ksempatan Kali ini masalah panel info ..

ok .. langsung aja ke tutorial nya ..

1. Login ke Blogger dengan akun anda.
2. Kemudian pilih Rancangan >> Edit HTML
3. Seperti biasa klik Download Template Lengkap biar aman
4. Jangan lupa centang Expand Template Widget
5. Selanjutnya cari kode </body>

taruh kode di bawah ini diatas kode </body>

kode:

<style type='text/css'>#panelinfojaparus2 {z-index: 1000;background:-moz-linear-gradient(top, #CFFBC1, #000);background: -webkit-gradient(linear, left top, left bottom, from(#1F2326), to(#000));box-shadow:-2px -2px 8px #FF0000, 2px 2px 20px #CFFBC1;-moz-box-shadow:-2px -2px 8px #FCFFBC1, 2px 2px 20px #CFFBC1;-webkit-box-shadow:-2px -2px 8px #CFFBC1, 2px 2px 20px #FF0000;width:400px;position: fixed;top:50px;left:0;margin-left:-325px;border:1px solid #444;background-position:top right no-repeat;height:35px;font:11px Arial;color:#eee;border-top-right-radius:8px;border-bottom-right-radius:8px;-moz-border-radius-topright:8px;-moz-border-radius-bottomright:8px;-webkit-border-top-right-radius:8px;-webkit-border-bottom-right-radius:8px;}#panelinfojaparus2{-o-transition: all 1s ease-in;-moz-transition: all 1s ease-in;-webkit-transition: all 1s ease-in;} #panelinfojaparus2:hover{width:410px;opacity:1.0;margin-left:0;}.panelinfo {border:1px solid #444;width:290px; margin:0px 90px 10px 10px;background:#000;color:#CFFBC1; border-radius :20px; padding:5px 0;-moz-border-radius:20px; -webkit-border-radius:20px;-o-transition:all 2s ease-in;-moz-transition:all 2s ease-in;-webkit-transition:all 2s ease-in;opacity:0.2;}.panelinfo:hover{opacity:1.0;box-shadow:1px 1px 15px #000; -moz-box-shadow: 1px 1px 15px #000; -webkit-box-shadow: 1px 1px 15px #000;background: #000;}.panelinfo2 {margin:5px 10px;padding:0px 8px 10px;color:#FFFFFF;overflow:hidden;height:450px;}.japarus007 {border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;}.japarus2 ul.bom {margin: 0; padding: 0;}.panelinfo2 li {margin-left:20px;}.panelinfo2 li a {color: #CFFBC1; line-height: 4px; font-size: 11px;font-weight: bold; text-decoration:none;}.panelinfo2 li a:hover {color: red;text-shadow: 0 1px 1px #000;}.panelinfo2 h2 { font: 18px Droid Serif;font-weight:bold;padding:0 8px;color: #CFFBC1;text-shadow: 0px 1px 1px #ddd;border-bottom: 1px solid #CFFBC1;}.japarussentuh {font-size:22px;font-weight:bold;font-family:Arial Narrow;float:right;margin: 3px 10px 0 0;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;text-decoration:blink;}.japarussentuh:hover{-o-transform: scale(2) rotate(720deg) translate(0px);-moz-transform: scale(2) rotate(720deg) translate(0px);-webkit-transform: scale(2) rotate(720deg) translate(0px);color: greend;}</style>

<div id='panelinfojaparus2'><span class='japarussentuh'>Info</span>
<div class='panelinfo'><div class='panelinfo2 japarus007'>
<h2>sekilas tentang diriku</h2>
<li><a href='http://japarus.xtgem.com/aboutme.html' target='_blank' title='klik aja, g mengandung unsur haram ko, wkkkkkk'><img alt='about me' src='http://japaruspunya.xtgem.com/image/Enter.gif'/></a></li>

<h2>contact</h2>
<center>
<li><a href='ymsgr:sendIM?japarus_hdl' title='yahoo mesengger'><img alt='yahoo' src='http://japaruspunya.xtgem.com/image/y_button.png1301885017'/></a></li>
<li><a href='http://twitter.com/japarus' title='twitter ku'><img alt='Twitter' src='http://japaruspunya.xtgem.com/image/tw_btn.png1301885017'/></a></li>
<li><a href='http://www.facebook.com/japarus' title='facebook ku'><img alt='Facebook' src='http://japaruspunya.xtgem.com/image/fb_btn.png1301885017'/></a></li>
<li><a href='http://www.koprol.com/users/japarus' title='koprol'><img alt='koprol' src='http://japaruspunya.xtgem.com/image/koprol.jpg'/></a></li>
<li><a href='http://profiles.friendster.com/gwhanyanewbie' title='friendster'><img alt='friendster' src='http://japaruspunya.xtgem.com/image/friendster.jpg'/></a></li></center>
</div>
</div>
</div>

Tags: Tips Blogger, Triks Blogger

Memasang Link Exchange

Berdasarkan pengalaman para blogger, memasang widget Tukar Link (link exchange) merupakan salah satu cara menjalin persahabatan dan tali silahturahmi sesama blogger, disamping membawa pengaruh terhadap naiknya page rank blog. Ada banyak cara untuk melakukan link exchange. Salah satunya dengan menggunakan jasa Mister Linky's Magical Widgets, yaitu website penyedia widget link exchange otomatis. Cara kerjanya cukup sederhana, dimana para blogger yang memasang widget ini di blog mereka dan ada blogger lain yang memasukkan link di dalam widget yang tersedia maka link blogger tersebut secara otomatis muncul di halaman blog.

Bagi anda yang ingin memasang tukar link otomatis Mister Linky's Magical Widgets di blog, berikut langkah-langkahnya:

Mendaftar di Blenza Mister Linky's

Kunjungi Blenza Mister linky's

Klik Register untuk membuat akun baru

Isi Form yang tersedia seperti:

* User ID : (tulis Id baru anda)

* Password : (tulis password anda)

* Confirm Pasword : (tulis lagi password anda)

* Name : (tulis nama anda)

* E-mail Address : (tulis email anda)

* Confirm E-mail : (tulis lagi email anda)

* Blog Address : (tulis url blog anda)

Setelah di isi lengkap klik Register
Kemudian anda akan dikirim email
Silahkan login untuk membuka email anda
Copy kode konfirmasi yang diberikan lewat email
Klik link http://www.blenza.com/linkies/confirm.php yang terdapat di bawah kode konfirmasi

Masukkan kode konfirmasi tadi, dan klik Confirm
Kemudian klik link http://www.blenza.com/linkies/confirm (berisi kode konfirmasi), atau bisa juga login di http://www.blenza.com/linkies/login.php

Masukkan User ID dan Password, dan klik Login

Masuk ke menu Wizard

Pilih salah satu dari msing-masing step

* Step: 1 pilih “HTML Only”

* Step: 2 pilih widget Original Auto-Linkies (atau yang lain)

* Step: 3 pilih Friday’s Feast

* Beri tanda Centeng di kiri Remember these selections for next time

Klik Generate Code
Muncul Script yang diberikan Mister Linky's

Copy Script tersebut dan simpan pada notepad
Selesai langkah mendaftar di Blenza Mister Linky's

Tags: Tips Blogger, Triks Blogger

Mengganti Background blog

Seorang blogger mungkin memiliki keinginan mengubah tampilan blognya. Salah satu cara adalah dengan mengganti/ ubah background / latar belakang blognya, bisa jadi tujuannya agar blognya terlihat lebih hidup, lebih artistik ataupun dengan tujuan personalisasi dirinya. Satu hal yang terpenting adalah jangan sampai dengan background yang baru malah terlihat lebih "jelek" dari background terdahulu. bisa jadi pengunjung blog malah tidak betah berlama2 di blog Anda. Ataupun malah membuat loading blog Anda bertambah berat alias lelet, hehe. Oke langsung saja kita pada materi pembahasan ( weleh kaya Pak guru aje) :

Login ke akun blogger Anda
Klik Rancangan > Edit HTML> centang/klik Expand Template Widget kemudian cari kode di bawah ini:

body {

tekan Ctrl + F untuk memudahkan pencarian (lihat gbr), kotak pencarian di kiri bawah.

cara merubah background latar belakang blogspot

Sebagai contoh lihat penjelasan berikut.

body {
   margin:0 auto;
   padding:0px 0px 0px 0px;
   background:#F6F6F6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_o8jeuJlkschhC0QuZXUdREDiOLC416ZwQ2b7B-EohhW8Dcis-ng7mmGVMbsJFe9hiDmrPw0U00PKUkbLZn_syuAzOWiEOUlgYfp1Vlcw3Pg1c2OL9d-I7yRJGd8EH6WinKv_G3gQlNZ1/s0/body.png) top repeat-x ;
   font-family:verdana,Arial, Tahoma,Century gothic, sans-serif;
   font-size:12px;
   }

Lihat kode background:#F6F6F6. kode itu menunjukkan warna latar belakang, sedangkan kode url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_o8jeuJlkschhC0QuZXUdREDiOLC416ZwQ2b7B-EohhW8Dcis-ng7mmGVMbsJFe9hiDmrPw0U00PKUkbLZn_syuAzOWiEOUlgYfp1Vlcw3Pg1c2OL9d-I7yRJGd8EH6WinKv_G3gQlNZ1/s0/body.png) adalah alamat web tempat background gambar di simpan.

untuk menggantinya Anda bisa menghapus salah satunya, Jika Anda mengininkan dengan latar belakang warna saja, maka kode berwarna biru harus dihapus, sedangkan jika ingin berlatar belakang gambar (image), maka tidak perlu dihapus. Di blog saya tetap saya pasang agar jika background dalam bentuk gambar gagal diloading pengunjung blog, maka background dalam bentuk warna masih bisa.

ukurannya cukup kecil (1,6kb) namun memenuhi seluruh tampilan latar belakang blog. Lihat kode berwarna kuning (top repeat-x) hapus saja kode semacam itu, yaitu sesudah kode berwarna biru, (hati-hati tanda titik koma (;) jangan sampai terhapus). Sehingga kodenya menjadi seperti di bawah ini (lihat kode warna biru)

body {
   margin:0 auto;
   padding:0px 0px 0px 0px;
   background:#F6F6F6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_o8jeuJlkschhC0QuZXUdREDiOLC416ZwQ2b7B-EohhW8Dcis-ng7mmGVMbsJFe9hiDmrPw0U00PKUkbLZn_syuAzOWiEOUlgYfp1Vlcw3Pg1c2OL9d-I7yRJGd8EH6WinKv_G3gQlNZ1/s0/body.png);
   font-family:verdana,Arial, Tahoma,Century gothic, sans-serif;
   font-size:12px;
   }

Bagaimana? sudah paham dan sudah diganti?

3. Jika sudah klik Pratinjau, seandainya langkah2 Anda sudah benar, maka tidak akan ada error pada pratinjau.

4. Kalau sudah mantap klik Simpan Template.

5. Selesai dan selamat mencoba.

Semoga tutorial cara mengganti atau merubah background template blog ini bisa membantu sobat blogger yang lain.

Tags: Tips Blogger, Triks Blogger

Membuat Daftar Isi Otomatis

Sudah sejak lama saya ingin sekali menulis tentang Membuat Daftar Isi Blog Otomatis ini, akan tetapi ada saja kendala karena keterbatasan waktu. Nah, pada kesempatan kali ini berhubungan saya pun sedang libur, saya akan mempostingnya untuk Anda. Daftar isi blog otomatis kali ini berbeda dengan sebelumnya, baik tampilan maupun script yang akan digunakan, saya pribadi lebih suka dengan daftar ini (content) karena bisa menampilkan seluruh judul postingan dan dikelompokkan sesuai dengan label masing-masing judul. Jadi kalau postingan kita buat tanpa menggunakan label, besar kemungkinan judul postingan tidak akan muncul didalam daftar ini.

Agar tidak bingung tentang membuat daftar isi blog yang akan saya terangkan, silahkan Anda klik disini menarik bukan?. Nah, perlu saya jelaskan tentang manfaat daftar isi ini, bahwa daftar isi akan membantu blog anda untuk lebih banyak dikunjungi dalam segi halamannya. Jadi, ketika visitor atau pengunjung blog Anda sudah membaca salah satu artikel dalam blog dan artikel itu menarik, maka pengunjung akan mencari artikel menarik atau artikel terkait leinnya. Hal ini menyebabkan besar kemunkinan visitor akan sering berkunjung ke blog Anda.

Sama halnya dengan sebuah buku, jika sebuah buku tidak memiliki daftar isi maka pembaca buku tersebut akan kebingungan mencari halaman dalam buku tersebut. Hasilnya buku tersebut pun diabaikan dan dilupakan. Sekarang sudah jelaskan tentang manfaat membuat daftar isi blog ? Sekarang bagaimana cara membuat daftas isi blog otomatis ? yuk kita simak tutorial dibawah ini.

Berikut ini langkah-langkahnya :

1. Masuk ke account blogger anda

2. Pilih tata letak/layout

3. Pilih tambah gadget

4. Pilih HTML/javascript.

5. Beri Judul Dafar isi atau judul sesuai dengan keinginan sobat

6.. Kopas kode di bawah ini

<script src="http://zenixs.net/daftarisi.js">

</script>

<script src="http://namabloganda.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc">

</script>

7. Terbitkan Entri.

Namun jika Anda ingin membuat daftar isi menggunakan fungsi scroll, ada beberapa kode yang harus ditambahkan seperti dibawah ini :

<div style="overflow:auto;width:430px;height:120px;padding:10px;border:1px solid #eee"><script style="text/javascript" src="http://zenixs.net/daftarisi.js"></script><script src="http://namabloganda.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
</div>

Keterangan :

Ganti tulisan yang berwana merah dengan nama blog Anda
Sesuaikan tinggi scroll dengan merubah height:120px sesuai keingingan Anda
Sesuikan lebar scroll dengan merubah width:430px sesuai dengan keinginan Anda.

Tags: Tips Blogger, Triks Blogger

Memasang Banner Iklan Floating

Cara Mudah Memasang Banner Iklan Floating/Melayang Di Blog - Pada Ulasan postingan saya kali ini membahas tentang Cara Memasang Banner Iklan Floating/Melayang Di Blog untuk contoh Silahkan sobat Lihat pada gambar Dibawah ini

Cara Memasang Banner Iklan Floating/Melayang Di Blog

Nah sekarang caranya :

1. Login ke akun blogger.com
3. Klik Tata Letak
4. Klik Tambah Gadget, setelah itu muncul jendela munculan dan pilih opsi
HTML/Javascript
5. Copy kan Kode Dibawah ini

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'>
</script><br >
<script type='text/javascript'>
$(document).ready(function() {
$('img#closed').click(function(){
$('#btm_banner').hide(90);
});
});
</script>
<style type='text/css'>
div#btm_banner {
bottom: 0;
position: fixed;
width: 100%;
opacity: 0.9;
left: 0;
}
div#btm_banner img{
border:0;
cursor:pointer;
}
</style>
<div style='height: 0px;'></div>
<div align='center' id='btm_banner' style='height: 110px; z-index: 9999;'>
<div style='text-align: right; width: 735px; height: 3px;'>
<img id='closed' src='http://www.voa-islam.com/images/close-icon.png'/></div>
<div style='clear: both;'></div>
<p>
<p><center>
KODE BANNER IKLAN DISINI
</center></p>
</p>
</div>

6. Lalu Simpan

Demikian postingan tentang Cara Memasang Banner Iklan Floating/Melayang Di Blog semoga bermanfaat Buat Anda Semua.

Tags: Tips Blogger, Triks Blogger

Membuat Tombol Show/Hide komentar

Show/Hide pada Menu komentar dengan jquery - kali ini ingin memberikan sedikit tambahan tips blog untuk show/hide menu komentar blog yang tepat di bawah postingan .

Sebagai demonya bisa dilihat komentar show hide di blog ini, penampakannya lihat dibawah ini :

1. Penampakan Masih Hide

2. Penampakan Setelah Show

Langsung saja ke topik pembahasannya,

Login blogger
Rancangan, Edit Html
Download Template Lengkap
Centang menu Expand Template Widgets
Cari kode ]]></b:skin> dan simpan CSS berikut diatasnya :

#comments {
display : none;
}
.tombol-komentar a{
text-align: center;
}
.styleadiekonoe {background: #CCC;
padding: 5px;
}
a.tombol-komentar{background: #f4f8fc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj57qQcquCYajyWf7ktdqEWr9PXtek7qQvAtoTOzXCzIlC9J67OBXBbqLEOO5Ogz1FxM5EsNxbKRWxCwtPpCTm25jniXATiSqNMgaWgfR5XWsQoXrKVyiZEiZSxOr0pwHrWegyhpKXmu4k/s1600/plus_adie-konoe.blogspot%5Bdot%5Dcom.gif) 85% 55% no-repeat;display:block;padding:15px 40px 15px 15px;border:1px solid #000000}
a.tombol-komentar:hover{background: #7FFF00 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj57qQcquCYajyWf7ktdqEWr9PXtek7qQvAtoTOzXCzIlC9J67OBXBbqLEOO5Ogz1FxM5EsNxbKRWxCwtPpCTm25jniXATiSqNMgaWgfR5XWsQoXrKVyiZEiZSxOr0pwHrWegyhpKXmu4k/s1600/plus_adie-konoe.blogspot%5Bdot%5Dcom.gif) 85% 55% no-repeat;display:block;padding:15px 40px 15px 15px;border:2px dashed #000000;}
a.active.tombol-komentar{background: #f4f8fc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM8yuuJ32KyM6IMVogV-_sUDVq191rFsGfUHv0mbMQuqcII7wzHzlfQbiSiWWvnKeT-cGJPHswBSYEjTCDi6MTZpYa9q4h0mpB3vw_5XZuBbtXoPnJ5ACN4ldW-CIef7UVpWog4N2IMHc/s1600/minus_adie-konoe.blogspot%5Bdot%5Dcom.gif) 85% 55% no-repeat;border:1px solid #000000}

6. Berikutnya simpan Script berikut diatas kode </head> :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(".tombol-komentar").click(function(){
$("#comments").slideToggle("slow");
$(this).toggleClass("active");
return false;
});
});
</script>

7. Cari kode seperti dibawah ini (ctrl+F untuk mempermudah pencarian) :

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

8. Jika sudah ketemu simpan kode berikut dibawah kode yang dicari tadi :

<center>
<div class='styleadiekonoe'>
<a class='tombol-komentar' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 0'>No Comments be the first<b:else/><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></b:if>
</a>
</div>
</center>

9. Simpan template dan lihat hasilnya. Silahkan dikembangkan sesuai keinginan.

Tags: Tips Blogger, Triks Blogger

Menaikan Page Rank

Cara Cepat Menaikkan Pagerank bisa kita lakukan dengan gratis tanpa biaya. Cara Cepat Menaikkan Pagerank ini sudah banyak dilakukan oleh para blogger2 yang sudah ahli. Gak usah susah2 komentar sana sini. Cukup ikuti panduan ini. Oiaa.. Belum tahu apa itu PageRank? baca dulu gih di om wikipedia.. http://id.wikipedia.org/wiki/PageRank Cara Cepat Menaikkan Pagerank adalah dengan copy paste artikel ini dari atas sampai bawah. Tapi sebelum itu bacalah dulu pesan-pesan dibawah ini. Silahkan pelajari dengan baik lalu anda terapkan dengan benar…. Ada kata bijak yang mengatakan “Honesty is The Best Policy (Kejujuran adalah politik/strategi terbaik)”, mari kita buktikan….apakah konsep kejujuran disini dapat kita gunakan untuk menghasilkan traffic dan popularity yang sangat hebat dari sebuah metode rumit para expert webmaster atau pakar SEO..? Saya percaya kita bisa asal metode ini anda terapkan dengan benar…apabila ini di aplikasikan pada web/blog anda sesuai ketentuan maka: Blog anda akan kebanjiran traffic pengunjung secara luar biasa hari demi hari, tanpa anda harus repot-repot memikirkan SEO atau capek-capek melakukan promosi keberbagai tempat di dunia online. Blog anda juga akan kebanjiran backlink secara signifikan hari demi hari, tanpa perlu repot-repot berburu link keberbagai tempat di dunia internet. Hal yang harus anda lakukan adalah ikuti langkah-langkah berikut : Buatlah postingan artikel seperti posting saya ini, atau copy-paste artikel ini. Lalu beri Judul sesuka anda (karena itu merupakan SEO buat web/blog anda sendiri). Anda cukup hanya meletakkan Link-Link di bawah ini pada artikel anda tersebut pada blog/web anda. Friendster.com Google.com Bisnis Online Panduan belajar Wordpress Softare Asli Lirik Music Indo Lirik Music Luar Free Template game para gamer Tutorial Blogging | Internet Bisnis Online pVidia Blog kreativitas Bang huda Green Tree Zamedaku Share PERATURAN : Sebelum anda meletakkan Link-Link tersebut ditas ke dalam postingan web/blog anda, harap hapus Link nomor 1 , Sehingga link no 1 hilang dari daftar link dan setiap link anda naikkan 1 level ke atas. Yang tadinya no 2 naik menjadi no 1, yang tadinya no 3 menjadi no 2, yang tadinya no 4 menjadi no 3 dan begitu seterusnya. Setelah itu masukkan Link anda pada urutan Paling bawah ( no 15 ). Ingat!!! Jangan Merubah Urutan daftar link.. Buktikan kejujuran anda.. Karena ini demi keuntungan bersama, kita sesama blogger Apabila setiap blogger yang ikut dalam metode ini berhasil di duplikasi ole hblogger lain yang akan bergabung, andaikan 5 blogger yang bergabung maka Backlink yang anda dapat adalah Ketika: Posisi anda 15, jumlah backlink = 1 Posisi 14, jumlah backlink = 5 Posisi 13, jumlah backlink = 25 Posisi 12, jumlah backlink = 125 Posisi 11, jumlah backlink = 625 Posisi 10, jumlah backlink = 3.125 Posisi 9, jumlah backlink = 15.625 Posisi 8, jumlah backlink = 78.125 Posisi 7, jumlah backlink = 390.625 Posisi 6, jumlah backlink = 1.953.125 Posisi 5, jumlah backlink = 9.765.625 Posisi 4, jumlah backlink = 48.828.125 Posisi 3, jumlah backlink = 244.140.625 Posisi 2, jumlah backlink = 1.220.703.125 Posisi 1, jumlah backlink = 6.103.515.625 Dan semua Dari kata kunci yang anda inginkan, bayangkan jika ini bisa berjalan dengan sempurna maka anda akan memperoleh 6.103.515.625 external link yang berasal dari berbagai blog yang anda tidak akan pernah bayangkan sebelumnya. Belum lagi apabila ada pengunjung blog anda dari Link List tersebut diatas maka otomatis anda akan memperoleh traffic ke web/blog anda juga. Ingat!!! Aturuan mainnya, Anda harus memulai dari urutan paling bawah (no 15) sehingga hasil backlink anda bisa Maksimal. Jangan salahkan saya apabila anda tidak mengikuti metode ini dengan benar dan Link anda tiba-tiba berada pada urutan no 1 dan menghilang pada Link daftar. Jadi mulai lah pada urutan paling bawah(no 15). Bisakah Anda melakukan tindakan tidak fair atau tidak jujur dengan menyabotase metode ini, misalkan saja “menghilangkan semua link asal” lalu di isi dengan link web/blog anda sendiri…? ….Bisa, dan metode ini menjadi tidak maksimal. Kejujuran adalah strategi/politik terbaik…..Tapi saya yakin bahwa kita semua tak ingin menjatuhkan kredibilitas diri sendiri dengan melakukan tindakan murahan seperti itu… —- SELESAI —- Semoga metode ini bisa berjalan sesuai harapan kita bersama. . . ! ! ! Cara Cepat Menaikkan Pagerank mudah bukan? Beri tahu kepada kawan2 blogger yang lain agar pagerank anda naik, naik, dan terus naik.. << Kebenaran selalu ada satu.

Tags: Tips Blogger, Triks Blogger

Membuat Footer Banyak Kolom

Footer dalam template blog berfungsi persis dengan sidebar. Bisa untuk menempatkan widget, terutama untuk widget / gadget yang mungkin dianggap kurang penting. Mengapa saya sebut kurang penting, karena rata-rata widget di footer adalah widget yang kurang mendukung SEO. widget iklan misalnya, saya yakin teman-teman blogger memasang iklan adsense dan sejenisnya pasti di bagian header atau sidebar. sebetulnya banyak fungsi footer yang lain, jika disidebar blog penuh dengan iklan, bisa kita taruh widget recent posts, random posts ataupun follower. Dan bisa jadi jika kita tempatkan gadget di sidebar mungkin bisa membuat berat loading blog kita.

Oke, di bawah ini tutorial lengkap bagaimana cara membuat footer banyak kolom, di sini saya akan mencontohkan cara membuat footer 4 kolom.

Masuk ke akun Blogger sobat > Klik Design/Rancangan > Edit HTML
Backup Template sobat
cari kode ]]></b:skin>
sebelum kode ]]></b:skin> masukkan kode di bawah ini;

    #kaki {
    margin:auto;
    padding: 0px 0px 10px 0px;
    width: 100%;
    background:#333333;
    }
    #kaki-wrapper {
    background:#333333;
    margin:auto;
    padding: 20px 0px 20px 0px;
    width: 960px;
    border:0;
    }
    #kakibar-wrapper {
    background:#333333;
    float: left;
    margin: 0px 5px auto;
    padding-bottom: 20px;
    width: 23%;
    text-align: justify;
    color:#ddd;
    font: bold 12px Arial, Tahoma, Verdana;
    line-height: 1.6em;
    word-wrap: break-word;
    overflow: hidden;
    }
    .kakibar {margin: 0; padding: 0;}
    .kakibar .widget {margin: 0; padding: 10px 20px 0px 20px;}
    .kakibar h2 {
    margin: 0px 0px 10px 0px;
    padding: 3px 0px 3px 0px;
    text-align: left;
    border:0;
    color:#ddd;
    text-transform:uppercase;
    font: bold 14px Arial, Tahoma, Verdana;
    }
    .kakibar ul {
    color:#fff;
    margin: 0 auto;
    padding: 0;
    list-style-type: none;
    }
    .kakibar li {
    display:block;
    color:#fff;
    line-height: 1.6em;
    margin-left: 0 !important;
    padding: 6px;
    border-bottom: 1px solid #222;
    border-top: 1px solid #444;
    list-style-type: none;
    }
    .kakibar li a {
    text-decoration:none; color: #DBDBDB;
    }
    .kakibar li a:hover {
    text-decoration:underline;
    }
    .kakibar li:hover {
    display:block;
    background: #222;
    }

5. Kemudian cari kode </body> dan masukkan kode di bawah ini di atasnya kode </body>

    <div id='kaki'>
    <div id='kaki-wrapper'>

    <div id='kakibar-wrapper'>
    <b:section class='kakibar' id='kakibar1' preferred='yes'>
    </b:section>
    </div>

    <div id='kakibar-wrapper'>
    <b:section class='lowerbar' id='kakibar2' preferred='yes'>
    </b:section>
    </div>

    <div id='kakibar-wrapper'>
    <b:section class='kakibar' id='kakibar3' preferred='yes'>
    </b:section>
    </div>

    <div id='kakibar-wrapper'>
    <b:section class='kakibar' id='kakibar4' preferred='yes'>
    </b:section>
    </div>

    <div style='clear: both;'/>
    </div> </div>

6. Simpan template dan selesai.

Tampilannya nanti akan seperti gambar di bawah ini.

Modifikasi dan pengaturan footer;

untuk menambah atau mengurangi lebar seluruh widget silakan ubah lebar / width 960px; dan sesuaikan dengan lebar template sobat.
jika sobat ingin membuat 3 kolom saja hapus kode berwarna hijau di atas, namun juga sesuaikan ukuran widgetnya yang awalnya 23% menjadi 30%

<div id='kakibar-wrapper'>
    <b:section class='kakibar' id='kakibar4' preferred='yes'>
    </b:section>
    </div>

sedangkan jika ingin menambahnya menjadi 5 kolom copy saja kode di atas, kemudian ubah kakibar4 menjadi kakibar5, dan ubah persentasenya menjadi 16% atau 17%
Untuk mengubah warna background footer silakan sobat berimprovisasi sendiri, hehe atau masuk ke tool Kode warna untuk mengetahui kode warna yang diinginkan
Akhir kata Wassalam, selamat mencoba.

Tags: Tips Blogger, Triks Blogger

Mempromosikan blog baru

Tujuan orang nge blog tentu bermacam-macam, sekedar menyalurkan bakat menulis, menumpahkan uneg-uneg, promosi produk dan satu lagi cari duit. Nah untuk 2 yang terakhir ada beberapa langkah yang harus Anda lakukan agar traffic kunjungan menjadi ramai. Langkah-langkah ini saya kira wajib dilakukan buat Anda yang baru membuat atau memiliki blog.

Berikut ini beberapa langkah-langkah yang saya kira wajib dilakukan untuk mempromosikan blog yang baru dibuat. Tujuannya tentu saja agar kunjungan ke blog semakin ramai.

1. Setelah membuat blog dan beberapa pengaturan dasbor blog tentu kita membuat artikel. Buatlah 20 atau 30 artikel lebih dulu. Hal yang patut diperhatikan adalah tentukan niche blog, tentukan dan fokuskan tema khusus untuk blog Anda, misalnya blog Anda membahas masalah pendidikan fokuskan ke masalah tersebut.

2. Setelah langkah pertama selesai, Daftarkan blog Anda di Google, Yahoo dan search engine lainnya. Kemudian Submit atau kirim sitemap ke Google dan Yahoo. Submit sitemap tidak hanya sekali itu saja dilakukan, lakukan secara berulang setelah kita membuat artikel.

3. Buat Blog dummy, apa itu dummy blog. Sederhananya blog dummy adalah blog pendukung blog saat ini yang akan kita optimalkan. Tujuan utamanya adalah mencari backlink yang ditujukan ke blog utama yang akan diptimalkan. Dimana bisa membuat dummy blog? Bisa di wordpress, blogdetik, wywapblog dan situs penyedia blog gratisan lain.

4. Jalan-jalan ke blog lain. Kemudian tinggalkan komentar Selain untuk mempromosikan blog, berkomentar di blog lain juga berguna mencari backlink gratis. Pilih Nama dan URL saat meninggalkan identitas komentator agar backlink langsung mengarah ke blog

5. Daftarkan blog di website directory dan kirim artikel di situs social bookmarking. Mendaftarkan situs di blog directory dan social bookmarking bisa dilakukan setelah kita membuat akun.

6. Jika Anda belum memiliki akun facebook dan twitter segera buat. Mengapa? Promosi blog cukup efektif dilakukan di situs jejaring sosial. pengguna Facebook di Indonesia saja sudah lebih dari 40 juta. "Aneh" jika Anda seorang blogger namun tidak memiliki akun jejaring sosial.

7.Update artikel secara teratur, Saya tidak menargetkan berapa artikel per minggu atau per bulan. Paling tidak kamu bisa buat artikel setiap hari 1 artikel jika sempat.

Demikian beberapa tips SEO sekaligus cara promosi dan strategi meningkatkan pengunjung ke blog. Ada yang mau menambahkan???

Tags: Tips Blogger, Triks Blogger

Cara pasang iklan ditengah postingan Blog

Halo sobat blogger, pagi ini saya akan berbagi artikel mengenai Cara pasang iklan ditengah postingan blog . Bosen dengan memasang iklan hanya dibagian TATA LETAK (WIDGET) ? nah dengan tutorial ini kalian bisa memasang iklan ditengah postingan yang tentu saja akan lebih terlihat oleh pengunjung blog kalian.

Ikuti step dibawah ini :

1. Login ke Blogger -> Edit HTML
2. Backup dulu template Anda untuk jaga-jaga apabila terjadi kegagalan
3. Centang Expand Template Widget
4. Cari kode <data:post.body/> apabila Anda menemukan banyak kode seperti itu, pilih kode yang nomor dua
5. Kemudian ganti kode <data:post.body/> dengan kode dibawah ini:

<div expr:id='"iklan1" + data:post.id'></div>
<div style="clear:both; text-align:center; margin:10px 0">

<SCRIPT IKLANN KALIAN>

</div>
<div expr:id='"iklan2" + data:post.id'>
<data:post.body/>
</div>
<script type="text/javascript">
var obj0=document.getElementById("iklan1<data:post.id/>");
var obj1=document.getElementById("iklan2<data:post.id/>");
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(" ");
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+1);}
</script>

6. Save template, selesai

NB: BACK UP DULU TEMPLATE KAMU, JIKA NANTI ADA KEGAGALAN BIAR GA REPOT.

- Untuk kode yang berwarna hijau adalah letak posisi iklan ditengah, bisa diganti dengan:
posisi tengah kiri:

text-align:left

atau

float:left

Posisi tengah kanan:

text-align:right

atau

float:right

Sesuaikan aja mana yang cocok dengan template Anda.

Selamat mencoba tutorial Cara pasang iklan ditengah postingan blog

Tags: Tips Blogger, Triks Blogger

Menyimpan Widget Persis Dibawah header

Beberapa hari yang lalu ada bertanya “bagaimana cara menyimpan widget persis di bawah header?”. Memang pada umumnya pada template blogger tidak bisa untuk menyimpan widget atau elemen langsung di bawah header, biasanya hanya bisa menyimpan di atas elemen post namun tentu saja lebar dari elemen tersebut hanya selebar elemen post. Apakah ada cara agar kita bisa menyimpan widget atau elemen persis di bawah header? tentu saja bisa dan bahkan banyak cara untuk melakukan ini. Namun karena keterbatasan waktu dan tempat maka tidak akan kang rohman tulis semua di sini, kang rohman akan mencoba menerangkan dengan satu cara (soalnya sudah siang nih, mau kerja). Ingin tahu seperti apa caranya, yuk kita lanjut saja.

Silahkan ikuti langkah-langkah berikut :

Login ke blogger dengan id anda.
Klik Tata Letak.
Klik tab Elemen Halaman, lihat pada struktur layout template anda. Biasanya bagian header akan seperti ini :
Sekarang kita akan memodifikasinya, let’s go to party.
Klik Tab Edit HTML.
Klik Tulisan Download Template Lengkap, silahkan di backup dulu (penting).
Cari Kode yang mirip seperti ini :

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
Hapus kode di atas dan ganti dengan kode di bawah ini :
<b:section class='header' id='header' preferred='yes'>
Klik tombol Simpan template. Tunggu beberapa saat sampai template anda tersimpan.
Klik tab Elemen halaman. Dan sekarang layout template anda akan menjadi seperti ini :
Sekarang anda bisa menambahkan berbagai elemen langsung di bawah header.
Untuk menambah elemen halaman tinggal klik Tambah Elemen Halaman. Silahkan tambahkan apa yang anda mau, apabila sudah di tambahkan tinggal geser elemen yang baru di buat tadi ke bawah elemen header.
Klik Tombol SIMPAN yang ada di bagian atas.
Selesai, sekarang tinggal lihat hasilnya.

Ngacir dulu ah, sudah masuk jam kerja nih … kaburrrrrrr

Tags: Tips Blogger, Triks Blogger