Plugins Integration

  1. Home
  2. Docs
  3. Plugins Integration
  4. Elementor Page Builder

Elementor Page Builder

Below is some configurations you need to make on Elementor settings page to completely integrate Elementor with Suki.


Disable Elementor’s default colors and fonts (optional)

By default, Elementor would use its default colors and fonts on all their widgets. It’s highly recommended to disable them, so Elementor widgets will inherit the theme styles. Please follow these steps:

  1. From your Dashboard, go to Elementor > Settings > General (tab).
  2. Check the Disable Default Colors and Disable Default Fonts options.

Set Elementor’s global content width

It’s highly recommended to set Elementor’s global content width to be equal as the theme defined content width. Please follow these steps:

  1. From your Dashboard, go to Elementor > Settings > Style (tab).
  2. Change the Content Width option value to your Container width setting value (as configured on Appearance > Customize > Page Container).

Set Elementor’s “stretched section” CSS selector

Stretched section CSS selector should be pointed to theme’s page selector. Please follow these steps:

  1. From your Dashboard, go to Elementor > Settings > Style (tab).
  2. Set the Stretched Section Fit To option value to #page.

Set Elementor’s responsive breakpoints

It is important to set Elementor’s responsive breakpoints to be same with theme’s responsive breakpoints. Please follow these steps:

  1. From your Dashboard, go to Elementor > Settings > Style (tab).
  2. Set the Tablet Breakpoint option value to 1024px.
  3. Set the Mobile Breakpoint option value to 768px.

Recommended Plugins for Suki + Elementor