Forum | Appery.io

I've searched the tutorials, documentation and videos, but can't find how to add a watermark to my pages. Help?

Hello -

1) You will need to add to all of the pages in the very end of an html component.
2) Add CSS styles which add position absolute.

I have no idea what you just said.

Hi,

1) Open any page
2) Open palette
3) Find html component
4) Drag&drop it bellow all components on this page
5) Make it div instead of html in Properties
6) Edit it
7) Add your watermark text in html tab of component code<div id='watermark'>MY watermark<>/code
8) Create css file on the project tab
9) Add there styles for your component

I guess I should have been clearer. The watermark is an image, not text. Your html editor doesn't seem to like images. How would I add an image as a background image on my pages?

Please check doc http://devcenter.appery.io/documentat...

Excellent, Alena, thank you much! Took a few tries but finally got it to work using the Custom Background option.

One related question: Is there a way to limit that graphic to the startScreen? Or to select different backgrounds for different pages?

Hello.

Yes, after
[dsid="mobilecontainer1"] { ... }
selector add next
#startscreen [dsid="mobilecontainer1"] { ... }
selector in CSS file.

startscreen - exact name of your start page.
This way second selector will only for start screen.

So I'm supposed to duplicate the exact same code I already have in the CSS file, expect prefacing this time with #startscreen? Here's what I now have in my CSS file:

[dsid="mobilecontainer"]
{
background-image:url("http://xyz.com/sbi-coach/images/water...");
background-repeat:no-repeat;
background-size:cover;
}
#startscreen
[dsid="mobilecontainer"]
{
background-image:url("http://xyz.com/sbi-coach/images/water...");
background-repeat:no-repeat;
background-size:cover;
}

If that's correct, it has no effect on the app.