Cara Membuat dan Memasang Garis Warna-Warni Di Blog

Cara Membuat dan Memasang Garis Warna-Warni Di Blog - Suasana yg cerah, Tut-Blogger kembali berganti template, menurut sobat gimana ? apakah ada perubahan dengan kecepatan blognya atau sama saja? hehe.. hanya sobat yang tau ya.

Pada kesempatan kali ini saya ingin membagikan sebuah tutorial, bagaimana sih "Cara Membuat dan Memasang Garis Warna-Warni Di Blog" . Garis ini lagi populer di kalangan template-template para blogger profesional di Indonesia. Contoh template yang menggunakan garis warna-warni tersebut diantaranya :

• Brosense Responsive (Mas Sugeng)
• FiSEO Magz V2 (Dian AnaR-chyta)
• Ridwan-Hex (Abdul Ajiz Ridwanz)
• dan template-template keren lainnya yang tidak bisa saya sebutkan satu persatu.

Cara Membuat dan Memasang Garis Warna-Warni Di Blog

Untuk caranya itu kita sangat mudah sekali, hanya mengedit di bagian CSSnya saja dan menambahkan atau menyisipkan beberapa script. Udah penasaran kan gimana buatnya, Yuk disimak kawan..

1. Pertimbangkan dimana sobat ingin meletakkan garisnya, ingin di atas/bawah Header, atas/bawah Menu, atas/bawah Footer. Di Tut-Blogger saya memasang dibagian bawah Header dan diatas Footer

2. Jika sudah ingin meletakkannya dimana, sekarang sobat klik dibagian Header/Menu/Footer lalu klik Inspect element. Saya membuatnya di Header jadi saya klik dibagian Header lalu klik Inspect element. Lalu akan muncul sebuah menu yang muncul dibagian bawah.

3. Disini Header saya bernama header-wrapper, jika saya sentuh maka bagian header akan membentuk bayang-bayang.

4. Kita lihat dibagian CSSnya (header-wrapper) disebelah menu kanan bawah menu inspect element. Disitu terdapat warna Background saya.

5. Setelah itu tambahkan script ini setelah script warna background tadi sebelum  " ; "
contoh: warna background saya itu #15467, lalu tambakan script yang berwarna orange itu

#header-wrapper {background: #15467D url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEoFMGLzUfYJQjs3UUACeay6RhYXQrjwHSqbm-YHwBEqcmAtwFDSvbYQh4X5f6bRMO_eiWs1vufpotLeI5E732N8DEn-Nrr91prDsvix_56JoW4qpLc8-dUv-WgArpTFbXsdhW9j8xNB6Q/s1600/line.png) repeat-x bottom center;  margin: 0; padding: 5px 10px; height: auto;}

 **
warna merah : warna background header-wrapper saya (tidak diganti,biarkan saja sesuai warna backgroudn anda )
warna orange : script yang harus ditambahkan setelah background: #15467D (tambahkan script yang warna orange)
warna biru : untuk meletakkan dimana gambar ingin diletakkan diatas/bawah (atur sesuai keinginan)
Cara Membuat dan Memasang Garis Warna-Warni Di Blog

6. Klik preview untuk melihat apakah sudah saja atau tidak, jangan lupa backup template mu jika terjadi hal yang tidak diinginkan,jangan lupa Save.


Demikian tutorail kali ini, jika bingung anda berkenan bertanya dikomentar,semoga bermanfaat ya..
Cara Membuat dan Memasang Garis Warna-Warni Di Blog