Help Center
  • Welcome
  • Setka Editor
    • Getting started
    • Drag-and-Drop & Multiselect
    • Text editing
    • Grids and Layout
    • Images
      • Image Editor
    • Background images
    • Icons
    • Animations
    • Lists
    • Tables
    • Dividers
    • Footnotes
    • Hotspots
    • Enhance Symbols
    • Post templates
    • Buttons
    • Comments and collaboration
    • Embeds
    • Hyphenation
    • Responsive layout for mobile screens
    • Custom CSS
    • Custom JS plugins
  • Setka Content Design System Manager
    • Creating and editing styles
    • Text formats and fonts
    • Styles display for mobile mevices
    • Text and background colors
    • Dividers
    • Icons
    • Components – reusable design elements
      • Creating Components with HTML and CSS
        • CSS in components
        • Component examples
    • Configuring layout grids
    • Editing default elements with Custom CSS
    • Adding team members
  • Account Settings
    • Account settings basics
    • Access rights
    • Billing and subscription
  • Preserve your Setka Editor content after the service shutdown
  • Integrations
    • Setka and WordPress
      • Installing Setka Editor WordPress plugin
      • Launching Setka Editor on the post creation page
      • Setka Editor and WordPress compatibility
      • Setka Editor compatibility with the most popular WordPress plugins
      • Inserting graphs, charts, or diagrams into a post
      • Setka Editor and Google AMP
      • Inserting adverts into a post
      • srcset — the attribute for image size optimization
      • Page load speed optimization settings
        • Autoptimize plugin configuration
      • WordPress troubleshooting: known Issues and how to fix them
      • Preserve your Setka Editor content after the service shutdown
    • Setka and Drupal
      • Setka for Drupal — compatibility, and features
      • Installing Setka modules for Drupal
      • Setka content on AMP pages in Drupal
    • Setka and Magento
      • Installing Magento 2 extension
        • Setka Editor configuration page
      • Preserve your Setka Editor content after the service shutdown
    • Setka and HubSpot
      • Setka Editor and HubSpot Blogs
      • Setka Editor and HubSpot Landing Pages
      • Semi-gated content with a HubSpot form
      • Preserve your Setka Editor content after the service shutdown
    • Setka and Bitrix
      • Preserve your Setka Editor content after the service shutdown
    • Setka and Ghost
      • Copying and pasting posts from Setka to Ghost
    • Setka and SharePoint Online
      • Installing Setka Editor application into SharePoint Online
    • Setka and Zapier
      • Setka and Webflow
        • Exporting new posts
        • Updating exported posts
      • Setka and Shopify
    • Setka and Integromat
    • Content Cloud
  • API
    • Setka Content Cloud API
    • Webhooks
    • API for Custom CMS Integration
      • Introduction to custom integration
      • Integration with Content Design System Manager (CDSM)
        • Initial sync — receiving Setka Editor files to connect them to your CMS
        • Storing and processing Setka Editor files
        • Connecting Setka Editor files to the pages of your site
        • Receiving style updates from the Style Manager and new editor versions
      • Setka Post Editor initialization (JavaScript)
      • Integration with Style Manager (API v1, previous version)
      • Preserve your Setka Editor content after the service shutdown
    • Custom Components API
  • VIDEO TUTORIALS
    • Setka Editor Video Tutorials
  • Components Library
    • Components Library
    • Guide: Ideas for Using Setka Editor’s Components to Improve Content Design
  • Content Experience Design Best Practices
    • Guide To Designing a Great Content Experience
Powered by GitBook
On this page
  • Which CSS files Setka Editor uses
  • Should I enable file minification?
  • Autoptimize configuration options
  • For Common CSS
  • For Standalone CSS
  • For Standalone critical CSS

Was this helpful?

  1. Integrations
  2. Setka and WordPress
  3. Page load speed optimization settings

Autoptimize plugin configuration

PreviousPage load speed optimization settingsNextWordPress troubleshooting: known Issues and how to fix them

Last updated 4 years ago

