Hello everyone, on this occasion I will share how to make automatic watermarks on images in blogger using CSS. A watermark is a copyright sign that can be in the form of writing or a logo aimed at protecting our work so that it cannot be reused or distributed without permission.
The watermark that I will share here uses css, and will automatically add a watermark on every image on the blog, like it on the post page homepage and related posts.
But keep in mind this watermark only uses css which means it's not permanent, if your image is downloaded then the watermark won't come or it won't exist, so if your image is found in the browser then your image has no watermark.
So it's not 100% of your images can be protected with this watermark, more precisely this is just to beautify the appearance, if you want to protect your images I recommend using a photo editor to make it permanent.
Keep in mind that it is possible that not all templates can match this css, because each template can have a different thumbnail class name, so a basic css understanding is needed here because you have to be able to adjust the class to the template you are using, ok make those of you who want to make it, let's see how below.
How to Create an Automatic Watermark for Blog Post Images.
Open your blog which will be given a watermark.
Click the Theme Menu and look for Edit HTML on your blog.
Enter the watermark code below before the code ]]></b:skin>.
Then click save theme.
.separator{position:relative}.separator::before{content:"TRICKPK.COM";color:#fff;font-size:12px;font-weight:bold;position:absolute;right:0px;bottom:18px;border :1px solid #3a3a3a;border-top-left-radius:10px;;background-color:#3a3a3a;padding:4px;opacity:.6;height:24px;line-height:14px}
View one of the posts on your blog, the watermark will automatically appear in the post image.
Automatic Watermark Code Image Description
Replace this word TRICKPK.COM with the name of your blog.
-
If you want to change the background-color, change this to #3a3a3a.
-
To clarify the appearance of the watermark, increase the opacity:.6, the larger the value, the clearer it will be. must remember the opacity value 0 to 1, for example opacity:.9 or opacity:.4
Ok, That's my tutorial on 'How to Create an Automatic Image Watermark for Blog Posts' to add image tags to your blogger posts.
Good luck and it works, Thank you.