Collection: Developer
Filter: bricks/query/force_run
Bricks has enhanced query performance in 1.9.1. Now, each unique query is executed only once per page load, and subsequently,… ...
Filter: bricks/query/result_max_num_pages
This filter allows you to modify the query result maximum number of pages (@since 1.9.1). This value is used for… ...
Filter: bricks/frontend/render_data
The filter allows you to modify the rendered content for different areas like header, content, and footer before it's displayed… ...
Filter: bricks/active_templates
Modify the templates applied on a page programmatically (@since 1.8.4) This is an alternative to setting an active template via… ...
Bricks CLI
Bricks 1.8.1+ integrates with the WP-CLI (WordPress Command Line Interface). Allowing you to perform specific tasks from your server's command… ...
Create Your Own Dynamic Data Tag
This article is intended for developers who wish to create a custom dynamic data tag within the builder. The desired… ...
Filter: bricks/query/result_count
This filter allows you to modify the query result count (@since 1.8). ...
Filter: bricks/query/result
Available since 1.8, this filter lets you customize the query results and implement additional logic. Like modifying the post, term,… ...
Filter: bricks/default_page_title
Since 1.8, Bricks automatically adds default page titles to all non-Bricks pages. However, if you wish to customize or remove… ...
Action: bricks/query/after_loop
If you are creating a custom query loop or a custom plugin, you might want to perform some additional tasks… ...
Action: bricks/query/before_loop
If you are creating a custom query loop or a custom plugin, you might want to perform some additional tasks… ...
Filter: bricks/content/html_before_end
Available since version 1.6, this filter allows you to customize or insert HTML strings before closing main tag. ...
Filter: bricks/content/html_after_begin
Available since version 1.6, this filter allows you to customize or insert HTML strings after main tag, before rendering bricks… ...
Filter: bricks/registered_post_types_args
Available since version 1.6, this filter allows you to customise the post type args that are used to query the… ...
Filter: bricks/screen_conditions/scores
Bricks selects the template & theme style for a specific page according to the conditions you've defined. Internally this is… ...
Filter: builder/settings/{type}/controls_data
This filter allows you to add new controls to the Page Settings or Template Settings panels in the builder. To… ...
Function: bricks_render_dynamic_data
This helper function will render the dynamic data tags inside of a content string (@since 1.5.5). Parameters: $content - a… ...
Filter: bricks/comments/timestamp
When using the Bricks Post Comments element, the comment default timestamp text will show the time difference since it was… ...
Filter: bricks/body/attributes
Filter to add HTML attributes to the body tag (@since 1.5). ...
Filter: bricks/footer/attributes
Filter to add HTML attributes to the footer tag (@since 1.5). ...
Filter: bricks/header/attributes
Filter to add HTML attributes to the header tag (@since 1.5). ...
Filter: bricks/content/attributes
Filter to add HTML attributes to the main tag (@since 1.5). ...
Filter: bricks/is_layout_element
Allows to define your custom elements as a layout element, so they are recognised like the section, container, block, div… ...
Filter: bricks/dynamic_data/post_terms_links
When rendering the terms assigned to a post using the dynamic data tag {post_terms_my_taxonomy}, Bricks wraps each term with a… ...
Filter: bricks/link_css_selectors
Use this filter in your child theme to overwrite/extend the CSS selectors the "Theme Style > Link" settings are applied… ...
Filter: bricks/element/settings
Bricks 1.5 adds the possibility to change the element settings before it is rendered. This allows you to change a… ...
Nestable Elements (API)
Bricks 1.5 introduces Nestable Elements. Plus an API that allows you to programmatically define your own custom elements that can… ...
Filter: bricks/element/render
Bricks 1.5 introduces the new bricks/element/render filter. This filter enables you to implement your own conditional display logic programmatically. This… ...
Filter: bricks/elements/{element_name}/control_groups
Since Bricks 1.4 it is possible to add custom control groups to a specific element like so: Note: the above… ...
Filter: bricks/element/set_root_attributes
Bricks 1.4 with its improved & slimmer DOM structure now requires to add the element ID, root classes, and other… ...
Filter: bricks/users/query_vars
Bricks users query variables can be manipulated before the query runs like so: The filter callback receives three arguments: $query_vars… ...
Filter: bricks/terms/query_vars
Bricks terms query variables can be manipulated before the query runs like so: The filter callback receives three arguments: Example… ...
Filter: bricks/query/loop_object
The Bricks Query Loop supports 3 types of queries by default (Posts, Terms, and Users). But it can be extended… ...
Filter: bricks/query/run
The Bricks Query Loop supports 3 types of queries by default (Posts, Terms and Users). But it can be extended… ...
Filter: bricks/setup/control_options
Bricks offers a WordPress filter to add or remove control options. The control options are used throughout Bricks and allow… ...
Filter: bricks/assets/load_webfonts
Bricks 1.4 introduces the possibility to "Disable Google Fonts". Either via the Bricks settings under "Performance" or programmatically using the… ...
Filter: bricks/code/disallow_keywords
Bricks 1.3.7 introduces another level of security when using the Code element to run code, e.g. when the "execute code"… ...
Filter: bricks/posts/merge_query
Since Bricks 1.3.7 you'll be able to decide if a certain element query should be merged with the WordPress main… ...
Filter: bricks/element/render_attributes
Starting with Bricks 1.3.7 you may manipulate the HTML attributes of a given element using the following filter: The filter… ...
Filter: bricks/dynamic_data/read_more
If you use the dynamic data tag Read more you'll get an anchor tag (link) to the post with the label… ...
Filter: bricks/related_posts/query_vars
Since Bricks 1.3.5 you may manipulate the related posts element query vars before the query is performed like so: The filter callback… ...
Filter: bricks/dynamic_data/exclude_tags
Dynamic data tags are strings with a special syntax wrapped by curly brackets. Sometimes this syntax has conflicts with other… ...
Filter: bricks/dynamic_data/replace_nonexistent_tags
Dynamic data tags are strings with a special syntax wrapped by curly brackets. Sometimes this syntax has conflicts with other… ...
Filter: bricks/posts/query_vars
Since Bricks 1.3.2 you may manipulate the posts, products, or Query Loop elements query vars before the query is performed… ...
Filter: bricks/elements/{element_name}/controls
Since Bricks 1.3.2 it is possible to add custom controls to any element like so: Note: the above example adds… ...
Filter: bricks/dynamic_data/post_terms_separator
Programmatically set the post term separator like so: ...
Text Transform Control
Use the text-transform control to allow users to set the text-transform CSS property like so: ...
Text Decoration Control
Use the text-decoration control to allow users to set the text-decoration CSS property like so: ...
Text Align Control
Use the text-align control to allow users to set the text-align CSS property like so: ...
Direction Control (Flexbox)
Use the direction control to allow users to set the flex-direction CSS property of your CSS flexbox layout. ...
Justify Content Control (Flexbox)
Use the justify-content control to allow users to set the justify-content CSS property (alignment along the main-axis) of your CSS… ...
Align Items Control (Flexbox)
Use the align-items control to allow users to set the align-items CSS property (alignment along the cross-axis) of your CSS… ...
Apply Control
The apply control saves your settings. You can set the reload control property to true in order to trigger a… ...
Filter: bricks/builder/elements
Determine which elements to use in Bricks by out-commenting the ones you don't want to use. There is a full… ...
Filter: bricks/builder/standard_fonts
Place and customize the following filter to display a different set of web-safe fonts in the typography control. add_filter( 'bricks/builder/standard_fonts',… ...
Filter: bricks/builder/save_messages
Place and customize the following filter to display different save message every time you manually save your progress when editing… ...
Filter: bricks/builder/map_styles
This filter allows you to define your own custom map styles for the Map element. The example below shows how… ...
Filter: bricks/builder/i18n
Place and customize the following filter to add translatable string to the builder. add_filter( 'bricks/builder/i18n', function( $i18n ) { //… ...
Filter: bricks/builder/color_palette
Place and customize the following filter to display a different default color palette for the color control. add_filter( 'bricks/builder/color_palette', function(… ...
Typography Control
The typography control provides the following CSS properties: colorfont-sizetext-aligntext-transformfont-familyfont-weightfont-styleline-heightletter-spacingtext-shadowtext-decoration Use the exclude parameter to hide specific typography properties. Set popup to… ...
Text Shadow Control
The text-shadow control displays a popup that lets you set the CSS text-shadow of a specified HTML text element. Resources… ...
Textarea Control
The textarea control displays a textarea input field. You can set the following parameters: rows (number. Default: 5)readonly (true/false. Default: false)spellcheck (true/false.… ...
Text Control
The text control displays a text input field. You can set the following parameters: spellcheck: true/false. (Default: false)trigger: 'keyup'/'enter'. (Default:… ...
SVG Control
The SVG control lets you select an SVG (Scalable Vector Graphic) file from the media library. The selected SVG returns… ...
Slider Control
The slider control shows a draggable range input field. Default units are px, em and rem. You can set the… ...
Select Control
The select control lets you select an option from a dropdown. It can be used to render content or CSS… ...
Repeater Control
The repeater control lets you create repeatable fields. Fields can be cloned, deleted, and sorted via Drag & Drop. Use… ...
Query Control
The query control lets you set query arguments to retrieve items of any post type. Use the returned value to… ...
Number Control
The number control represents a simple number input field. It has the following custom properties: units (optional: boolean or array)unit… ...
Link Control
The link control give you the choice of different link types: Internal post/pageExternal URLPopup (image, video) ...
Info Control
The info control does not affect the HTML or CSS on the frontend. It serves as a builder-only helper controls… ...
Image Gallery Control
The image gallery control lets you select multiple images from your media library. Once images have been selected you can… ...
Image Control
The image control lets you select a single image from your media library. Once an image has been selected you… ...
Icon Control
The icon control lets you select and output icons from the following icon font libraries: Fontawesome 6Ionicons 4Themify The user… ...
Gradient Control
The gradient control lets you define an unlimited number of gradients that you can apply to text, background, and as… ...
Filters Control
The filters control offers the following CSS filters: blur, brightness, contrast, hue, invert, opacity, saturation, sepia. All sections, rows, columns,… ...
Editor Control
The editor control provides the default WordPress editor. To directly edit content in the builder preview set the inlineEditing properties.… ...
Dimensions Control
The dimensions control is perfect for adding multi-directional CSS properties such as margin and padding (top/right/bottom/left). You can set the… ...
Datepicker Control
The datepicker control provides a great interface for selecting a specific date and time and outputting it in the format… ...
Color Control
The color control is a custom-built color picker that you won't find anywhere else. It lets you pick and adjust… ...
Code Control
The code control embeds a code editor utilizing the amazing CodeMirror library. Users for which you've enabled "Code Execution" in… ...
Checkbox Control
The checkbox control is a simple on/off switch. If enabled it outputs a boolean value of true. Disabled it returns… ...
Box Shadow Control
The box-shadow control is a CSS control and you can set the following properties: Offset XOffset YSpreadBlurColorInset Resources https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow ...
Border Control
The border control lets you set the following border properties: Border width (top/right/bottom/left)Background style (top/right/bottom/left)Background color (none/solid/double/dotted/dashed)Border radius (top/right/bottom/left) The example below… ...
Background Control
The background control lets you set the following background properties: Background colorBackground imageBackground video (requires bricksBackgroundVideoInit script. See code example… ...
Audio Control
The audio control lets you select an audio file from the media library. It also gives you various options to… ...
Element Controls
Element controls allow the user to change the content and appearance of an element. You can define the controls of an… ...
Create Your Own Elements
The Bricks child theme, which you can download from your account includes a simple custom element for demonstration purposes. The… ...
Child Theme
Please do not edit any of the Bricks theme core files directly, as all your changes will be lost, when updating… ...