Join The Community

Premium WordPress Themes

Selasa, 23 Agustus 2011

Membuat Modif Blackquote Blogger

Mungkin kebanyakan dari kita sudah tahu apa yang dimaksud dengan Blackquote tersebut, namun tidak dengan Blogger pemula yang baru membuat blog.... Nah, ane akan kasih contoh agar sedikit membantu pemahaman sobat tentang Blackquote itu sendiri.


Itulah yang dinamakan dengan Blackquote. Ane anggap sobat sudah mengerti. Sekarang kita masuk ke pembahasan tentang artikel ini. Untuk memodifikasi Blackquote default blogger dengan yang kita inginkan caranya cukup mudah, ikuti langkah-langkah berikut :

1. Login ke Blogger
2. Di Dasbor klik tab Template
3. Lalu Edit Template HTML
4. Centang pada Expand Widget Templates
5. Cari kode ]]></b:skin> (gunakan Ctrl+F atau F3 untuk memudahkan)
6. Copy dan Pastekan kode berikut tepat diatas kode ]]></b:skin>
.post-body blockquote {
margin: 10px 10px 10px 20px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;
color: #000000;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzoz0zKXDwjPu-8jYKVvsitAz2FYJs4yRlNvpEqOtfyorCGWRMC9Ax5phwYD4zNCImBuwHsZ9As3OyKabA53jOmD-rATQyEvD4rfGKClNR2CGNstWgm2aqRizBbmSsHFG7bCJPJUBGYds/s1600/45.jpg
) no-repeat left top;
border-left: 10px solid #666666;
}
7. Simpan Template.

Keterangan :

Kata yang dicoret adalah url gambar yang digunakan oleh sobat TB silah sobat ganti dengan url gambar yang sobat inginkan. Oyah kalau saat membuat postingan letak Blackquote itu seperti pada tampilan gambar ini :


Cara menggunakannya ada 2 cara :
1. Sobat blok dulu tulisan yang di beri Blackquote, lalu klik tanda Blackquotenya, atau
2. Sebelum menuliskan artikel, sobat klik terlebih dahulu tanda Blackquotenya

Semoga Bermanfaat,

Salam,




Senin, 22 Agustus 2011

Membuat Tombol Home, Bact to Top and Bottom

Assalamu Alaikum Wr. Wb.

Wah bentar lagi lebaran ni sob... uda pada beli perlengkapan lebaran belum??? hehehehe 
Kesempatan kali ini ane mau sharing tutorial tentang bagaimana Cara Membuat Tombol Home, Back To Top and Bottom di blog sobat. Sudah tahu kan maksudnya??? Lebih jelasnya liat gambar berikut :


Nah, kira-kira seperti itulah gambar dari Tombol Home, Top dan Bottomnya. Oyah hampir lupa, tutorial ini ane dapatnya dari sobat TB kalau sobat tertarik silahkan dipraktekin langsung :

1. Login ke Blogger
2. Setelah masuk ke Dasbor, Klik tab Template (ini untuk tampilan blog yang baru)
3. Klik Edit Template HTML
4. Centang pada Expand Widget Templates
5. Temukan kode berikut ]]></b:skin> (gunakan Ctrl+F atau F3)
6. Copy lalu Pastekan kode berikut diatas kode ]]></b:skin>
#mangetsu {
position:fixed;_position:absolute;bottom:0px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
#mangetsu a
{
filter:alpha(opacity=65);
-moz-opacity:0.65;
opacity:0.65;
border:0;
}
#mangetsu img
{
border:0;
}
#mangetsu a:hover
{
filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
}
7. Setelah itu cari lagi kode </body> lalu copy dan pastekan kode berikut diatas </body>
<a name='ngisor-dhewe'></a>
8. Terakhir masukan kode berikut dibawah kode </body>
<div id='mangetsu'>
<table border='0'>
<tr>
<td><a expr:href='data:blog.homepageUrl' title='Home'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6r9IBN4eoKfeDzptlpvgLfbhNc7DeRyeph5cI02068sb_exXZZppLYpK0lK1fH29xBhbxM2n5KMzbWDnCaZAEIvYnfQIVTxhSBUmXZvRFPZdHHx-6gLnlHJ-8uh8rkP643Ufkzpe-eA0/s320/home-icon2.png'/></a></td>
<td><a href='#' title='back to top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWKkmHKZiDdpap47rQqFW77abs1Mlc355p11DMCRN2gR1ZcTyJDEsueYOagYnAKZf-c7SazNmdHyAKXbOrGh0kTyk7rH3vq_Rj0BBNeygza8PYUGJ_8Ly1R-zeEQmEoxrHccDFnbInQXs/s320/pre-icon1.png'/></a></td>
<td><a href='#ngisor-dhewe' title='back to bottom'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUg0EKgAvRp_z56R-g6q4aKMB_fsSM_1nxEApcXIwd1SB3O8rtIR83P9A_7ahhkCJ2OKsFiGGrgUqHDAwzR2HZXZIWiiwUFKEWaMQgL22bbV5RGaZoU-Sv5v02UAUUDElx4XoD8kXFXMk/s320/next-icon2.png'/></a></td>
</tr>
</table>
</div>
9. Simpan.

