UI Marker
September 12, 2021
Elementor Widgets

UI Marker
- Select image: Select an image from your media library. This is the image of the item
- Marker items: click on "Add Item" to add a new marker item
Click on the item to configure relevant options
- Left / Top: Move the circle point to adjust the marker position to the left, right, top or bottom
- Use animation: enable to apply an animation
- Marker type: there are types of marker types (image or point). Set the desired type from the drop-down list.
- Title: Enter a title for the marker
- Content: Write the content that briefly describes the marker item
- Select image: select an image from your media library to display in the popover.
- Image size: Select an image size from the given list.
- Position: Select a position for this item (Top, right, bottom, left)
- Link: Insert an absolute URL that the button will be linked
- Button title: If you want to create a button, just enter a button title - Mode: Display the popover on click or hover.
- Position: Set the alignment of the popover to its marker. If the popover doesn't fit its container, it will flip automatically.
- Width: set the width of the popover.
- Animation: Select an animation effect that will be applied on click/hover.
- Style: Choose a style for the marker card
- Padding: Set the padding between the card and its content.

Title Settings
- Title font: Click the edit button to adjust the typography of the title font.
- Style: Select a style for the title.
- Link title: If yes, the title will be redirected to the link added.
- Decoration: Decorate the title with a divider, bullet, or line that is vertically centered to the heading.
- Predefined color: choose a predefined color for the title.
- Transform: use this option to make the text appear in all-uppercase or all-lowercase, or with each word capitalized.
- HTML element: Choose one of six heading elements to fit your semantic structure.
- Title margin: Set the vertical margin of the title

Meta settings
- Image appear: This field will allow you to adjust the desired position of the image. (Top, Inside, or bottom).
- Media margin: Set the vertical margin for the image. You can select one of the available options.

Content settings
- Content font: Click the edit button to adjust the typography of the content font.
- Style: Select a predefined text style, including color, size, font family.
- Custom color: Choose a custom color for the content text.
- Transform: use this option to make the text appear in all-uppercase or all-lowercase, or with each word capitalized.
- Margin top: Set the vertical margin of the content section.

Button Settings
- Text: Enter the button text.
- Link new tab: Set the new tab redirection of the link.
- Style: There are different types of button styles available. Set the button style from the drop-down list.
- Button size: Choose the size of your button from the drop-down list of sizes.
- Margin top: Set the top margin of the button.