Watermark adalah sebuah tanda yang kita pakai untuk menandai sebuah gambar maupun video. Watermark biasa terdapat pada gambar maupun video yang ditandai dengan text maupun logo sebuah perusahaan pemilik hak cipta.

Dalam proses pembuataannya, watermark ini dibuat secara manual, namun, pada kesempatan kali ini saya akan memberi tahu cara membuat watermark secara otomatis.

Dengan adanya cara ini tentunya akan sangat membantu, karena tidak perlu harus mengedit gambar satu persatu, apalagi jika gambar dalam jumlah banyak, pasti akan sangat mengesalkan.

Baca Juga: Seberapa Penting Sih SSL Bagi Keamanan Website?

Namun, perlu diingat tutorial ini hanya untuk blog non-AMP dan watermark pada tutorial ini hanya akan terlihat jika gambar dilihat melalui blog saja, artinya jika kamu mendownload gambar tersebut, watermarknya tidak akan terlihat.

Baca juga: Cara Membuat Watermark Otomatis pada Gambar di Blog AMP

Cara membuat watermark otomatis pada gambar di blogger ini terbilang mudah, kamu hanya perlu copy paste kode yang ada di bawah ini.

Cara Membuat Watermark Otomatis pada Gambar di Blog

1. Buka dashboard blogger kamu.
2. Pilih menu Tema > Edit HTML.
3. Tempel kode berikut di antara <style> dan </style>.
.separator{position:relative}.separator::before{content:"BangOpit ID";color:#fff;font-size:12px;font-weight:bold;position:absolute;right:0px;bottom:8px;border:1px solid #3a3a3a;border-top-left-radius: 10px;;background-color:#3a3a3a;padding:4px;opacity:.8;height:14px;line-height:14px}code-box
Jangan lupa untuk mengganti BangOpit ID dengan nama blog kamu.

4. Simpan Tema dan lihat hasil gambar yang sudah ada watermarknya.

Preview/preview/button

12 تعليقات

Peraturan Berkomentar
1. Jangan menggunakan kata-kata kotor dan kasar
2. Jangan menyertakan link dalam berkomentar
3. Jangan membahas keluar topik, jika keluar topik sebaiknya gunakan Contant Form yang disediakan

  1. Ketika kita share ke Medsos, yg tampil yg mana Bang ???

    Yg asli, atau yg sudah ber WM ???

    ردحذف
    الردود
    1. Yang asli mas, munculnya watermark hanya ketika dilihat di blog, waktu di share maupun di download watermark nya ga ada.

      حذف
    2. Ohhh jd bgtu....
      Ok dah, btw cari info donk WM yang auto nempel ketika dishare... Hihiiiii.....

      حذف
    3. kalo biar ada watermarknya saat di share, satu-satunya cara ya harus di edit mas...

      حذف
  2. tinggal tempel di HTML aja itu ya min ke dalam template kita, apa di bagian gambar,kok di blog saya gagal mudeg, atau setiap post selipin gambar WM perlu di bagian ALT atau yang lain mohn bimbingnya soal pemula aku nih

    ردحذف
  3. kok saya kurang paham ya mas, maff pemula tolong di cek coba, apa sudah ada WM nya di ourbeim[.]blogspot[.]com

    ردحذف
    الردود
    1. belum ada mas, script CSS yang saya bagikan di atas. mas sisipin di antara tag style mas

      حذف
  4. Kagak pas scriptnya?
    WM malah dibelakang gmbar
    ada kah solunya?

    ردحذف

إرسال تعليق

Peraturan Berkomentar
1. Jangan menggunakan kata-kata kotor dan kasar
2. Jangan menyertakan link dalam berkomentar
3. Jangan membahas keluar topik, jika keluar topik sebaiknya gunakan Contant Form yang disediakan

أحدث أقدم