Itulah sedikit banyak penjelasan bagaimana cara membuat Tombol Home, Top dan Bottom di Blog. Semoga dalam penerapannya tidak terjadi masalah alias mulus-mulus saja...... heheheh

Salam,


Modifikasi Background Buku Tamu dengan Gambar

Kali ini ane akan ngebahas tentang cara mendesign Background buku tamu dengan gambar. Pasti sobat semua ingin tahu tentang yang satu ini karena blog kita akan lebih kelihatan kreatif, yah walaupun bukan widget original kita sendiri... heheheh Sebenarnya widget ini milik sobat Dickeymaru tapi ane uda izin kok (belon dijawab sih tapi udah lancang_semoga empuhnya ijinin deh kan buat temen2 jg heheheh).... Caranya sih cukup panjang sob tapi jangan khawatir, tidak sulit sob..... Hanya saja ane tidak bisa mastiin trik bisa diterapkan dengan mengedit chatbox kita yang lama ato harus buat yang baru. Soalnya kalau ane sendiri langsung buat cbox yang baru sob....







Ok langsung saja.....
1. Login dulu ke Chatbox sobat sendiri
2. Klik Tab menu Look & Feel lalu Style Presets


3. Kemudian pilih Style Gallery yang Transparan


4. Kalau sudah, masuk lagi ke Layout Option




5. Ganti ukuran cbox kamu, contoh :
widht: 180
hight: 275
kosongkan centang pada Auto
form height: 117
No. of  messages to display : 20
klik Save


Setelah tahap diatas selesai, langkah selanjutnya adalah pengeditan kode cbox sobat
pada kode cbox sobat, cari kode <div id="cboxdiv" style="text-align: center; line-height: 0">

Kalau sobat sudah ketemu, ganti kode tersebut dengan kode dibawah ini :
<div id="cboxdiv" style="text-align:center; line-height:0;background-position:center;background:url(URL GAMBAR KAMU);width:180px;height:350px;background-repeat:no-repeat;">
pada tulisan yang berwarna biru, gantikan dengan url gambar sobat yang ingin dijadikan background cbox. Saran saya, cari gambar dengan menyesuaikan warna teks dari cbox sobat agar teks dapat dibaca.
Sekian tutorial dari saya, semoga bermanfaat..!!!

Salam,





Info Terbaru : Mendapatkan Backlink Yang Berkualitas.... Gratis!!!!

Link Gratis Berkualitas
Backlink Gratis dan Berkualitas adalah salah satu cara yang cukup pantas untuk dicoba demi mendapatkan One Way Backlink (Link Satu Arah) dengan cara mudah serta gratis. 

Ini adalah cara dahsyat untuk tukar link. Karena satu link yang kita pasang akan dibantu dipromosikan oleh 1 juta orang lebih hanya dengan mengajak 2 orang saja. Cukup mudah mengajak 2 orang untuk daftar, karena semua butuh promosi, setiap orang ingin linknya tersebar dengan cepat. Apalagi kalau lebih dari 2 orang… berapa link yang akan kita dapat n gratis lagi..


