[[ Revo Render ]]

Create nested elements in Yootheme Pro layouts using the render plugin.

About Revo Render plugin

The plugin allows you to embed entries from the Page Builder Library of layouts and elements in other parts of the site using shortcodes.

  • create nested elements
  • create end-to-end blocks for updating content on several pages at once
  • expand the capabilities of elements by inserting others with the necessary options, for example, using the gallery inside the accordion, etc.

🤯🤯🤯🤯 levels of nesting

You can use nested shortcodes and recursion.
The plugin supports 4 attachment levels to prevent overloading. The example below shows how the accordion element has another one built-in, which has a call to itself.

Accordion > Level 1 > Level 2 > Level 2

Basic element

This level is available in a regular element, and now we will add a shortcode to it. See the first level.

First level

Here I just insert an accordion element in which there is 1 item.

you are on the first level

This is the content of the first shortcode, in which another shortcode is embedded.

you are on the next level

This is the content of the shortcode where level_2 shortcode is embedded.

you are on the next level

This is the content of the shortcode where level_2 shortcode is embedded.

you are on the next level

This is the content of the shortcode where level_2 shortcode is embedded.

[[render level2]]

Debug markup

<div class="uk-panel uk-margin" data-id="page#0-0-0-0">
    <!-- Revo render start #test2 | text -->
    <div class="uk-panel uk-margin">Nested element</div>
    <!-- Render end -->
</div>
The plugin outputs comments in the source code for easier reading and debugging in the format: #shortcode name | type (layout/element)

How it ise

Joomla CMS
Use [[name]] as shortcode for render layout/section/elements from the theme library.

*Pop-up messages with the section name and the shortcode are output using the Page Builder Toolkit plugin v.1.0.4+.
Its use is not necessary for the Revo Render plugin to work.

WordPress CMS

Use [[render name="_name_"]] as shortcode for render layout/section/elements from the theme library.

*The demo also shows Page Builder Toolkit plugin and Autorefresh Pause plugin, the use of which is optional.

IMPORTANT NOTES

Important notes

- If the name of an entry in the library is duplicated, the first entry added to the library (the earliest in time) will be displayed.

- The status of the section/element is also saved in the library. If it was turned off, then the shortcode will not show anything. So you need to turn on the section/element/item, save it in the library, then you can turn it off.

IMPORTANT RULES

Our desire to go beyond the regular capabilities of the builder may be upset by some limitations. Using the plugin will require you to follow some rules that will allow you to avoid mistakes.

Custom CSS rules

if you use a nested element with custom CSS rules, then it causes this error.
Warning: Creating default object from empty value in /yootheme/public_html/templates/yootheme/vendor/yootheme/builder/src/Builder/ElementTransform.php on line 292

Design the markup so as not to use internal selectors (.el-element/.el-title/etc.).

Instead, specify the class in the element settings and use the rules for it in the theme settings: Theme > Settings > Custom code > CSS.

Joomla: Page article as dynamic content source

The Page > Article source of the article does not work through a shortcode. Obviously, this is due to the problem of getting context, i.e. at the time of generating the shortcode, the Builder does not know which article we are referring to, because the shortcode can be called anywhere, moreover, when generating markup, we do not get the entire page, but a separate element.

The solution is to use a Custom Article source instead of an Article source with the choice of a specific article title.

REVO THEME OPTIMIZER

Joomla version

Joomla 3.9.x/4.x plugin | Yootheme Pro 2.x+
  • Current version:1.1.0
  • Update date:16 Nov 2021
*1 year of free updates
unlimited sites
no warranty

Order Joomla version

Fill out the form to receive a PayPal invoice.

Special offers

The special price for pre-order is valid until the final release (see the roadmap). Also, see special offers for ordering a package of several solutions.

Wordpess version

WordPress 5.7+ plugin | Yootheme Pro 2.x+
  • Current version:1.0.0-beta.3
  • Update date:16 Nov 2021

Pre-order WordPress version

We will send you a notification
when the product is on sale.

*1 year of free updates
unlimited sites
no warranty

Pre-order Joomla version

We will send you a notification
when the product is on sale.

no warranty

I do not guarantee the perfect operation of the layout when using this plugin, you can use the plugin on the condition As Is

You should understand that the Yootheme dev team did not make this function for a reason, but based on their understanding of the consequences. I can't know exactly where and what problems may arise, because, with the current set of elements, plugins, and settings, there may be millions of different combinations that I can't check beforehand.

support

Despite the disclaimer of warranties, you can still contact support so that I can reproduce and diagnose the problem. All known cases will be reflected in the list below so that you can always refer to them before designing your unusual solutions.

I will also pass these cases to the YOOtheme dev team so that they are aware and can advise something, and maybe even change the algorithms of the topic so that everything works.

Finding the limits of possibilities is one of the methods of improving any product.

KNOW ISSUES

Dynamic content not rendered - Joomla Only

Issue: 
I see "error: maybe invalid source" in the page source.

Solution:
- Use a Custom Article source instead of an Article source.
- Try to add the needed element/layout to your page and check all field/source mapping, maybe you will see a red highlight.

Open Street map embeding

Issue: 
Initializing the Open Street map when embedding an element causes an console error.

Solution:
Not yet. Avoid using OSM in embedded elements.

Warning when usung the custom CSS rules

Issue: 
if you use a nested element with custom CSS rules, then it causes this error.
Warning: Creating default object from empty value in /yootheme/public_html/templates/yootheme/vendor/yootheme/builder/src/Builder/ElementTransform.php on line 292

Solution:
Just to use the class in the element settings and the rules for it in the theme settings: Theme > Settings > Custom code > CSS.

Duplicate id attribute value "_name_" found

Issue: 
Error message in the console.
Anchor links do not work correctly.

Solution:
Try to use classes instead of IDs.
Design the layout taking into account this feature of the work.

Send a report


Road map

  • Using the system plugin to be able to insert shortcodes in the Joomla menu
  • Support nested levels (WordPress)
  • Rendering conditions depending on the date/user/and so on (contact me if you need it)

Suggest a feature


Packages and special offers

Revo Render + Page Builder Toolkit plugin
Joomla or WordPress
€50
The Page Builder Toolkit plugin helps to quickly copy and paste shortcodes using the Click&Paste technique.
Revo Render + Page Builder Toolkit plugin
Joomla + WordPress
€100 €80
The Page Builder Toolkit plugin helps to quickly copy and paste shortcodes using the Click&Paste technique.

Changelog

Joomla versions

Version 1.1.0

(16/11/2021)
  • ADD
    Debug markup

Version 1.0.0

(27/07/2021)
  • release
    Plugin release

WordPress versions

Version 1.0.0-beta.3

(16/11/2021)
  • Fix
    Fix warning message to empty render

Version 1.0.0-beta.2

(25/10/2021)
  • Fix
    Fix wakeup function warning message

Version 1.0.0-beta

(20/10/2021)
  • release
    Plugin release (one level rendering)

Subscribe to Our Newsletters

Yootheme Tricks
Yootheme news
For developers

Newsletter for developers