Was this helpful?

plugin optimizes the pages of your site. It compresses images, caсhes files, minifies JS and CSS. All of the above speeds up page loads. Setka Editor uses specific CSS and JS files when generating pages. Improper optimization may disrupt their operation.

To prevent optimization from changing the look of Setka Editor content, configure Automtimize according to this guide.

Which CSS files Setka Editor uses

Setka Editor uses the following CSS-files and inline blocks:

Standalone CSS — 3 CSS files with styles used only in the specific post.

Standalone critical CSS — styles of the . Speeds up the rendering of content seen by the user at the very top of the page. 3 inline CSS blocks and 2 CSS files.

Common CSS — common rules for all the styles stored on the Setka account. Single CSS file.

Standalone critical CSS — styles of the . Speed up the rendering of content that user sees at the very top of the page. 3 inline CSS blocks and 2 CSS files.

The file connection order is critical for Setka Editor. While using the optimizer (Autoptimize or any other) in the Standalone or Standalone critical mode, it is important to keep the order of CSS code: Common CSS should always come first.

Autoptimize optimizes only the local files. Therefore, enabling Autoptimize for Setka styles makes sense only if the Enable Setka CDN files option is not activated in the Setka Editor plugin settings:

Should I enable file minification?

Even though Setka CSS files have the * .css extension, not *min.css, their content is already minified. Therefore, minification is not necessary. Also, keep in mind that some minifiers can corrupt the CSS code.

Autoptimize configuration options

Here:

  • Default. Only load styles needed for a specific Setka Editor post. — uses Standalone CSS. Set by default.

  • Inline critical post styles into a page and load the rest of the styles asynchronously. — uses Standalone critical CSS.

  • Legacy. Load a combined CSS file with all your Setka Editor styles. — uses Common CSS. Dated option. May slow down page loading, hence, not recommended.

For Common CSS

If Common CSS is used, go to Autoptimize WordPress plugin settings and set the following in the CSS Options block:

  • Activate the Aggregate CSS-files option.

  • Make sure that, the Exclude CSS from Autoptimize: field does not contain the wp-content/uploads/ string. If it is present, remove it.

For Standalone CSS

If Standalone CSS is used, go to Autoptimize WordPress plugin settings and set the following in the CSS Options block:

  • Activate the Aggregate CSS-files option, if you are sure, Setka CSS files should be combined into one file with all other styles on the page. This optimization is redundant in some cases. Setka CSS files already contain a minimal number of styles. If the option is activated, a different combination of 3 files will be used on each page. Therefore, the effect of accelerating the rendering of the first screen in some cases will be overridden by the lack of cache.

  • Make sure that, the Exclude CSS from Autoptimize: field does not contain the wp-content/uploads/ string. If it is present, remove it.

For Standalone critical CSS

In Standalone critical mode, Setka styles are optimized the same way as if they were optimized by Autoptimize. Therefore, it is not necessary to apply optimizations to Standalone critical styles. You can configure Autoptimize in 2 ways:

Minify all styles

Use these settings if you need to combine and minify not only Setka styles but all other styles on the page.

Go to Autoptimize WordPress plugin settings and set the following in the CSS Options block:

  • Activate the Aggregate CSS-files? option.

  • Activate the Also aggregate inline CSS? option.

  • Make sure that, the Exclude CSS from Autoptimize: field does not contain the wp-content/uploads/ string. If it is present, remove it.

Minify all styles, except Setka styles

Use these settings when you need to combine and minify all styles except Setka styles.

Go to Autoptimize WordPress plugin settings and set the following in the CSS Options block:

  • Activate the Aggregate CSS-files? option.

  • Disable the Also aggregate inline CSS? option.

  • Add the wp-content/uploads/setka-editor/ strig into the Exclude CSS from Autoptimize: field.

Autoptimize settings depend on what you are using: Common, Standalone, or Standalone critical. To select the type of CSS, go to Setka Editor WordPress plugin settings:

type of CSS
Autoptimize
first contentful paint
first contentful paint