bricks_create_theme_style

Phase 2AdvancedComplexity: 7/10

Create a new theme style configuration

Overview

Creates a new theme style in Bricks Builder with optional display conditions and initial settings. Theme styles define site-wide typography, colors, link styles, contextual spacing, and per-element defaults.

Multiple theme styles can coexist — conditions control which applies where. Specificity scoring determines priority: specific page ID > front page > post type > entire site (« any »).

Use this when you need a separate visual style for specific sections of a site, such as a blog layout with different typography or a shop style with different button defaults.

Key Features

Conditional Application

Attach conditions to control where the theme style applies: entire site, specific post types, archive types, taxonomy archives, front page, search results, or specific post/page IDs.

Full Initial Settings

Provide initial settings in the same format as bricks_update_theme_styles, including typography scale, heading margins, link styles, contextual spacing, and element defaults.

Auto-Generated ID

The style_id is auto-generated from the label if omitted, creating a clean slug for referencing the style in future updates.

Specificity Scoring

When multiple theme styles have overlapping conditions, the one with the highest specificity score wins. Specific ID > front page > post type > entire site.

When to Use

Setting up a new site that needs a custom theme style from scratch
Creating a secondary theme style for a specific section (e.g., blog, shop, landing pages)
When the default Bricks theme style needs to be replaced entirely
Building multi-layout sites where different page types need different typography or element defaults

Prerequisites

Bricks Builder must be installed and activated
Color palette should be set up first so theme style can reference color variables
Understanding of which pages/post types will use this style

When NOT to Use

When modifying an existing theme style (use bricks_update_theme_styles instead)
When you only need one site-wide style — just update the existing "default" theme style
When making minor typography changes to the existing style

Parameters

4 Total Parameters1 Required3 Optional

labelstringREQUIRED

Theme style display name (e.g., "Default", "Blog Style", "Shop Style"). Shown in Bricks settings UI.

style_idstringoptional

Theme style ID/slug. Auto-generated from label if omitted. Used to reference this style in future update/delete calls.

settingsobjectoptional

Initial settings. Same format as bricks_update_theme_styles. Keys are section names: typography, colors, general, links, contextualSpacing, css, section, container, button, heading, text, image, form, etc.

conditionsarrayoptional

Display conditions — when this theme style should be active. Each condition object has: main (condition type), postType (array of post types), archiveType (string), ids (array of post/page IDs), exclude (boolean to invert). Higher-scoring conditions take priority.

Code Examples

Create a blog-specific theme style

Create a theme style with different typography that only applies to blog posts.

JSON

{
  "label": "Blog Style",
  "settings": {
    "typography": {
      "typographyBody": {
        "font-family": "Georgia",
        "font-size": "18px",
        "line-height": "1.8"
      },
      "typographyHeadingH1": {
        "font-size": "42px",
        "font-weight": "700",
        "line-height": "1.2"
      }
    },
    "container": {
      "_width": "780px"
    }
  },
  "conditions": [
    {
      "main": "postType",
      "postType": ["post"]
    }
  ]
}

Response

{
  "success": true,
  "style_id": "blog-style",
  "message": "Theme style 'Blog Style' created successfully."
}

Common Mistakes

Warning: Undefined array key "fix_description" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 47

Deprecated: preg_replace(): Passing null to parameter #3 ($subject) of type array|string is deprecated in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-includes/kses.php on line 1939

Warning: Undefined array key "wrong_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 48

Warning: Undefined array key "right_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 49

A theme style without conditions will not apply anywhere. Always set at least one condition (e.g., main: "any" for entire site, or main: "postType" for specific post types).

Warning: Undefined array key "fix_description" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 47

Deprecated: preg_replace(): Passing null to parameter #3 ($subject) of type array|string is deprecated in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-includes/kses.php on line 1939

Warning: Undefined array key "wrong_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 48

Warning: Undefined array key "right_code" in /var/www/vhosts/mcpbricksbuilder.wecode.swiss/httpdocs/wp-content/themes/bricks/includes/elements/code.php(236) : eval()'d code on line 49

If two theme styles have the same condition (e.g., both set to "any"), the one created later may override the first. Use specific conditions to avoid conflicts.

Tips & Warnings

Tip: For most sites, you only need one theme style with condition "any" (entire site). Only create additional styles if different sections of the site need fundamentally different typography or element defaults.

Tip: Condition specificity order (highest to lowest): specific page/post ID > front page > post type > entire site (« any »). This means a style targeting a specific page will always override a site-wide style.

Warning: Bricks uses "any" for entire-site conditions, NOT "entireSite". Similarly, use "frontPage" (camelCase), not "front_page".

Return Values

Field	Type	Description
`success`	boolean	Whether the theme style was created successfully.
`style_id`	string	The ID/slug of the newly created theme style.
`message`	string	Confirmation message or error description.

Related Tools

Technical Details

Tool ID

bricks_create_theme_style

API Endpoint

/design-system/theme-styles

HTTP Method

POST

Namespace

design-system

Source File

design-system/theme-styles.ts

Version

1.0

Min Bricks Version

1.9

Requires Auth

Yes

Changelog

v1.0

Initial release with conditions support and full settings initialization.

20250101