Introduction
Last updated
Was this helpful?
Last updated
Was this helpful?
Components are what we call our customizable micro-templates that you can create and use over and over again for smaller bits of content throughout your posts and pages—things like CTA boxes, pull quotes, side notes, dividers, captions, and more. Not only can you create reusable layouts for these small elements, but you can make sure each one is branded using your fonts, colors, brand imagery, and styles.
A component in Setka Editor is an HTML template (which sometimes has its own styles) that can be added to the post in the editor’s interface. After the component is added to the post, a designer or editor can change its content. Components consist of components that are created in Setka Editor (see the “” section for more). These components can reference CSS classes which must be defined when copying the code from this library.
Style ID (stk-theme) is one of the important classes to change. For example:
changes to:
Some components have text elements with a given font color. They have classes like `stk-theme_X__color_X_custom_color_Y`, where X is the style ID and Y is the color preset ID. In our code examples, you’ll sometimes see `stk-theme_00000__color_00000_custom_color_...` to help remind you that this is just a sample and you’ll need to fill in your own values.
A component’s HTML code becomes a part of the page markup when added to a post. If you change a component’s code in the Style Manager, components will not change in existing posts.
A component’s CSS styles are connected with the post’s CSS; so, if you change the CSS of the component it will affect all posts that were published before. If you create posts using (e.g., through WordPress, Magento, etc), then you will see the changes almost immediately on your website. However, if you , you’ll need to re-export it again after you make changes in order to see them reflected on your website.