CARA MEMBUAT WATERMARK PADA TEMPLATE BLOGGER HASIL EDITAN SENDIRI

Contoh Gambar watermark pada dasbor Template blogger

Pada kesempatan dalam keterbatasan waktu yang saya miliki kami ingin berbagi cara membuat watermark pada template buatan kita. Eh bukan hanya template buatan tapi Tema hasil editan tapi untuk apa? Ya sekedar untuk menandai bahwa kita telah berhasil memoles gaya kita sendiri dengan cara merombak sebuah tema bawaan blogger misalnya. Anggaplah sebuah karya seni dengan tandatangan watermark dari kita sendiri.

Apa itu watermark? Pernah liat video hasil editan kita ada terdapat misalnya "made by VivaVideo" Watermark itu sebagai cap bahwa video tersebut dibuat menggunakan aplikasi vivavideo dan agar orang yang menonton video tersebut lebih mengenal vivavideo sebagai aplikasinya. Dia juga untuk menegaskan "hak paten" aplikasi pembuatnya (Jangan kuatir konten blog ini tidak akan menyinggung hak cipta - tapi kami minta support anda agar kami terus bisa berkarya untuk kepentingan sesama)

Nah pada templat blogger premium berbeli kadang kita mendapatkan "watermark" yang dibuat dengan menggunakan kode script. Banyak gaya dan model yang bisa kita terapkan sendiri namun mari kita mulai dengan memberikan kode watermark pada tema tema bawaan yang akan kita edit misalnya anda bisa memilih tema "SOHO, CONTEMPO dan EMPORIO bawaan blogger. Ini hanya buat percobaan saja ya..

Masuk ke dasbor blogger > pilih Tema > pilih edit HTML. Cari kode: ]]></b:skin> dan lalu letakan kode dibawah ini tepat dibawah kode ]]></b:skin> tadi:

<b:template-skin><![CDATA[
/*------Layout (No Edit)----------*/
body#layout #outer-wrapper{padding:0;width:1000px}
body#layout .section h4{color:#171717!important}
body#layout #topnav,body#layout .tm-head{height:auto}
body#layout .tm-menu{margin:0;width:70%}
body#layout .tn-right{height:auto}
body#layout .social-area{margin:0;width:100%}
body#layout .header-content,body#layout #header-blog{float:left;width:100%;height:auto;padding:0}
body#layout .header-logo,body#layout .header-ads{height:auto}
body#layout .header-logo{width:30%;    margin: 0 auto;padding:0}
body#layout .header-ads{width:70%;margin:0}
body#layout .header-random{display:none}
body#layout .header-menu{float:left;width:100%;margin:4px 0 0;padding:0}
body#layout #menu{display:block}
body#layout #content-wrapper{margin:0 auto}
body#layout #main-wrapper{float:left;width:70%;margin:0;padding:0}
body#layout #feat-sec .widget-content{display:block}
body#layout #ads-home{width:auto;max-height:none;margin-bottom:0}
body#layout #sidebar_tabs:before{content:"Sidebar Tabs";color:#fff;font-family:"Roboto", sans-serif;font-size:18px;margin-bottom:5px;display:block}
body#layout .sidebar-wrapper{float:right;width:30%;margin:0;padding:0}
body#layout #sidebar_tabs{overflow:hidden;background-color:#FFBA00;padding:10px;margin-bottom:10px;box-sizing:border-box}
body#layout .sidebar-wrapper .layout-widget-description{display:none}
body#layout #sidebar_tabs .tab-opt{padding:0;float:left}
body#layout #footer-wrapper{overflow:hidden}
body#layout .sect-left{width:28%;float:left}
body#layout #social-footer{width:30%;float:right}
body#layout .header-menu li.home-child,body#layout .uk-search-header,body#layout .FollowByEmail .widget-content:before{display:none}
body#layout #unwanted{display:none!important}
#layout:before {    content: 'property adedansasa.com';
text-transform: uppercase;
font-size: 20px;
color: #FF1493;
margin: 0 0 20px 0;
display: inline-block;
font-weight: 700;
padding: 20px;
font-family: sans-serif;
border: 4px double #FD856E;}
/*------Layout (end)----------*/

Silahkan hapus "property Adendansasa.com" dan ganti dengan watermark milik sendiri. Lalu Save html.
Maka pada template hasil editan kita akan terdapat cap watermark seperti tampilan pada gambar yang kami posting diatas tulisan ini.

Kita dapat merubah gaya watermark dengan mengganti warna, latar dan frame menjadi lingkaran, bujur sangkar atau bulatan dengan mengedit script tersebut diatas. Namun untuk saat ini cukup sebagai pelajaran dasar saja dahulu. 

Semoga bermanfaat.