Method for adding a Watermark Logo/Text to bottom of each Sharepoint page

Question

I'm currently trying to add a Watermark Logo or text to the bottom of every Sharepoint site/Subsite.

Can anyone recommend an effective way to do so?

I've tried various incarnations of CSS using the Master Page's CSS file. The closest I can get is a repeating background image of my watermarked logo using:

body.ms-backgroundImage { background: url(/my/image.png); }

I've tried various things such as no-repeat, trying to fix the position and even !important tags to try position this Watermarked image but to no avail.

Anything else I can try?

Answer 1

Kindly use the following code in you master page. Add it just above the closing body tags.

<div style="position:fixed; bottom: 10px; right: 10px; width: 40px; height: 100px;" class="s4-notdlg ms-dialogHidden">
        <img src="asd.png" alt="no image text" />
    </div>

This will give an image on the right bottom corner of your page. Also note that I had added two classes to the wrapping div. The use of these class is to hide the image/watermark from the dialogs box. The first class name is for SP2010 while the other works for SP2013 and SP2016.

Adding the image below of my master page to give you idea where i put this in master page.

Answer 2

As per you comment, you can update masterpage.

Simply add following snippet before s4-bodyContainer:

<div class="s4-notdlg ms-dialogHidden" style="
position: absolute;
bottom: 0;
right: 20px;
z-index: 1000000;
opacity: 0.7;
">
    <img src="https://www.google.co.in/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" border="0">
</div>

This will make watermark like sticky icon on every page as below screen.

Later on you can put this inline style to your css by specifying the class.

Also you can specify any content within that div to update your watermark content.

Hope this helps!