WP Templater
KickStarter FeaturesStyling Block
KickStarter Features

The Styling Block

Use the pre-installed Styling Block in KickStarter to preview and refine your Kadence global styles before building real pages.

The Styling Block is a dedicated page that ships with KickStarter and acts as a live preview of your site's style sheet, so you can dial in global styles before designing real pages.

What it shows

The Styling Block collects your core design elements in one place:

  • Color palette

  • Typography (H1–H6 and body text)

  • Links

  • Cards

  • Buttons

  • Spacing

How to use it

Use the Styling Block as your design workbench: adjust global styles in Kadence and see how they play together before committing to full pages. Because it lives on the home page, you can keep it in view in the Kadence Customizer live preview for instant feedback while you work.

Open Kadence Customizer

Open the Kadence Customizer for your site so you can change global styles and see those changes reflected in the live preview.

Adjust global settings

Tweak global settings like colors, button styles, and image border radius in the Customizer panels. Watch how these updates affect the elements displayed on the Styling Block.

Edit CSS variables in Additional CSS

Refine details such as font sizes, line heights, border radiuses, and card styles by editing your CSS variables in the Additional CSS panel. Use consistent variable names so changes stay predictable across the site.

Check the Styling Block

Review the Styling Block to confirm that colors, typography, spacing, links, cards, and buttons all work together as intended. Iterate between the Customizer and this page until the design feels ready for real content pages.

Configuring your style sheet with the Styling Block

Use the Styling Block as a visual checklist while you configure your site's core styles:

  • Setting up the Kadence color palette

  • Tuning button styles

  • Fine-tuning typography

  • Adjust spacing

  • Testing card designs

After finishing your global styling, the Styling Block can either be deleted or stored as a draft for future reference.

To store it as a draft:

  1. Open the List View.

  2. Select the Styling Block.

  3. Copy the block.

  4. Create a new page.

  5. Paste the block into the new page.

  6. Save the page as a draft.

This way, you keep the styling setup as a reusable reference without leaving it active on your live pages.

Was this page helpful?

Last updated 1 week ago

Built with Documentation.AI