What is Table Header?
A row that appears at the top of the table giving a title to columns beneath is Table Header. It is defined with the
Multiple rows and columns can be added to Table Header. See How To Add Rows And Columns to the Table?
After adding columns to Table Header following option will appear for Cell–
CONTENT (?)
Enter a heading/title for the column beneath.
For Example- If you want to create a table to compare A and B gadgets, then type A in one column and B in another column.
ICON / IMAGE (?)
This allows you to add icon from the provided list or image to the header field.
Icon/Image can be added with or without content.
For Example- If you want to create a table to compare A and B products, then you can just use their logo images in the header. It will give a nice look to the table.
Icon/Image style like scale(size), position, spacing etc. can be managed from Icon / Image tab under Style tab.
ADVANCE (?)
This allows merging two or more table cells located in the same row or column into a single cell.
By default value for Column Span and Row Span will be 1. Add the number for column and row that needs to merge.
For Example- If you wish to combine 2 columns to the current cell then add Column Span value 3. It will add 2 columns to the current cell.
Color and Background Color can be applied to each column separately to create a nice look for headers.
Notes:
To change the row and column structure simple drag and drop the cell from left edge with three vertical dots.
To duplicate the cell click the copy icon.
Refer Table Widget document here.
How to Exclude Specific Headings from Table of Contents Widget?
You might have come across a case or find it difficult to exclude certain headings from the table of contents on your website? We have made it possible or simplify to exclude specific headings in the Table of Contents widget of UAE.
Let』s see few cases and how we can overcome this in our Table of Contents widget.
Case 1: Hide Headings from the Single Post Page
If you have a Single Post page, where you are displaying related posts below the post content using Posts widget. The Table of Contents widget will consider the headings of the related posts in the table of contents.
Solution: To remove or exclude the headings from the table. Here you will only need to add a CSS class to Posts widget whose headings you want to exclude.
CSS class you will need to add is – uae-toc-hide-heading
The CSS class will need to be added under the Advanced Tab > Advanced section > CSS Classes
Case 2: Hide Headings from the Single Page
On a single page, you might have multiple section headings with Table of Contents widget, and need to exclude a specific heading in the table. But, here few headings are added using the Text editor and you don』t need to hide all the headings of the text editor, just the second one.
Solution: The previous solution will work a similar way even here. Just go to the Text Editor and find the specific heading to be excluded, and go to the text tab which is beside the Visual section.
Now, let』s say you have h3 tag so you will add the following in the tag – class=」uae-toc-hide-heading」. Refer the screenshot on how it needs to be added.
After you add the class to the heading tag and the heading will be excluded from the table. Hit Update or Publish the page with the changes and you will see the heading to be excluded.
Here』s the GIF on how to do this –
Similarly, if you find any other case, you will need to add the uae-toc-hide-heading to exclude any specific heading.
Facing Issues with CSV Import?
Sometimes you may face issue while importing CSV file to UAE Table widget. It might be the case that you have a CSV with the invalid format. Especially old CSV files might not work as expected. In such cases, you can re-download the CSV files and try them with the widget. Below are the steps that will show how you can re-download the CSV.
For MAC UsersFor Windows UsersFor Google Sheets users (recommended)
For MAC Users
File that is created with Numbers app can be exported as CSV as shown below:
Step 1 – Open a file with Numbers and click on File -> Export To -> CSV
Step 2 – Set the following options:
2.1 Uncheck 「Include table names「2.2 Set Text Encoding as Unicode(UTF-8)
For Windows Users
If you have a file created with MS Office then below are the steps to export the file as CSV:
Step 1 – From the top bar, click on Data menu.Step 2 – Click on the From Text icon.Step 3 – Go to the location of the file that you want to import. Click on the filename and then click on the Import button. The Text Import Wizard – Step 1 or 3 windows will now appear on the screen.Step 4 – Choose the file type 65001: Unicode (UTF-8) from the drop-down list that appears next to File origin. Click on the Next button.Step 5 – It will display the 『Text Import Wizard – Step 2 or 3』 window. Select the Comma delimiter. Click on the Next button.Step 6 – Select Column data format as general and click on Finish button.
For Google Sheets users
This is the easy and sure way to export CSV files. It works well even with your old files. Just import your old files with Google Sheets from File > Import and download it again. You can create/upload file to Google Sheets and then download them as CSV using following steps –
Click on File -> Download as -> Comma-separated values (.csv, current sheet)
You can even import CSV files to Google Sheets that are now working with the Table Widget, download them again and import to the widget.
After successfully exporting CSV files, upload it with UAE Table widget to create a table. Refer a link here.
Filters/Actions for Image Gallery Widget
Filters available for Image Gallery are listed below.
Helps Modify Filterable Tabs.
add_filter( 'uael_image_gallery_tabs', function( $cat_filter ) {
// Modify the array here
return $cat_filter;
}, 10, 2 );
Note: $cat_filter – The array of image categories to display in Filterable Tabs.For example –
add_filter( 'uael_image_gallery_tabs', function( $cat_filter ) {
$cat_filter['old_category'] = 'New Category';
return $cat_filter ;
}, 10, 2 );
Helps to Modify Image Carousel Settings.
add_filter( 'uael_image_gallery_carousel_options', function( $slick_options ) {
// Modify the array here
return $slick_options;
}, 10, 2 );
Helps to Modify Image gallery lightbox content
add_filter( 'uael-lightbox-content', function( $lightbox ) { // specify the content here. return $lightbox; }, 10, 2 );
Note: $lightbox – The content to be displayed in the light box. We can display the image 『title』 or image 『description』.
For example –
add_filter( 'uael-lightbox-content', function( $lightbox ) { // specify the content here. $lightbox ='description'; return $lightbox; }, 10, 2 );
How Many Numbers of Reviews Can Be Shown for Google and Yelp?
Business Reviews widget allows displaying Google and Yelp business reviews. To fetch reviews for your business you would need to add respective Google and Yelp API key. Here are some important points to note –
Your business reviews are fetched over these API keysGoogle allows only 5 reviews to fetch with Google API key.Similarly, Yelp allows fetching only 3 reviews.
So in total widget can display upto 8 reviews.
Google and Yelp provide these limited number of reviews. This is dependent on which reviews Google and Yelp consider as the 「Most Relevant」 to your business.
Unable to see the Font Awesome 5 Icons in UAE』s widgets?
Recently Elementor』s v2.6 introduced a new Icon Library, which includes an update to the Font Awesome 5 Library.
The idea behind this was to migrate to the latest Font Awesome 5 library gaining access to over 1500+ icons, for this you must have clicked on the following Update button from the Elementor』s Popup. Which looked like the following screenshot.
Now after hitting the Update button, you will be redirected to Elementor settings in the backend under Elementor > Tools. Here you will find the Migrate to Font Awesome 5 button, on clicking the same you will see another popup which reminds you that this action is irreversible:
Now, when you click the Continue button, you will be redirected to the page you were previously working on.
Here』s the Elementor』s Article on Migration and the process with the steps they have outlined.
Ideally, you must have already followed the Elementor』s Documentation and migrated the Icons from FA4 to FA5. While some of you might still be facing some issues while viewing the Icons with the UAE』s widgets.
Below are some cases, which we are aware and how they can be resolved –
Case 1: The icons are not working on the site ( a small square is appearing )
Solution – This usually happens when you are still using the Font Awesome 4 Icons in the widgets.
To resolve the same, you will need to enable Load Font Awesome 4 support on your website from Elementor settings.
This option can be found under WordPress Dashboard -> Elementor -> Settings -> Advanced Tab -> Load Font Awesome 4 Support setting
Case 2: What if I do not upgrade to FA5?
Solution – If you don』t migrate to FA5, our Addons』 widgets that use FA4 icons will continue to work, but you wouldn』t be able to edit them.
Tip: Go to Elementor > Settings > Advanced and make sure Load Font Awesome 4 Support is set to Yes so that your Font Awesome 4 icons will still display properly when using Font Awesome 5.
See the full widgets list below.
Note: If you don』t update to FA5, Elementor widgets that use FA4 icons will still continue to work, but you wouldn』t be able to edit them.
List of Ultimate Addons for Elementor Widgets in which you can use the new Icon Library –
Advanced HeadingHotspotImage GalleryInfoboxMarketing ButtonModal PopupMulti Button Off-CanvasPosts Price Box TableTimelineVideo Video Gallery Woo – Add to Cart
How to Open a Specific Section of Content Toggle Widget from a Remote Link?
The Content Toggle widget now allows opening either section of the content toggle from a remote link. That means you can direct using a link on any page to open either section of the content toggle.
Below are the detailed steps to achieve this requirement –
Step 1: Add an ID uael-toggle-init to the Content Toggle widget. Note that add ID uael-toggle-init only. Other ID will not work.
Step 2: Sections of the Content Toggle widget are identified as content-1 and content-2 IDs. Now you can open the 2nd section by using ID 『content-2『 after the URL. That means add 『/#content-2′ at the end to the page URL.
For Example –
Consider you have pages A and B. Content toggle is set on page A having Section 1 and Section 2. Now, we want to see Section 2 of content toggle when redirected page B. In this case, follow the steps –
Add a uael-toggle-init as ID to the Content Toggle under the Advanced from of the Widget.Now, from page B, use a text, button or anything with a link to the content toggle section. Use a URL for page A and add #content-1 (for the first section of content toggle ) or #content-2 (for the second section of content toggle ) at the end of the URL. Like -> your-domain/page-name/#content-2
Refer to the following video, which shows that the second toggle element is opened as we clicked on the button which then redirects us to the page having the Content Toggle.
Business Reviews Widget
This widget will help to display Google Places and Yelp reviews with Elementor. Google and Yelp reviews can be shown separately or you can mix it up. Further, you can completely customize the review box to suit your website design.
Here are key features for powerful Business Reviews widget –
Supports Google Places& Yelp Reviews Prebuilt Skins – Box (default) / Card / Bubble Grid & Carousel Layout for review boxes Display Reviewer Info – Image and Name Filter reviews by – Rating/ Review Date Star rating style – Default / CustomReview box style and spacing controls
Select your business and display reviews
To display Google Places and/or Yelp reviews you would need to add ID for your business. It will help widget to connect to your business and fetch reviews. Under General > Review Source, choose if you wish to display Google and/or Yelp reviews.
For Google reviews –
Get the Google Place API key. See how to get this. Search your business on Google Maps and get the Google Place ID. See how to get Google Place ID. Note: Maximum 5 Google reviews can be displayed (Content > Layout > Reviews to Show). Read why?
For Yelp reviews –
Get the Yelp API Key. See how this can be done. Now copy the Yelp Business ID and add it to the widget. See how to get this. Note: Maximum 3 Yelp reviews can be displayed (Content > Layout > Reviews to Show). Read why?
Prebuilt Skins and Layouts
Widget offers ready-made clean layouts and styles for reviews.
Skin ( Content > General > Skin ): This arranges review meta information like date, ratings, reviewer image, name, etc. in different positions. So that you can display review as card, bubble or default box. Grid & Carousel Layout ( Content > Layout > Select Layout ): This will set all reviews in the grid or carousel (slider) layout. Layout tab also offers a setting for a number of Reviews to Show. Select the number of Google (maximum 5) and Yelp (maximum 3) reviews to display.
Review Details
Different tabs offer settings to manage review as follows –
FiltersFilter reviews by – date or rating Minimum Rating – Choose to display reviews above a particular star rating. For example, choosing 3 stars will display reviews with 3 stars and above.Rating – Choose to display star ratingsStar Icon Style – Choose to display a default star style or customize it. Review Text – This gives control over the text of the review. You can choose the Text Length for review.
Reviewer Information
You can hide/display information of the people who wrote a review for your business. Under Content > Reviewer Info, select to hide/display name and image (profile picture) of the reviewer.
Inbuild Schema Type
Note: After the recent Google Review schema changes ( applicable from 16th September 2019 ), we are deprecating the Schema Support from UAE』s version 1.18.0.
Previously, we used to support Place, Organization and Service Schema. But after this update Places and Service are not valid items under the AggregateRating as per the new rules of the Google Review snippet.
While Organization is the valid Item under the AggregateRating but in this case, the name field is required to be added under the Organization schema type.
As per the new rule in Google schema, all the self-serving reviews embedded by the 3rd party widget are not going to display review rich results anymore for the organization schema.
Related Articles –
How Many Numbers of Reviews Can Be Shown for Google and Yelp?
Advanced Heading Widget
Headings play an important role on a website. The more attractive your heading looks, the more attention you』ll be grabbing on to it.
The Ultimate Addons for Elementor provides stunning options with the Advanced Heading widget. You can customize your headings, add a sub-heading, use separators, add background, etc.
In this article, we』ll see some important features of this advanced Elementor widget.
Key features of the Advanced Heading:
Add heading, sub-heading, and linkSeparator StylesComplete CustomizationResponsive Support
Using an Advanced Heading on Page
Like all the other widgets of Elementor, the Advanced Heading widget can simply be dragged and dropped in the position you want it to appear. You can then proceed with the various settings that allow you to add text in the heading, sub-heading, add a link, add seperators and more. Let us take a look at each settings tab of the Advanced Heading widget.
Adding Content to the Advanced Heading
This tab in the Advanced Heading settings allows you to manage the content that will be seen as a part of your heading. The General section here allows you to add text for the heading, a link if needed and the description that will appear. If you just want the heading, you can skip the link and description here.
The Separator section allows you to decide what kind of a separator you wish to add in teh widget. You can leave it empty, or add a single line or a line with an icon, image or text. This section also gives you some basic styling options for the line such as the style, color, thickness and width.
In case you are using an image of an icon along with the line, this section will let you control the size, position, and padding of that too!
Styling the Advanced Heading
This is where you can manage the overall styling of the widget. The Style section allows you to control the alignment. The Icon/Image Styling section lets you manage colors and hover effects for your images and icons. While the Typography section lets you control the typography for the entire widget.
Advanced Settings and Styling for Advanced Heading
This tab allows you to do some additional advanced settings for the widget. You can manage the margin, padding, add entry animations or any CSS class or ID you wish to apply.
You can set a background for the Advanced Heading widget and manage various properties like the background type, color, size, position, hover effects, etc. After the Background section, we have the borders through which you can add a border to the entire widget are. You can select the border style, colors, size, radius, etc.
You then have the responsive section that allows you to decide whether you wish to show the heading on all the three devices; viz. desktop, tablet, and mobile. You can choose to hide or show it on any individual device as well.
Finally, if you wish to add your own custom CSS code, you have a section for that too. This feature is available only for those using Elementor Pro.
How Can I Upgrade the License?
Upgrade to Lifetime:
Customers need to pay only the difference amount.Example – If a user wants to upgrade from Ultimate Addons ($69 / Year) to Ultimate Addons ($249 / Lifetime), he will have to pay only $180 ($249 – $69)
That』s about it
Upgrade to Annual:
In case if you upgrade to annual license, the original date of license expiry is considered, regardless of the date of upgrade. The amount you will be charged will be based on the price difference and the time left in your current subscription before renewal.
Example: A customer purchased an annual license of Ultimate Addons ($69 / Year) on January 1, 2017. On July 1, 2017, the customer upgrades his license to Growth Bundle ($249 / Year). The price difference is $180 and there are 6 months left in his current subscription period. The customer will pay $90 to upgrade. On January 1, 2018, the subscription will renew and the customer will pay the license renewal amount and own an active license key until January 1, 2019.
The expiration date of the license will not change; an upgraded license will still expire on the original expiration date whether prorated or not.
How to Upgrade?
Just visit the upgrades page on our store to see your available options.
Have questions? Get in touch, We will be happy to help!