Wednesday, May 21, 2014

Cara Membuat Blockquote Blog Keren dan SEO

Perlu diketahui bahwa blockquote biasanya digunakan untuk menonjolkan sebuah kalimat penting dalam sebuah artikel atau tulisan.

Untuk membuat blockquote keren dapat dilakukan dengan dua cara yaitu memasukkan kode CSS kedalam kode HTML blog atau dilakukan secara manual ketika membuat sebuah tulisan dan mengetikkan kode CSS tersebut kedalam mode HTML.

Untuk cara yang pertama yaitu memasukkan kode CSS kedalam kode HTML blog akan membuat blockquote secara otomatis setiap kita membuat blockquote dengan melakukan klik pada ikon Quote ( " ). Sedangkan cara yang kedua dapat dikatakan sebagai cara manual mungkin lebih fleksibel karena kita dapat membuat bermacam-macam blockquote dalam sebuah artikel.

Untuk lebih jelasnya mungkin contoh kode membuat blockquote keren berikut bisa memperjelas penjelasan tersebut diatas.


CARA MEMBUAT BLOCKQUOTE KEREN - PERTAMA

1. Masuk kedalam akun blog
2. Pilih menu Template
3. Klik Edit HTML
4. Masukkan kode CSS berikut dibawah kode <b:skin><![CDATA[

/*BlockQuote*/.post blockquote {margin-left: 15px;padding: 5px 5px 5px 10px;background: #FBE9A1;border: #01B1D3 solid 1px;font: normal 12px/14px Monaco, Monospace;border-left: #01B1D3 solid 5px;position: relativeoverflow:auto;}.post blockquote[rel] {padding-top: 25px;}.post blockquote[rel]::before {content: attr(rel);font: bold 12px/22px Arial, Sans-Serif;color: white;background-color: #b4a97e;padding: 0 10px;position: absolute;top: 0;right: 0;left: 0;text-transform: uppercase}
Keterangan:
  • background: #FBE9A1;  >> bisa diganti dengan background: #warna Anda;
  • border: #01B1D3 solid 1px; >> bisa diganti dengan border: #warna Anda solid 1px;
  • border-left: #01B1D3 solid 5px; >> bisa diganti dengan border-left: #warna Anda solid 5px;
Mudah kan?
Selamat mencoba.
Terimakasih telah membaca artikel Cara Membuat Blockquote Blog Keren dan SEO dan Terimakasih telah berkunjung.
Semoga bermanfaat.
Posted By: Dunia Kucing

Cara Membuat Blockquote Blog Keren dan SEO

Share:

Post a Comment

Facebook
Blogger

:) :( ;) :D :-/ :x :P :-* =(( :-O X( :7 B-) #:-S :(( :)) =)) :-B :-c :)] ~X( :-h I-) =D7 @-) :-w 7:P 2):) :!! \m/ :-q :-bd ^#(^

No comments:

Post a Comment

Follow Us

Get this gadget at facebook popup like box
© DEMO ERDIE BLOG | All rights reserved | Designed by