Modifikasi

Showing posts with label Modifikasi. Show all posts

Cara Ganti Blockquote Modifikasi di Blogger

type='html'>

Di dalam posting blogger pada menu ada tombol seperti di atas. Tombol tersebut adalah menu untuk membuat blockquote. Apasih blockquote itu? Menurut sejuta trik blogger blockquote berarti petikan posting. Blockquote memperjelas apa yang kita posting di blogspot. Misalnya kita memposting beberapa sub judul. Dalam sub judul itu kita dapat memperjelas dengan petikan posting yang kita sebut sebagai blockquote. Mari kita bahas cara ganti blockquote modifikasi di blogger

Secara default atau bawaan, blockquote di tunjukkan kurang lebih seperti ini

Dari gambar di atas, kode dalam membuat blockquote bawaan kurang lebih adalah di bawah ini

.blockquote {
margin: 10px 10px 10px 20px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;
color: #000000;
background: #e0ffff;
border: 2px solid #4aa02c;
border-left: 20px solid #4aa02c
}

.......

Dan pada saat posting (Posisi Edit HTML) adalah

Disini Text Anda

Jika sahabat tidak suka dengan blockquote bawaan blogger dan ingin merubah blockquote bawaan blogspot dengan style modifikasi berikut ini caranya

1. Login di blogspot

2. Sahabat akan di bawa ke dashboard.

3. Klik Menu Design seperti gambar di bawah ini :

4. Klik Template

5. Backup dulu template sobat dengan klik tombol seperti di bawah ini

6. Klik edit HTML

7. Klik Proceed

8. Centang Expand Widget Template

9. Cari kode blockquote seperti ini (Biasanya 2 baris) :

.blockquote {
margin: 10px 10px 10px 20px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;
color: #000000;
background: #e0ffff;
border: 2px solid #4aa02c;
border-left: 20px solid #4aa02c
}

.......

10. Hapus semua kode tersebut dan ganti dengan pilihan kode berikut :

a. Blockquote dengan background kertas bergaris

.post blockquote {
background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPhyZvcsODL1L_P5BnUBEIVMJ1j2NEpKJm7d-ZaFh4TzGho7IMfydbtImLi7X9DyRS8SvOKsa68UjNLZnyR_WuxFCxrc2sZr78bQeo9XkuF6pTQK2Byx0W4rydVS7LRA6I0RDwCui4gp8/s1600/notebook-with-numbers.gif) repeat-y;
margin: 0 20px;
padding: 0px 20px 5px 55px;
color:#7a7a7a;
font: bold 0.9em "Comic Sans MS", verdana;
line-height: 153%;
}
.post blockquote p {
margin: 0;
}

Ket : ubah kode yang ditandai dengan warna-warni di atas sesuai selera sobat. Untuk ganti background gambar, Tinggal klik kanan dan klik simpan lokasi gambar. Dan berikut pilihan backgroundnya :

b. Blockquote efek timbul dan shadow

.post blockquote {
    border:5px #dcdcdc solid;
    background:#f6f6f6 url(http://www.opendrive.com/files/7045660_cNVdE/quote.png) 0px 0px no-repeat;
    padding:7px;
    padding-left:65px;
    margin:20px 0;
    }

    blockquote:hover {
    border:5px #f2f2f2 outset;
    color:#000
    background:#f2f2f2 url(http://www.opendrive.com/files/7045660_cNVdE/quote.png) 10px 15px no-repeat;
    -moz-box-shadow: 0 0 40px #B0C4DE;-webkit-box-shadow: 0 0 40px #B0C4DE;box-shadow: 0 0 40px #B0C4DE;
    color:#000;
    }

    .post blockquote p {
    margin: 0;
    padding-top:10px;
    }

c. Blockquote dengan scrool

Untuk blogquote dengan scrool, cara pembuatannya adalah manual seperti membuat text area. Yaitu dengan kode berikut ini pada posisi Edit HTML saat posting.

height:200px;padding:10px;background:black;color:lime;">
Disini Text Anda

Keterangan :
Image by : Drupal.org
Trick by : My Blogger Trick

Saya lebih suka Cara Ganti Blockquote Modifikasi di Blogger untuk menampilkan kode html dengan blockquote dari pada dengan text area. Mohon maaf tidak disertai dengan demo nyata. So, silakan tentukan pilihan sobat.

Happy Blogging!
by. Sejuta Trik Blogger
Thanks for reading !

Modifikasi Link Judul Posting Dengan Keterangan

type='html'>Sebenarnya masih banyak tutorial tentang modifikasi judul link. Tanpa basa basi langsung saja trik modifikasi link judul posting dengan keterangan.

Klik Rancangan/Design kemudian Edit Html dan klik kotak kecil Expand Template Widget

Cari kode dibawah ini

Silahkan hapus dan ganti dengan kode ini

Lanjut dengan mencari kode dibawah ini

Hapus dan ganti dengan kode ini

Simpan Template. (Contoh : Letakkan kursor mouse sobat di halaman judul di atas. Tunggu beberapa detik maka akan muncul keterangan sesuai judulnya)

Kata para master modifikasi link judul posting dengan keterangan akan memperkuat seo blog kita. Dengan adanya keterangan pada judul posting blog kita tentunya menjadi no 1 di google akan semakin cepat! So, selamat berbloging.

Happy Blogging! by. Sejuta Trik Blogger

Modifikasi tampilan blogroll

type='html'>Sudah beberapa hari ini saya nggak posting, lagi sibuk dengan dunia nyata, oke dari pada mikirin ntu lebih baik modif tu tampilan blogroll sobat, hehehe.ni saya kasi blogroll ini mengikuti ukuran width: 96% jadi kalo di letakkan pada sidebar gak akan sebesar ini. ni langsung aja saya masukkin demonya.. CEKIDOT

Modifikasi form komentar blog

type='html'>

ok.. hari ini ane mau kasi tau cara memodifikasi form komentar blog biar keren gitu...langsung aja kalo mau liat DEMO nya ada di form komentar blog ane tu komen.. hehehe..ngarep..nggak ngomen juga nggak apa apa.. langsung aja ya.... cara pembuatannya..

Loggin Blogger
Rancangan,Edit html,
Cari kode
Ganti dengan
Lalu cari kode ]]>

Letakkan kode berikut diatasnya

.blok-komentar{
background: url(http://url gambar kamu.gif)repeat;
margin-left:10px;
text-align:left;
width:860px;
border:3px solid #0000ff;
padding:10px;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

biar lebih keren waktu mouse mengarah padanya.. letak kode ini juga di bawah kode tadi

.blok-komentar:hover{background: url(http://url gambar kamu.gif)repeat;
}

oke udah simpah ya...
lihat hasilnya..

semoga bermanfaat...tunggu posting saya selanjutnya

Source : awalnya dari http://mbahqopet.blogspot.com tapi sedikit saya ubah

ISIROK (BUKAN CELANA DALAM WANITA)

Pages

Cara Ganti Blockquote Modifikasi di Blogger

Modifikasi Link Judul Posting Dengan Keterangan

Modifikasi tampilan blogroll

Modifikasi form komentar blog

Blog Archive