Elementor Advanced Settings

Welcome to IACPATTERNS! Elementor’s advanced settings provide you with more control over the functionality and performance of your website. This guide will walk you through the advanced settings in Elementor, helping you fine-tune your site for optimal results.

Accessing Elementor Advanced Settings

1. Log in to Your WordPress Dashboard
   • Navigate to yourdomain.com/wp-admin.
   • Log in with your WordPress admin credentials.
2. Open Elementor Settings
   • In the WordPress dashboard, go to ‘Elementor’ -> ‘Settings’.
   • Click on the ‘Advanced’ tab to access the advanced settings.

Advanced Settings Overview

1. CSS Print Method

• Internal Embedding: Prints CSS inline within the HTML. This is the default method and works well for most sites.
• External File: Generates a separate CSS file. This method can improve performance by allowing the browser to cache the CSS file.

2. Optimized DOM Output

• Enable: Reduces the size of the DOM (Document Object Model) by optimizing the HTML output. This can improve performance and loading times.
• Disable: Useful if you encounter compatibility issues with other plugins or themes.

3. Improved Asset Loading

• Enable: Loads only the necessary CSS and JS files for the active widgets and features on each page. This can significantly reduce the page load time.
• Disable: Loads all Elementor assets on every page, which may be necessary for compatibility with certain themes or plugins.

4. Switch Editor Loader Method

• Enable: Uses a different method to load the Elementor editor. This can help resolve conflicts with other plugins or server configurations.
• Disable: Uses the default method to load the editor.

5. Regenerate CSS

• Regenerate Files: Clears and regenerates the CSS files used by Elementor. This can resolve styling issues that occur due to changes in themes or plugins.

6. Sync Library

• Sync Library: Manually syncs the Elementor template library. Use this if new templates are not appearing or if there are issues with the library.

7. Role Manager

• Access Controls: Define which user roles can access Elementor and its settings.
• Permissions: Customize permissions for different user roles, such as Editor, Author, and Contributor. This ensures that only authorized users can make changes using Elementor.

8. Maintenance Mode

• Activate Maintenance Mode: Enable maintenance mode to display a custom message while your site is under construction or being updated.
• Coming Soon Mode: Displays a ‘coming soon’ page to visitors while allowing logged-in users to view the site normally.
• Maintenance Mode: Displays a maintenance message to all visitors, including logged-in users.

9. Import/Export Kit

• Export Kit: Export your Elementor settings, templates, and content. This is useful for creating backups or migrating settings to another site.
• Import Kit: Import settings and content from another site. This is helpful for cloning site setups or restoring from backups.

Customizing Elementor in the Editor

1. Global Settings

• Site Settings: Accessed by clicking the ‘Hamburger’ menu (three lines) in the top-left corner of the Elementor editor.
  • Configure global settings for colors, typography, buttons, form fields, and more.
  • Set default styles for elements to maintain a consistent look across your site.

2. Theme Builder

• Access Theme Builder: Available from the ‘Hamburger’ menu in the Elementor editor.
  • Customize your site’s header, footer, single post templates, archive templates, and other theme parts.
  • Create new theme parts or edit existing ones using Elementor’s drag-and-drop interface.

3. Custom Code

• Custom CSS: Add custom CSS to individual elements, sections, or the entire page. This allows for advanced styling beyond the default options.
  • In the Elementor editor, click on an element and go to the ‘Advanced’ tab -> ‘Custom CSS’.
  • Enter your custom CSS code to apply styles directly.

4. Dynamic Content

• Dynamic Tags: Insert dynamic content such as post titles, dates, custom fields, and more.
  • In the Elementor editor, click on an element and look for the ‘Dynamic Tags’ icon (a stack of squares) next to input fields.
  • Choose the desired dynamic tag to automatically pull content from your WordPress database.

Elementor’s advanced settings offer powerful tools for optimizing the performance, functionality, and customization of your WordPress website. By leveraging these settings, you can ensure that your site runs smoothly and looks great. If you have any questions or need further assistance, feel free to reach out to our support team here.

Happy designing💜