Oke kayak apa dan gimana caranya.. sobat tinggal daftar saja , tak ada ruginya untuk dicoba , gratis ini, disini link kita bisa nempel terus, link yg dimasukan bisa judul postingan dan URL nya agar tiap page punya pagerank juga.. kan biasanya PR kita hanya di halaman depan saja, sementara di halaman posting gak punya PR.


Kalau berminat cukup Mendaftar. Setelah itu silahkan cek password yang dikirim ke email anda, kemudian langsung login dan pasang judul artikel, keterangan dan URL link yang ingin dipromosikan pada Website ini. Oh ya … kita juga akan mendapatkan web replikanya untuk kita promosikan lho.. Sebagai contoh saya persembahkan postingan tentang Info Terbaru : Mendapatkan Backlink Yang Berkualitas.... Gratis!!!!, salah satu Cara mudah meningkatkan Traffic dan Pegerank blog kita.


Selanjutnya tinggal buat sebuah postingan seperti ini atau silahkan copy paste artikel ini (Yang dicetak miring) untuk di blog sobat dan rasakan manfaatnya.


Untuk mendaftar silahkan klik Mendapatkan Backlink Yang Berkualitas disini , kemudian scroll kebawah lalu klik “ Sign Up Now Free “ atau Klik Untuk Mendaftar.


Selamat mencoba tips Mendapatkan Backlink Yang Berkualitas ini .

Ayo sobat... sekaranglah saatnya kita berusaha untuk meningkatkan PR blog kita. Tidak ada salahnya untuk terus mencoba hal baru.....

Salam,



Minggu, 21 Agustus 2011

Membuat Link Mengeluarkan Efek Bintang

Temanya hampir sama ni sob...,,masih di mempermak Link blog kita biar kelihatan lebih kreatif. Kalau postingan yang sebelumnya kan tentang Membuat Link Mengeluarkan Warna Pelangi nah postingan kali masih nuansa angkasa sob Membuat Link mengeluarkan Bintang. Wah keren nggak tuh.... heheheh 

gambar

