How To Add Text Watermark To Blogger

I founded too many questions for adding Watermark to blogger but no proper solution for it, so I decided to create tutorial for my users to add text watermark to blogger. Watermark helps you to reserve your content copyrights and to relate your blog content with your name or brand. If you want to add horizontal, vertical or diagonal text watermark to blogger just follow the given step by step tutorial with images and demo.

Steps : Adding Text Watermark to Blog Posts

DEMO

Step 1. Log in to your Blogger account, then go to Template > Edit HTML.

Step 2. Click anywhere inside the code and search for following code ( CTRL+F ) :

<data:post.body/>

Step 3. Replace the code with this code :

Note : Their will be two codes replace both.

<div class='hbzwatermark'><data:post.body/></div>

Step 4. Again click anywhere inside the code and search for following code :

]]></b:skin>

Step 5. Place this code just above it :

.hbzwatermark { background: transparent url("https://2.bp.blogspot.com/-x3m5Qr2P3UA/Vu7cNIfcUcI/AAAAAAAAAds/1ziODMCywIgVlr3quFx0SBtPmAYp74T7g/s1600/transparent_text_effect%25282%2529.png") repeat scroll 0% 0% / 200px auto; }

Step 6. Configuration :

• Replace https://2.bp.blogspot.com/-x3m5Qr2P3UA/Vu7cNIfcUcI/AAAAAAAAAds/1ziODMCywIgVlr3quFx0SBtPmAYp74T7g/s1600/transparent_text_effect%25282%2529.png  with your watermark text image URL.
• Adjust the value 200 to adjust the size of the watermark text.

To Create Watermark Text Image Click here.

• For Diagonal Watermark set 'Text rotation' = -45
• For Horizontal Watermark set 'Text rotation' = 0
• For Vertical Watermark set 'Text rotation' = 90
• For Watermark Do not tick 'Draw text with outline' and neglect 'Outline thickness' & 'Outline color'.
• Select 'Text color' such that your text is visible over it.
• For example for white background set 'Text color' to "F0F0F0" and for Dark Background set it to "606060".

To Find the URL of the Watermark image click here. 


Step 7. Save Template.

That's it

Now checkout your blog posts you will find your watermark placed behind your blog posts. For any issues related to above tutorial comment below. Stay Updated, Browse Howbloggerz ! :)