Documentation for Elements Plus

Installation

To install the plugin simply navigate to Plugins > Add New in your WordPress dashboard and search for Elements Plus!

Next click the Install Now button and wait for the plugin to be installed. Once the plugin is installed you can click the Activate button.

That’s it. The plugin is installed and activated.

Make sure you have Already installed and activated Elementor plugin.

Enabling your Elements

Navigate to Elementor→Elements Plus! and enable or disable your new custom elements.

Elements

While editing a post /page or custom post type with Elementor you will notice a new section called Elements Plus in which you can find your new toolset.

Label Plus!

With Label Plus you can create a simple label tag with custom alignment and an icon.

1. Add your custom text.
2. Select an alignment.
3. Change the icon to your preference.

Under the Style tab you can control the appearance of your label like you would do in any Elementor’s element.

Dual Button Plus!

Dual Button allows you to create a set of two buttons.

For each button you can

1. Add a label for your button
2. Add a link that your button will point to
3. Select the buttons alignment
4. Change the buttons style
5. Add an icon for the button
6. Add a button ID
7.  Add different values for the second button

You can style both of them using the default Elementor options under the Style tab.

Button Plus!

With Button Plus you can create a simple button with multiple lines and control its style and behaviour.

1. You can select the type of your button.
2. Select the first and second text line.
3. Add a link
4. Control whether you want to open in a new window and all a nofollow rel.
5. Change the alignment.
6. Control the button size.

Under the Style tab you can control the appearance of the button itself and your button text.

FlipClock Plus!

This widget will allow you to create a slick countdown flip clock.

1. Select when the flip clock will timeout
2. Text that will appear when the countdown is over
3. Show labels before the flip clock
4. Select how many elements you need for your countdown
5. Toggle seconds. This option will appear only when days are visible
6. Change the Alignment  of the widget

Gallery Plus!

With Gallery Plus you can easily add a beautiful gallery with your images and customize it.

1. Select your images by clicking on ADD IMAGES button.
2. Select the image size for your images.
3. Control whether you want to link to a media file, an attachment page or nowhere.
4. Change the row height between the images.
5. Change image margins.
6. Control the looks of the last row
7. Randomize the order of your images.

In your Style tab you can control your image and image caption appearance.

Image Hover Effects Plus!

Create complex hover effects for your images.

1. Select the first Image
2. Select the Second image
3. Select the Hover effect

Call to Action Plus!

With Call to Action Plus you can create awesome hero and call to action section with your content.

1. Select your button type.
2. Select your text for the first and second line.
3. Add your button text.
4. Change the button link.
5. Control whether you want to open in a new window and all a nofollow rel.
6. Change the Alignment.
7. Change the button Size.

In your Style Tab

You can control your Button, CTA Text Line 1 and CTA Text Line 2 appearance.

Google Maps Plus!

With Google Maps Plus you can add a Google Map anywhere you wish and style it according to your preference.

 

1. Add coordinates.
2. Change the Zoom Level.
3. Change the Height of the map.
4. Upload a custom marker icon.
5. Add custom text to the map’s infobox.
6. Select one of the preloaded custom map styles.
7. Paste a style of your choosing from SnazzyMaps.
8. Prevent scrolling on the map.

Youtube Slideshow Plus!

With Youtube Slideshow Plus! you can add a cool video slider everywhere.

Scheduled Visibility!

Enabling this setting will add a new section for all your Elementor’s Modules under the Advanced Tab. This will allow you to render or not an element based on a date trigger!

Add any element you wish, let’s say a simple heading element in your Elementor canvas. Then select it and navigate to the Advanced tab

There you will find this Scheduled visibility options

We can then select the date that our Heading Element (or any element)  will show, and the date it will hide! You can use these triggers one by one or both.

Icon Plus!

An icon element similar to the one bundled with Elementor, with custom icon sets. After enabling Icons Plus module you can add our custom icon in your content.

You can select the icon and change various settings on the icon behaviour from the widget’s content tab.

1. Change the default style of the icon.
2. Select the icon you want.
3. Select the URL you want the icon to point to.
4. Select the Icon Alignment

You can also change the default color, size and rotation, as well as the hover animation and color of your icon, from the Style tab

1. Change the primary color of the icon.
2. Select its Size.
3. Select its Rotation
4. Change the hover primary color
5. Select an animation when hovered.

Image Comparison Plus!

This module will allow you to position two images next to each other with a comparison handle between them.

1. Choose the first Image.
2. Choose the second Image.
3. Control the image offset.
4. Change the various aspects of the comparison module.
5. Control the slider handle behaviour

Search Plus!

