[Resolved] Guidelines to use Elementor with Generatepress

[Silvio]

Hi guys,

I read a few tips here and there about using Elementor, and especially a very helpful support post about using the elementor vs generatepress template, but can’t find it anymore.

Could you please give a few guideline when it comes to using Elmentor with Generatepress?

I mean, what’t GP does better and should not overwritten, like I read something about schema.org…

Thanks for the amazing support you provide here!

[David]

Hi there,

for me personally, if i have to use Elementor then these are some of the rules i apply:

1. Disable Default Fonts and Colors in Elementor so i can maintain global control of Fonts in the Customizer.

2. I keep Theme Elements as opposed to replacing them with Elementor. In particular the Navigation. The code for the GP mobile and slideout is far superior and a lot easier to customize. I always think why rebuild what the Theme does out of the box.

3. Smooth Scroll has to be disabled in GeneratePress ( unfortunately ) as Elementor chose to leave out the option to disable theres. The two will conflict.

4. I don’t use Canvas template even for a custom landing page as it does not have any Hooks. Instead use the Layouts Element to create your own ‘canvas’ type template when required.

5. Point 4 can also be applied to My Templates in the Display rules. This will apply to editing Elementor Templates making it easier as by default they will open in the Default Template where Sidebars etc can get in the way.

6. If I need to add global content i will use Header Elements and GP hooks as opposed to Elementor Theme Builder. It means adding shortcodes then so be it.

7. Blog Post Columns and Woo Shop columns – if for some reason i am using the Elementor Widgets for these then i would ensure the GP settings are set to 1 column.

8. Custom CSS – although Elementor Pro provides a place to add the CSS i would always add my CSS to my own Style Sheet or Additional CSS. Seen too many instances where users cannot find the CSS they added in Elementor.

9. General Rules for Elementor:
Build out wireframes for all your sections before populating them with content. They can be saved as Templates and imported each time. This will save repeating the same edits over and over.

Note you cannot change section / column / widget padding or margins globally without using CSS. So get them right before moving on.

When building out your sections, set your mobile responsive settings ( padding, margins etc ) first. If you don’t they will inherit the changes made to desktop. Meaning you then have to re-edit every element for tablet and mobile.

[Silvio]

Really helpful! thanks a lot!!!

[David]

You’re welcome

[blackbird]

Super helpful!! Thank you David. 🙂
You now convinced me (at least for a while) that I will NOT add Elementor to the soup and make a big heavy slow mess.
But this is a constant question, what am I missing and what do I gain by not adding Elementor, as everybode else is doing it and seems happy (?) with it… And then there is both Generatepress and Gutenberg changing and evolving a lot, being able to do things they couldn´t a year ago. Meaning I should go over a change layout that was fine 1-2 year ago but now can be done with other solutions (thinking especially of columns and sections). It is a bit stressful to maintain a site these days.

[David]

Glad you found the info of help – it wasn’t intended to sway users away from building with Elementor, as you know it has a huge following and is great for those more design orientated sites. But yes a lot is changing.

We are developing our own Blocks plugin that will hopefully make building most sites a lot simpler and lot lighter in weight.

[blackbird]

Great to hear! Is there a timeline when your Blocks plugin might be ready. I am planning for a re-design and is so confused about the best way forward to more complex layout.

(We use a lot of other important and maybe heavy plugins like Polylang, implecodes eCommerce Product catalog/shop, WP Download Manager, Gravity Forms, Max mega Menu, Content Aware sidebars and I am so afraid that adding Elementor might be the last thing that tips everything over! But I also guess Elementor could replace some of the plugins I use. Only try and error will tell, but I don´t have all the time in the world…)

[David]

There is no definite date set for its release, i am hoping we will see a pre-alpha release in September. Significant delays have been incurred as we worked with the Core team to address bugs / issues with the core plugin that made existing 3rd party Section blocks break if their plugins were uninstalled. For us its about getting it right and making sure its stable.

[blackbird]

Oh!
Well I prefer to wait and have a good working product than a lot of bugs, so carry on what you are doing. 🙂

[David]

Will do 🙂 – have a good day

[Silvio]

how do you create a page template (in wordpress) that will use the template created with the elements tools?

I mean, looking at point 4 and 5

4. I don’t use Canvas template even for a custom landing page as it does not have any Hooks. Instead use the Layouts Element to create your own ‘canvas’ type template when required.

5. Point 4 can also be applied to My Templates in the Display rules. This will apply to editing Elementor Templates making it easier as by default they will open in the Default Template where Sidebars etc can get in the way.

I am not able to use the element layout with the default template, and even if I could, I don’t want. I would love to create a “generatepress canva” template as a copy of the default, and then have a layout element that applies to this template. could you help with this?

[David]

Hi there,

to do this would require you to create your own template within your child theme. This guide provides info on how to do that:

https://developer.wordpress.org/themes/template-files-section/page-template-files/

You can make a copy of the page.php template in GP and strip out the elememts you don’t require.

I don’t know why you can’t use the Default template with the Layout Element. You can use the Display Rules to specify where you want it to be applied. I find the easiest method is to use Taxonomies to specify the display rule. Then you can select the taxonomy from within the post editor to set the layout.

You can add taxonomies to pages with some simple PHP or one of the many plugins.

[Silvio]

I think I am missing something.

I created a page template named GP canva, and I can select it in the page attributes of every page. But, when I go to display rules, I don’t find it among my templates. I realized my templates is templates I created in Elementor

I thought:
I create an element which strips out everything
apply it to my GP template
select this in page attributes instead of Elementor’s canva

Now I understand I have to:
create a new page as a template
apply my element to the template I created
create a new page with the template I created.

But I think I am a bit confusing. Could you help understanf?

[Tom]

Display Rules don’t currently support page templates, but it’s something I want to add in GPP 1.9.

One idea is to add a category to your pages: https://wordpress.org/plugins/create-and-assign-categories-for-pages/

Then you can apply your layout to that category in the Display Rules.

Alternatively, we can use a PHP filter to apply your Layout Element to the page template you created: https://generatepress.com/forums/topic/display-rule-for-a-specific-page-template/#post-885958

[Brajmohan Kumar]

Hello,

I always use the Page Attribute option to make the page full width so that I could use Elementor to design the whole page. After reading David answer I have below question in my mind:-

1. What is the difference between Page Attribute & Page Builder Container: https://prnt.sc/t3yina, when building a page with Elementor which one is the best option to make a page full width and why?

2. Will using Page Builder Container full-width option allow us to use GP hooks and Page Attribute doesn’t?

3. Is there any performance difference by using one over another?

If anything else that I should know then please let me know.

Thanks!

[Author]

Posts