Author 詩語

WP CLI Commands

Ultimate Addons for Elementor adds support for some WP-CLI commands.

In case you have not heard of WP-CLI

WP-CLI is a set of command-line tools for managing WordPress installations. You can update plugins, set up multisite installs and much more, without using a web browser.

Activate your license of Ultimate Addons for Elementor using WP-CLI:

wp brainstormforce license activate uael

Deactivate your license of Ultimate Addons for Elementor using WP-CLI:

wp brainstormforce license deactivate uael

Note – In the commands above, don』t forget to replace with your actual purchase key.

Particle Hover Effect Not Working?

In UAE – Particle Backgrounds, under Advanced Settings, you get an option to Enable Hover Effect. The hover effect is an interesting feature that will interact with the user when hovered with a mouse.

This effect will not work in the following cases –1. This will be visible only in the frontend and will not work in the backend.2. In case a content/spacer is overriding the background. For example – In a row, you have added a heading and added a spacer above and below the heading. This will occupy the entire space in the row. As the spacer has a transparent background, particle background for the will be visible but it will not be interactive since it has spacer over it. The hover effect will work outside the spacer where a cursor can have direct contact with the particles background.To solve this you can remove the spacer and add padding for the row. So that particle background will display.

Styling a Marker in Hotspot Widget

A marker can inherit a global styling or can be customized with individual styling. This can help highlighting a particlular marker.

Global Styling – For the chosen marker type, all styling options will be available under Style tab.

Individual Styling – Style for single marker can be set from Content (tab) > Markers > (Choose a marker) > Style.

Filterable Tabs for Posts Widget

This feature allows displaying all posts categories with Filterable Tabs. Clicking on the tab will display posts assigned to the respective category.
Filterable tabs can be categories or tags. Settings can be found under Content (tab) >  Filterable Tabs.
Note: Filterable Tabs are dependent on the skin and layout selected for posts. It is available only for Classic, Event and Card skins and Grid, Masonry layout.
Enable Show Filters toggle under Filterable Tabs setting. Choose categories or tags from Filter By option.
You can customize filterable tabs completely with colors, typography, and other settings.

Manage Filterable Tabs on Responsive Devices

Under Filterable Tabs section, you get an option for Responsive Support. Enabling this option will display all Filterable Tabs as a dropdown on the responsive devices. If you have a number of filterable tabs, enable this option. It will stack all tabs and display them as a drop-down.

Info Box Widget

This is a multi purpose widget. It allows adding number of sections in one box. Here is a demo. Below is the detailed video for the widget –

Key features –

Single Widget with Multiple ContentsAllows displaying Image or Icon with different positions, style, hover animationSeparator with StylesAdd CTA in different ways ( Text/ Button/ Complete box )

Single Widget with Multiple Contents

Widget allows adding following sections –

Title Prefix Title DescriptionImage/Icon Separator Call To Action

Image/Icon

Under Image/Icon tab select Image Type. All customization options for image/icon are available under the same tab.

You can set icon/image position, overall alignment , background , color etc.

Call To Action

CTA are important sections. With info box you can set a link with text/button or apply to complete box.

Hotspot Widget

Image hotspot allows highlighting specific sections with markers and pointers. Markers can be put on different sections of the image. Pointers can display information about the markers. UAE』s Hotspot widget allows stunning options to display nice image hotspot. Below are the key features –

Set background image and adjust its opacityDifferent Marker types – Icon, Text, ImageOption to add link to each MarkerGlobal and Individual styling for Markers with Glow EffectDifferent customization options for Tooltip ( Position, Arrow, Animation )Innovative Hotspot tour functionality

background image

Set an image on which you can put markers and highlight the sections. Under Content > Image, set image and its size. Opacity can be managed under Style > Image.

Markers ( Icon, Text, Image )

With Markers, you can pinpoint the specific section on the image and then add a description about it with Tooltip. Under the Markers tab, you can add a number of markers. Each marker has following settings –

General Marker Type: Choose marker type as an icon, text or image.Position: Choose a location for the marker with Horizontal position (%) and Vertical position (%) ContentTooltip Content: TinyMCE editor allows adding content that will display in the Tooltip for each marker. More options are available under Tooltip tab.Marker Link: You can add link to each marker.StyleOverride Global Settings: Global styling can be set under Style > Marker. This global style can be overridden for individual marker.

Tooltip

Tooltip is a small content window that will appear when hover over the marker or click on the marker. Tooltip content can be added for each marker from Markers > Marker name > Content. Tooltip can be customized with following options –

Position: Tooltip position can be set with respect to the marker.Display on: Display tooltip on hover or click of the marker.Arrow: Set content window arrow positionDistance: Set distance between marker and tooltip.Animation Type: Animations will be applied to tooltip content boxAdvanced Settings: Animation DurationMax Height: If the tooltip content is large use this option. Read How Max Height Option Works?Z-Index: In case tooltip is displaying beneath another section increase z-index value.

Hotspot Tour

This is attractive and innovative feature. It allows taking a tour to all markers based on their order. Refer article to see How Hotspot Tour works?

Style for the Marker and Tooltip

All styling options are available under Style Tab.Glow Effect option is present under Style > Marker.

Related Documents –1. Styling a Marker in Hotspot Widget2. Unable to Access the URL assigned to Marker?3. How Max Height Option Works?4. Unable to Click on Markers when Hotspot Tour Option is Enabled?

How to Design Filterable Image Gallery?

Image Gallery Widget provides the feature to create a filterable gallery. Here are the steps –
Step 1 –  Enable Filterable Image Gallery option.

