Repro Web
Setting the message display position
Setting the display position
Set the display position of the web message. There are three display types: fixed on the window or page, fixed to an element, and embedded, and the types available depend on the template you choose.
Fixed on a window or page
You can have content pop up for windows and pages.
Fill out the following form.
Location
Specify the position for the entire page from the following
- Top left
- Up
- Top right corner
- Left
- Center
- Right
- Bottom Left
- Bottom
- Bottom right
Fixed with a
element
Display a pop-up of content for a specific element on the page.
Fill out the following form.
Element of criteria
Specify the reference element for the display position by CSS selector. If the element of the reference position specified at the time of delivery trigger execution does not exist, the message will not be displayed.
Location
For a reference element, specify the direction of placement from the following
- Top left
- Up
- Top right corner
- Left
- Right
- Bottom Left
- Bottom
- Bottom right
The basis for the display position is as follows
The basis for the display position is as shown in the figure below.
Gray squares: criteria elements
Red Squares: Message
E.g., if the position is set to "Top right"
Horizontal axis: position the center of the width of the reference element at the left edge of the message
Vertical axis: Position the top of the reference element at the bottom of the message
Offset
Allows you to adjust the vertical and horizontal distance from the specified element in pixels. The number can be negative or decimal.
Cautions
- If the display position based on the reference element, position, or offset exceeds the width or height of the page, the message will be cut off and the entire message will not be displayed.
- The preview on the admin screen does not reflect the settings regarding the display position. Please use How to check using the preview function to see the actual display position.
Embedding
Embeds content before, during, or after a specific element on a page.
Fill out the following form.
Element of criteria
Specify the reference element for the display position by CSS selector. If the element of the reference position is not present, the message will not be displayed.
Location
For a reference element, specify the position of the element to be placed, starting with the following
- Insert before
- Insert at the beginning of a child element
- Insert at the end of a child element
- Insert backwards
Cautions
- The setting regarding the display position is not reflected in the preview on the admin screen. Please use How to check using the preview function to see the actual display position.
- Currently, only original templates are available for embedded types.
![](https://success.repro.io/wp-content/uploads/2020/09/8-2.png)