Cara membuat Postingan Terbagi berkotak kotak melengkung


Postingan ini bisa dipadukan dengan postingan sebelumnya tentang "memebuat efek shadow pada postingan dan related post"

Postingan ini adalah pengalaman saya saat mulai nge blog. Saat belajar tentunya kita sering main ke blog orang yang udah memiliki desain yang udah cukup wahhh, dan mempunyai page rank tinggi dengan mimpi admin yang mempunya page rank tinggi tersebut mau mem back link blog kita. Nah saat kita mengunjungi blog orang tampak elegan, manis,rapi atau apalah gitu untuk mengungkapkannya pasti kita juga ingin blog kita juga dapat tampil seperti itu dan ditambah dengan rasa penasaran ingin tau bagaimana cara membuatnya. Dan setelah cari cari dan belajar dari blog para master, suatu hari  saya nemu satu artikel untuk memodifikasi postingan Terbagi berkotak kotak dan melengkung. Tapi saya lupa link blog master yang share toturial tentang ini. Klo da masternya yang baca maaf yahhh, he he . .


Ok de langsung ke TKP aja Yahhh . . .. !!! Tapi backup dulu tamplate kamu untuk menghindari hal yang tidak kita inginkan.



Berikut cara Postingan Terbagi berkotak kotak

1. Login ke blog anda > design >> Edit HTML

2. Cari kode .post { --> Tips cari cepat dengan F3 / Ctrl +F

3. Letakan kode berikut di bawah kode .post {



Background:white;

padding:10px;

margin:15px 5px 20px 0;


Keterangan :

Background:white; --> berarti posting memiliki background putih (sesuaikan dengan selera)

padding:10px; --> Jarak antara tulisan dengan tepi 10px

margin:15px 5px 20px 0; --> Jarak kotak posting atas 15px, kanan, 5px, bawah 20px, dan kanan 0 (Jarak ini dapat kamu sesuaikan dengan selera kamu yang tentunya harus di sesuaikan dengan blog kamu)

Save !!


Selanjutnya Untuk langkah agar kotak postingan tersebut tampak melengkung pada masing masing sudut nya kita dapat menambahkan Script berikut



-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
-border-radius: 10px;



Letakkan persis dibawah kode ini.

.post {
Background:#f5f5ee;


Keterangan :

#f5f5ee ------->> Adalah backgraund postingan, kamu dapat mengantinya sesuai dengan selera

10px --------->> Adalah tingkat besaran lengkungan kamu dapat mengantinya sesuai dengan selera

Artikel yang berkaitan "http://idcreativity.blogspot.com/2011/02/pasang-efek-shadow-pada-postingan-dan.html"
Lalu Save !!!

No comments:

Post a Comment