Ok, untuk cara membuat Link bisa mengeluarkan efek Bintang cara gini :
1. Login ke Blogger
2. Klik tab Tata Letak/Layout
3. Klik Edit HTML
4. Centang kolom Expand Widget
5. Cari kode a:hover{ yang berdekatan dengan kode a:link{ atau a:visited{
6. Letakkan kode berikut dibawah kode a:hover{
 background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY81fCxN2MzWiL_ZPPWnQkvDF7etuRKziCPU_Gf8P0t5e6im-qzYeVW7KURxr2iqPMwAzsbYN3p0Dxje1hqjzi82_OshLueioc14Cpn-u66X5nkUfySXBzSHrXyxr7E1y1TnJ3I9So8Ac/s1600/stars.gif);}
Hasilnya akan seperti ini :
a:hover{  background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY81fCxN2MzWiL_ZPPWnQkvDF7etuRKziCPU_Gf8P0t5e6im-qzYeVW7KURxr2iqPMwAzsbYN3p0Dxje1hqjzi82_OshLueioc14Cpn-u66X5nkUfySXBzSHrXyxr7E1y1TnJ3I9So8Ac/s1600/stars.gif);}
7. Klik Save dan silahkan sobat lihat hasilnya di blog sobat..!!! Gimana??? Berhasilkan penerapannya..... ^_^


Membuat Link Warna-Warni


Tambahan baru buat perlengkapan blog kita.. Sangat sesuai buat sobat yang senang mendesign blognya dengan berbagai macam aksesoris... Nah kali ini, ane mau bagi informasi tentang bagaimana cara membuat Link-link diblog kita bisa mengeluarkan warna pelangi ketika disorot pointer....

Tertarik apa nggak ini??? Bagi yang tidak tertarik yah monggo disimak saja kan tidak rugi..... hehehe !!! Bagi yang tertarik, nih ane kasih tutor nya... Gampang kok sob.....




1. Login ke Blogger
2. Klik tab Tata Letak/Layout
3. Klik Edit HTML
4. Cari kode ini </head> gunakan Ctrl + F biar lebih memudahkan
5. Copy dan Paste kode berikut dibawah kode </head> 
<script src='http://h1.ripway.com/Chumhienk/rainbow.js'/>
6. Terakhir klik Save.... Beres deh... Gampang kan???? ^_^


Oyah... kalau sobat pengen punya script sendiri biar nggak pake punya orang lain. Sobat download dulu filenya disini

Kalau sudah sobat Extract filenya agar menjadi file java (.js). Setelah itu upload filenya di wab hosting sobat kemudian ambil urlnya. Contohnya seperti punya ane http://h1.ripway.com/Chumhienk/rainbow.js nah kode itulah yang harus sobat ganti dengan url java sobat sendiri... Ngerti kan maksudnya???
<script src='http://h1.ripway.com/Chumhienk/rainbow.js'/>
Yang berwarna hijau itu gantikan dengan url java sobat.....


Sabtu, 20 Agustus 2011

Color Codes

Hexadecimal HTML color codes

#FFFFFF
#FFFFCC
#FFFF99
#FFFF66
#FFFF33
#FFFF00
#FFCCFF
#FFCCCC
#FFCC99
#FFCC66
#FFCC33
#FFCC00
#FF99FF
#FF99CC
#FF9999
#FF9966
#FF9933
#FF9900
#FF66FF
#FF66CC
#FF6699
#FF6666
#FF6633
#FF6600
#FF33FF
#FF33CC
#FF3399
#FF3366
#FF3333
#FF3300
#FF00FF
#FF00CC
#FF0099
#FF0066
#FF0033
#FF0000
#CCFFFF
#CCFFCC
#CCFF99
#CCFF66
#CCFF33
#CCFF00
#CCCCFF
#CCCCCC
#CCCC99
#CCCC66
#CCCC33
#CCCC00
#CC99FF
#CC99CC
#CC9999
#CC9966
#CC9933
#CC9900
#CC66FF
#CC66CC
#CC6699
#CC6666
#CC6633
#CC6600
#CC33FF
#CC33CC
#CC3399
#CC3366
#CC3333
#CC3300
#CC00FF
#CC00CC
#CC0099
#CC0066
#CC0033
#CC0000
#99FFFF
#99FFCC
#99FF99
#99FF66
#99FF33
#99FF00
#99CCFF
#99CCCC
#99CC99
#99CC66
#99CC33
#99CC00
#9999FF
#9999CC
#999999
#999966
#999933
#999900
#9966FF
#9966CC
#996699
#996666
#996633
#996600
#9933FF
#9933CC
#993399
#993366
#993333
#993300
#9900FF
#9900CC
#990099
#990066
#990033
#990000
#66FFFF
#66FFCC
#66FF99
#66FF66
#66FF33
#66FF00
#66CCFF
#66CCCC
#66CC99
#66CC66
#66CC33
#66CC00
#6699FF
#6699CC
#669999
#669966
#669933
#669900
#6666FF
#6666CC
#666699
#666666
#666633
#666600
#6633FF
#6633CC
#663399
#663366
#663333
#663300
#6600FF
#6600CC
#660099
#660066
#660033
#660000
#33FFFF
#33FFCC
#33FF99
#33FF66
#33FF33
#33FF00
#33CCFF
#33CCCC
#33CC99
#33CC66
#33CC33
#33CC00
#3399FF
#3399CC
#339999
#339966
#339933
#339900
#3366FF
#3366CC
#336699
#336666
#336633
#336600
#3333FF
#3333CC
#333399
#333366
#333333
#333300
#3300FF
#3300CC
#330099
#330066
#330033
#330000
#00FFFF
#00FFCC
#00FF99
#00FF66
#00FF33
#00FF00
#00CCFF
#00CCCC
#00CC99
#00CC66
#00CC33
#00CC00
#0099FF
#0099CC
#009999
#009966
#009933
#009900
#0066FF
#0066CC
#006699
#006666
#006633
#006600
#0033FF
#0033CC
#003399
#003366
#003333
#003300
#0000FF
#0000CC
#000099
#000066
#000033
#000000
#465584
#EEF2F7
#3A4F6C
#00D
#434951
#555
#777
#DFE6EF
#345487
#F5F9FD
#3860BB
#BCD0ED
#C2CFDF
#F0F5FA
#D1DCEB
#003
#900
#CCE9FD
#E4EAF2
#4C77B6
#DFE6EF
#EEF2F7