CARA MEMBUAT WATERMARK UNTUK LAY OUT CONTEMPO HYBRID MENGGUNAKAN CSS

Gambar watermark contempo hybrid

Mendesain  tampilan sebuah lay out template tidak kalah pentingnya dengan tampilan jadi sebuah template blog. Tampilan lay out akan mencerminkan kepiawaian desainernya dalam menciptakan sebuah tema atau template blogger. Oleh karena saya menggratiskan Template buatan saya Contempo Hybrid ini, saya juga akan membongkar semua triknya kepada sobat yang berminat terhadap desain template.

Gambar diatas adalah Lay Out Contempo Hybrid dan boleh dikatakan saya telah membuang lebih separoh gagdet bawaan tema contempo dan menambahkan separoh gagdet atau widget klasik pilihan yang terbaik untuk membentuk template yang satu ini. Saya juga telah mengkompres kode kode yang saya tambahkan kedalam HTML, satu satunya ganjalan paling serius pada loading kecepatan tema ini adalah ukuran gambar yang sebagian "enggan" saya kecilkan karena pertimbangan estetika.

Kalau sobat perhatikan pada gambar (ditunjukan oleh marking anak panah warna merah) kanan atas lay out saya juga telah menempatkan sebuah watermark cantik, jika sobat ingin membuatnya cukup melalui cara berikut:

  1. Masuk kepengaturan blogger
  2. Pilih tema
  3. Pilih Edit HTML
  4. Cari kode:

]]></b:skin>
<b:template-skin>
<![CDATA[
Yang sobat cari itu sebenarnya adalah kode yang telah saya sorot warna kuning, karena tepat dibawah kode tersebut sobat pastekan kode dibawah ini:

body#layout, body#layout div.section {
font-family: Arial, sans-serif;
}
body#layout {
max-width: 1040px;
}
body#layout .sidebar-sticky {
z-index:0;
}
body#layout #wrapper {
overflow: unset;
}
body#layout #header-container {
height: auto;
}
body#layout:before {
content: "ContempoHybrid v.01";
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 1;
    padding: 10px 20px;
    font-size: 18px;
    color: #87CEEB;
    background: #FFE4E1;
    border-radius: 20px;
    border: 1px solid #d6d6d6;
}
body#layout .widget-content {
box-shadow: none;
}

Save template. Perhatikan kode yang saya sorot merah pink yakni: ContempoHybrid v.01 Silahkan sobat ganti dengan nama template hasil desain sobat sendiri. Kode ini dapat dipasang pada template contempo biasa dengan cara yang sama sperti petunjuk diatas.

Kode ini juga terpasang pada template template premium yang harganya selangit, dan seperti sobat lihat kode ini menghasilkan watermark yang indah.

Jika sobat ingin merobah warna tulisan silahkan ganti kode HEX yang saya sorot biru dan jika sobat ingin merobah warna latar watermark silahkan sobat ganti kode HEX yang saya sorot warna kuning.



Comments

  1. kalo saya sih tinggal pake aja bang tempaltenya, kalo edit ato tambah apa gitu masih rada bingung :D

    ReplyDelete
    Replies
    1. ok deh...tinggal pesan sama saya yang model apa gratis he he he

      Delete

Post a Comment

🌐请给我们一个礼貌的评论与任何相关的主题
⚘⚘Kami menghargai semua masukan
👫👫 Namun kami juga menjunjung tinggi kesopanan

Popular Minggu ini:

MEMPERBAIKI ADD NUMBERING DAN ADD BULLETS YANG TIDAK BISA TAMPIL PADA POSTINGAN BLOG

AUTODIDACT, WHY YOU FAIL TO PERFORM IT

INI DIA UKURAN GAMBAR TERBARU YANG IDEAL UNTUK KONTEN BLOG AMP