How To Create Text Watermark in Blogger

How To Create Text Watermark in Blogger

How To Create Text Watermark in Blogger

Watermark is essentially wont to stop your content from being obtaining traced and additionally to link your journal content to your name or complete. For adding a horizontal, vertical or diagonal text watermark (repeating or non-repeating - multi-line or single-line) to the blogger example simply follow the given step by step tutorial with pictures and a demo.

Steps: Adding Text Watermark To  Posts

How To Create Text Watermark in Blogger

Step 1. Log in to your Blogger account, then head to Theme > Edit HTML.

How To Create Text Watermark in Blogger

Step 2. Click anyplace within the code and look for the subsequent code (CTRL+F):

<data:post.body/>

Step 3. Replace the code with this code:
Note: There are going to be 2 codes to replace each.

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

How To Create Text Watermark in Blogger

Step 4. once more click anyplace within the code and look for the following code:

]]></b:skin>

Step 5. Place this code simply higher than it:

.hbzwatermark:before {
    display: block;
    background: url("https://imgur.com/fNqHMIB"><img src="https://i.imgur.com/fNqHMIB.png" title="source: imgur.com");
    background-repeat: repeat;
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
    content: "";
    z-index: -1;
    background-size: auto 30px;
    opacity: 0.5;
}
.hbzwatermark {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

Step 6. Configuration:

Replace 

https://imgur.com/fNqHMIB"><img src="https://i.imgur.com/fNqHMIB.png" title="source: imgur.com" 

Adjust the worth 30px to regulate the scale of the watermark text.

Adjust the worth zero.5 in between zero.1 - 1.0 to regulate the transparency of watermark.

To Create Watermark Text Image Click here.

Step 7. Save Theme.

Now check your posts, you'll notice your watermark placed behind each post.