Skip to content

Elements & Shortcodes

Total includes it’s own built-in icon set that you can use throughout your site. These icons were originally taken from the FontAwesome script but renamed into “Ticons” to prevent any conflicts with 3rd party plugins and to better optimize things. You can use the icons freely via HTML, however, if you want to add icons…

Theme Icon (ticon) Shortcode

The Total theme includes a little shortcode you can use to display the current year which is useful for adding to your site copyright without having to update it every year. The shortcode: 2024

Current Year Shortcode

The Total theme includes a Custom Field element you can use in the WPBakery page builder which is technically a shortcode named “vcex_custom_field” which you can find on the theme’s shortcode reference page. The vcex_custom_field shortcode provides a robust method of displaying custom fields on your site which is displayed inside an html element, but…

Custom Field Shortcode

Most text fields in builder elements do not support html for security and optimization reasons, however, sometimes you may want to add a 2 line title in a text field. In order to do this you can use the built-in shortcode like this: Sample Usage Below is an example of how the shortcode would be…

Adding Line Breaks in an Element’s Text Field (br shortcode)

The Total Theme Core plugin registers a new shortcode named “select_menu” which will allow you to display a select dropdown anywhere on your site based on a specific menu. The shortcode takes on two parameters: Example usage:

Select Menu Shortcode

When using theme elements that display posts such as the Post Cards element, there are built-in settings for controlling the posts that are shown so you can choose how many to display, include or exclude terms, change the order, etc… If you need more complex queries, the theme offers an “Advanced” Query type which allows…

Advanced Queries

The Total theme includes a highlight shortcode you can use that will add a line under the text. This is best used with large headings like the example below: A large heading with text The code used for the example above looks like this: A large heading with ]highlighted[ text By default the highlight will…

Text Highlight Shortcode

In Total version 5.2 we added a new shortcode named which can be used to display a cart link with the number of items currently in the cart and the subtotal. This shortcode can be used in various areas of the theme such as the Top Bar or Header Builder as well as added inside…

Cart Link Shortcode: Display Shopping Cart Link Anywhere

The ] shortcode was introduced in Total 5.2 and it allows you to easily add inline items to the Top Bar content field such as phone numnber, email, login/logout link…etc. This shortcode makes it easy to display text with an icon on the side as well it ensures your top bar items render well on…

The topbar_item Shortcode

The Grid Container is a new element added in Total 5.2 which will allow you to easily create grids with various builder elements without having to create rows and columns. This element is great when adding a grid of elements inside a column so you don’t have to make use of inner rows and columns.…

WPBakery Grid Container Element

Total 5.4.1 was updated to include an extra security check when using callback functions within shortcodes to prevent potential exploits from the core wp_ajax_parse_media_shortcode WordPress function. Previously you could enter the name of any function within a shortcode “Callback Function” field and it would run, but now that function name must also be defined as…

How to Whitelist Callback Functions for Elements

The Total theme includes a Social Links shortcode that can be used to display social links anywhere on the site. Below are the main parameters that can be used with this element. Note: You can always insert the Social Links shortcode via the WPBakery Page Builder when editing a post/page. But if you need to…

Social Links Shortcode

AWeber is a great newsletter service which we highly recommend and it’s very easy to integrate with the theme’s Newsletter Form element. Here is a link to the AWeber documentation (just incase things change and the instructions below are outdated). Step 1: Add The Form Action URL AWeber uses a global URL for the form…

How to use AWeber with the Newsletter Form

When creating dynamic templates you may want to take advantage of some of the built-in shortcodes in your modules to display dynamic data. Below are the shortcodes available in the theme by default. Shortcode Description Useful Dynamic Shortcodes Displays the current post title. https://totalwptheme.com/docs/dynamic-shortcodes/ Returns the current post link. December 20, 2022 Displays the current…

Useful Dynamic Shortcodes

The Total theme includes a built-in element which can be used for showing a simple contact form and by default when a new form is submitted the form is sent to the website’s administrator’s email address. If you want to change where the contact form emails go you can do so via the Theme Panel.…

How to Change the Contact Form Recipient (to) Address

Total 5.6.1 introduced new “Dynamic Variables” which can be used when adding text within elements or in certain theme settings (such as custom page titles) to display non-static text. For example lets say you are creating a dynamic template and you want to display the page title with the date in the format “Page Title…

Dynamic Variables

When working with the Heading element you may want to add text on different lines without inserting multiple heading elements. This can be done easily by using the theme’s shortcode. Multi-line heading using “Max-Width” It is also possible to separate a heading into multiple lines by applying a width to your heading element (this can…

Add a Heading with Line Breaks

In Total 5.10 we introduced a new underline shortcode which makes it easier to to text on your site when working with any page builder. Basic Usage To use the shortcode simply wrap your text in a shortcode named underline like such: Shortcode Attributes: The following attributes are available so you can modify your underline.…

Underline Shortcode

Most text fields in elements do not support html for security and optimization reasons, however, sometimes you may want to add a custom span around specific text so it can be styled differently. In order to do this, you can use the built-in ] shortcode: Sample Usage Below is an example of how the shortcode…

Span Shortcode

In some cases you may want to display a grid of posts but rather then linking to the posts you want to display the post content on the same page in a pop-up window. Luckily this is very easy in Total. To create a grid with a pop-up window for the post content all you…

How to Create a Post Grid with Popup Content
Back To Top