This option is available only for Grid / Masonry layout.
The setting can be found under Content (tab) > Grid / Masonry > Filterable Image Gallery.
Enabling this option will display all categories created for images. See how to create categories in the next step.
「All」 Tab Label is a label to the main category, where all images in the gallery will be displayed. Edit it if required.

Step 2 – Set categories for Images.

The category names that are set to images will display as Filterable Tabs title.
In above screenshot BRANDING, DESIGN, PHOTOGRAPHY, WEB are categories.
You can directly assign categories to the image.
See how to set categories for images?
For example – If image A has assigned to categories BRANDING and DESIGN. While image B has assigned to categories PHOTOGRAPHY and WEB. Then Filterable Tabs will automatically display all 4 categories. On clicking on any of the tab will display related images.

Step 3 – Customize Filterable Tabs.

Category names will automatically display as Filterable Tabs.
That means if you assign 5 different categories to images, then 5 Filterable Tabs for all those categories will be created.
You can completely customize Filterable Tabs with the settings under Style (tab) >  Filterable Tabs.

Manage Filterable Tabs on Responsive Devices

Under Grid / Masonry / Justified tab, you get an option for Responsive Support. Enabling this option will display all Filterable Tabs as a dropdown on the responsive devices. If you have a number of filterable tabs, enable this option. It will stack all tabs and display them as a drop-down.
Note: If you have enabled a Filterable Gallery for justified layout, and not able to see images under filterable tabs. Then check if Last Row Layout option for justified image gallery is set to Hide. Set it to Justify to display images under filterable tabs.

Posts Widget

UAE』s Posts widget provides stunning options to showcase posts, pages, media, templates etc anywhere on the website. It provides a powerful query builder to select exact posts. It also offers predefined skins, setting that control every part of the post, excerpt and CTA setting, customization options and many more. Below are the key points for Posts widget:

Powerful Query Builder
Stunning Skins
AJAX Pagination
Layouts: Masonry/Carousel/Featured/Grid
Infinite Load
Filterable Posts
Customization Options

Have a look at the demo here. Below is the detailed video for the widget.

Powerful Query Builder

The widget has an inbuilt Query Builder that allows you to filter and show the exact posts. Read How Query Builder Works for Posts Widget?

Stunning Skins

The widget provides prebuild skins for posts. You can choose your favorite skin from the list. Layout option is dependent on the skin selected from Content (tab) > Skin. Different skins display title, image, meta, CTA at a different position.

AJAX Pagination

Allows a page to dynamically renew content without reloading the page within the browser. You can select numbers or infinite scroll for posts pagination. These options are dependent on the skin you select. Setting can be found under Content (tab) >  General > Pagination.

Layouts: Masonry/Carousel/Featured/Grid

Layouts add a cool look to posts. This option is dependent on the skin and available with classic, event, card skins. Layouts are managed on a responsive view by the widget. Setting can be found under Content (tab) >  General > Layout. Read about Layouts for Posts Widget. 

Filterable Posts

This feature allows categorizing posts. It displays all posts categories with Filterable Tabs. Clicking on the tab will display posts assigned to the respective category. Posts will display with a default shuffling animation. Setting can be found under Content (tab) >  General > Show Filters. The option will not be available for if Main Query is selected under  Query >  Query Type. Read about Filterable Tabs for Posts Widget.

Customization Options

Depending on the skin and query builder, customization options for the post title, meta, image, excerpt, CTA are available under Content and Style tab.
Related Documents –

How to Enable Infinite Load Pagination for Posts?
Posts Widget Carousel Does Not Display Correctly?

How Hotspot Tour works?

As the name suggests this feature let the user take a tour for all markers. Tour will follow the order in which markers are created. Starting from the first marker, a tooltip will gradually display for other markers after a specified time interval.

Note: Hotspot Tour feature will not work unless Tooltip is enabled. This is because the tour is displayed on the tooltip. It also displays navigation (previous, next) links for the tour.

Below are the available option under Hotspot Tour tab. Initially Enable the Tour.

Repeat Tour: After completing round for all markers user can navigate from last to the first marker if this option is enabled.Autoplay: It will autoplay tour for all markers.Interval between Tooltips (sec) – After this time interval, next tooltip will appear. This defines the time between displaying two tooltips. Launch Tour – When you set tour on autoplay, you can decide when to start it. This option will allow a user to start the tour on the click of a button or when hotspot comes in the viewport. Overlay Button: This will allow starting the tour if in the above option button click is selected. Once button is clicked tour will autoplay unless End Tour option is clicked.

How to add Sortable and Searchable Table? How to Show Entries Dropdown?

Sometimes it is irritating for a user to search for specific table entry by scrolling table all the way down and up. Table widget provides some cool options that allow a user to sort a table with few clicks and search for a particular section in minimum time.
Table widget provides options to make the table sortable and searchable. Sortable tables are effective as they allow the user to sort the table by clicking on table headings. While searchable tables make searching task super easy for a user. It displays a search box for the table so that user can search exact content from the table.
Table widget also allows controlling the number of entries in a table.
Advance Settings tab in Table widget list these settings-
Sortable Table (?)

Enabling this option will display arrows in all table heading section.
A user can sort table entries on the click of table headings.

Searchable Table (?)

Enabling this option will display a search box above the table.
A user can type the string or content that needs to be searched/filtered.
The row that has matching content will be displayed.

Show Entries Dropdown (?)

This option lets a user control the number of entries to display.
A user can select a number of rows that should display.

You can enhance the design of  Search / Show Entries Box from Style tab. Color, Background, Typography, Border, Width, Padding can be adjusted to match these boxes with your design theme.