Tips Memperindah Tulisan Artikel Di Blog

Pada tulisan saya kemaren bagaimana pentingnya sebuah perubahan dalam semua hal, dan akirnya saya sedikit mengubah style tulisan pada setiap postingan saya dengan 3 style yang berbeda. Tiga style tersebut adalah sub title, drop cap dan pullquote. Tulisan kali ini saya hanya ingin berbagi bagaimana membuat drop cap dan pullquote di blog sampean.

Drop cap
Maaf saya ndak ngerti banyak tentang apa itu css, dalam kesempatan ini saya hanya mengambil dari berbagai sumber salah satunya dari sini dan tentunya sedikit penyesuaian pada hasil akir di blog sampean nantinya. Coba sampean copy code css di bawah ini dan copy pada file atau letak css di blog sampean berada.

.drop_cap {padding: 0.17em 0.08em 0.05em 0;font-size: 3.4em;line-height: 0.6em;color: #000;float: left;}
.post .drop_cap {padding: 0.17em 0.08em 0.05em 0;font-size: 3.4em;line-height: 0.6em;color: #000;float: left;}

Lalu cara untuk memakainya hanya cukup menulis < span class=”drop_cap”>T< /span > disetiap awal postingan atau di mana sampean ingin menempatkan huruf yg ingin di posisikan sbg drop cap.

Pullquote
Nah selanjutnya sebuah elemen yang sering sampean lihat di majalah-majalah ataupun koran. Pullquote, disamping fungsinya sebagai penegas, penjelas, selipan motivasi atau apapun itu, juga bisa membuat pembaca tertarik membaca tulisan kita. Seperti halnya cara drop cap, kali saya juga hanya menambahkan style css berikut ini.

“Keteguhan hati merupakan elemen penting untuk meraih kesuksesan. Jika sampean mengetuk pintu dengan cukup kuat dan keras, sampean akan pasti berhasil membangunkan seseorang”

henry wadsworth lohgfellow

blockquote.left {
width: 200px;
margin: 5px 15px 5px 0;
font-size: 1.4em;
text-align: center;
color: #abafb9;
background: none;
border: none !important;
padding: 0 !important;
float: left;
}
blockquote.right {
width: 200px;
margin: 5px 15px 5px 0;
font-size: 1.4em;
text-align: center;
color: #abafb9;
background: none;
border: none !important;
padding: 0 !important;
float: right;
}
Cara untuk memasukan di setiap postingan hanya dengan menulis code ini di setiap dimana pullquote tsb akan di posisikan, < blockquote class=”left”>tulisan ada di sini< /blockquote >, jika ingin di posisi kanan tinggal ganti left ke right saja. Sumber dr sini

Untuk yang memakai wordpress, sebenarnya sudah ada plugin kusus untuk menangani pullquote ini. plugin bisa di dapatkan di sini. Namun menurut saya, selama manual masih bisa kenapa memakai plugins :) kasian blog banyak plugins yg bekerja maka juga akan kecapekan.

Posted in: komputer