Search Plus is an  AJAX Powered search box with an autocomplete feature. It supports posts, pages and any custom post type you might need to support. When adding the widget you will get this screen under the Content Tab. Here you can:

1. Select a post type or page you need to fetch search results
2. Select a specific taxonomy
3. Select the max number of posts the search widget will render
4. Add a submit button that will lead to your main search results page
5. Add a dropdown text
6. Add a button text
7. Add a placeholder text
8. Show the post title in results
9. Show the excerpt in results
10. Change the excerpt length (in words)
11. Change the “See all results” text
12. Add a message when no results are found

You can style Search Plus plugin from the Widget’s style tab. There you will find options to change any aspect of your Search widget and results

In detail you can:

1. Change Input styles and typography
2. Change Button styles and typography
3. Change the Dropdown styles
4. Change the results wrapper styles
5. Change the results title styles
6. Change the excerpt style in your results

Inline SVG

Inline SVG will help you render your SVG inline and change its basic colors. In the content tab you can

1. Select your SVG
2. Add a link for your SVG to point to

Now heading to the Style tab you can

1. Change the Alignment of your SVG icon
2. Change the width
3. Select if you wish to customize the color
4. Select a Color
5. Select a hover color
6. Remove any unwanted CSS that might come from the SVG

Instagram Filters Plus!

This tool will help you style your image using Instagram Filters. This module will appear in every Elementor Image widget 

Sticky Videos Plus!

Select a video from Youtube or Vimeo and keep it sticky when your visitor scrolls down.

You can select all the basic information for your Video

1. Select the source platform the video is hosted
2. Select the full video URL
3. Select the start time
4. Select the end time
5. Change your video options
6. Enable Sticky Video
7. Change the video position
8. Change the distance from the edge (right or left) depending on the video position
9. Change the distance from the bottom
10. Change the sticky video width
11. Change the sticky video height

Tables Plus!

This is a simple module that will help you create complex and responsive tables

Under the Content tab, you can select whether you want your table to behave responsively on mobile devices and adjust your table header and body.

For your table header, you can

1. Add a new head column
2. Select the header text
3. Change the Column span
4. Change the row span
5. Modify the alignment of the content

While in your table body you can add as many items as your table heading

1. Change the item body text
2. Add a new row inside the content
3. Select the column span
4. Select the row span

Adjusting the table color and style is relatively easy. In Elementor’s Style tab you can change the heading styles

1. Change the text alignment
2. Change the text color
3. Control the typography and fonts
4. Change the background color

Same goes for the basic body style

1. Change the text alignment
2. Change the main text color
3. Control the typography of the body content
4. Add a primary background-color
5. Add a secondary background color for altering rows

In general, you can

1. Change the cell padding
2. Add a border type
3. Select the border width
4. Select the border color

Tilt Effect Plus!

Tilt Effect is an advanced effect tool for your images. In each Elementor Image module, you will find under the Advanced tab

1. Enable the title effect for the image
2. Change the direction of the effect
3. Select the tilt rotation
4. Change the X-Axis of the tilt
5. Change the Y-Axis of the tilt
6. Change the Perspective
7. Zoom in on hover
8. Change the enter/exit transition speed
9. Disable the effect in an axis
10. Enable device orientation detection

Hotspots Plus!

Hotspot Plus will help you add mark points over an image with a custom text and styling. In the Content tab, you can

1. Select the image you want to place your marks
2. Select the image size
3. Add your items

For each item you can

1. Select the type of your mark
2. Select the content
3. Change the hotspot position on X-Axis
4. Change the hotspot position on Y-Axis
5. Show or hide the tooltip

You can also under the Style tab of the module to change the basic colors of your hotspots and their tooltips

1. Select the hotspots colors
2. Change the typography and font options of your spots
3. Change their background color
4. Change their size

You can also control the styles of the spot tooltip (if used)

1. You can change the tooltip width
2. Arrange the background color
3. Alter the text color

Contact  Form 7

Style your Contact Forms 7 forms using this module. You will need to have Contact Form 7 installed first in order for this module to work.

First, you will need to select the  Contact Form you want to adjust from the content section of the element.

Then you can change for each part of this element

1. Change Colors for the Form labels
2. Change all colors of list items labels
3. Change colors and typography for the form inputs
4. Change colors and typography textarea looks
5. Change all button colors
6. Make form responsive

WPForms Element

Use and style every single elements of your WPForms forms! For this element you will need to have WPForms (lite or pro) plugin enabled

Here you can need to

1. Change the widget title
2. Select your’ already made WPForm you need to style
3. Display its title
4. Display its description

After selecting your form you can select how you need to style your main form elements and fonts from the style tab.