From this tutorial you will discover how to create and use skins of the element’s design with the help of JetStyleManager plugin.
Several JetPlugins have the Elementor editorial load functionality that allows you to sufficiently fasten the page load speed of your website by reducing the styling options. JetStyleManager plugin gives you an opportunity to save the astounding look and reduce the loading speed at the same time by using the saved skins.
The Editor Load Level option is available for JetElements, JetBlocks, JetBlog, JetTabs and JetTricks plugins.
1 Step— Set Full editor load level
For this example, let’s use the JetElements plugin’s Pricing Table widget. Open the Crocoblock > JetPlugins Settings > JetElements > General Settings section in the WP Dashboard and pick the “Full” option in the Editor Load Level drop-down menu.
2 Step— Create the design
Open the page in Elementor editor and drop the Pricing Table widget to the necessary section.
Style the widget up in the Style menu tab.
3 Step— Create a skin
Click the right mouse button on the widget’s surface and in the appeared window select the Save as Skin option.
In the opened box name the skin and click the “Save” button.
We saved the skin with certain style settings of the Pricing Table widget. Now we can use it with a lower level of the Editor Load Level option.
4 Step— Apply the skin at the lower loading level
Now we can pick the “None” Editor Load Level in the WP Dashboard for quicker loading of the pages.
Go back to the Elementor editor and insert a new Pricing Table widget into a certain place or duplicate the used one. Then, click the right mouse button on the widget and choose the Apply Skin option.
In the window, click the “Apply” button next to the skin you’ve created.
We get the same design of the widget as we set before, in spite of the Style settings aren’t available. Now you just should change the content.
If the Editor Load Level is the same as it was when we styled the widget or higher, the skin will not be applied. For example, we set the Medium editor load level and saved the skin. If we select Low or None editor load levels the skin will be applied, but not by Medium and Full levels.
If you want to adjust the widget to its default appearance, click the right mouse button on the widget and pick the Reset Skin option.
Save different skins of JetPlugin widgets and apply them on pages of your website. Make the page loading 20-30% faster by disabling the Style settings of the widgets using the JetStyleManager plugin.