What would you like to know?
Collection: Developer
Filter: bricks/get_element_data/maybe_from_post_id
The bricks/get_element_data/maybe_from_post_id filter, available @since 1.11, allows you to specify an additional post ID from which to retrieve element data.… ...
Filter: bricks/query/init_loop_index
The bricks/query/init_loop_index filter, available @since 1.11, allows you to modify the initial loop index when using various query types in… ...
Filter: bricks/allowed_html_tags
Starting at version 1.10.2 Bricks restricts the allowed HTML tags to the WordPress core logic for wp_kses_allowed_html( 'post' ). This… ...
Filter: bricks/nav_menu/menu
The bricks/nav_menu/menu filter allows you to modify the navigation menu dynamically in Bricks Builder based on your conditions. In the… ...
Filter: bricks/code/disable_execution
This PHP filter allows you to disable code execution within the Bricks builder programmatically. It takes precedence over the bricks/code/allow_execution… ...
Custom JavaScript events in Bricks
Bricks offers a range of custom JavaScript events that you can leverage to enhance the functionality and interactivity of your… ...
Filter: bricks/code/echo_function_names
Starting at Bricks 1.9.7, you must explicitly allow any function names you want to call via Bricks' dynamic data echo… ...
Filter: bricks/code/allow_execution
An alternative to the Disable code execution setting under Bricks > Settings > Builder Access. You can use this PHP… ...
Steps to identify and repair a compromised Bricks site
In this post, we'll discuss the security vulnerability discovered in Bricks on February 10th, 2024, for which we provided a… ...
Action: bricks/generate_css_file
If your CSS loading method is set to External files, this hook will be triggered when a CSS file is… ...
Filter: bricks/builder/image_size_options
The bricks/builder/image_sizes hook gives developers the ability to customize image size options in the builder. By default, when working within… ...
Filter: bricks/auth/custom_reset_password_redirect
This filter provides a way to change the redirect page ID for the reset password page. Example Usage: Parameters: Return: ...
Filter: bricks/auth/custom_registration_redirect
This filter allows for the customization of the redirect page ID for the registration page. Example Usage: Parameters: Return: ...
Filter: bricks/auth/custom_lost_password_redirect
This filter enables the modification of the redirect page ID for the lost password page. Example Usage: Parameters: Return: ...
Filter: bricks/auth/custom_login_redirect
This filter allows customization of the redirect page ID for the login page. Example Usage: Parameters: Return: ...
Filter: bricks/auth/custom_redirect_url
This filter is distinct from other authentication-related filters in that it provides a broad scope for customizing redirections during authentication… ...
Filter: bricks/search_form/home_url
The bricks/search_form/home_url filter allows developers to customize the action URL of the search form within the Bricks theme. This filter… ...
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/assets/generate_css_from_element
This filter allows you to include your custom query loop supported element to generate the children styles in Bricks. (@since… ...
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
Programmatically add HTML attributes to the footer tag. ...
Filter: bricks/header/attributes
Programmatically add HTML attributes to the header tag. ...
Filter: bricks/content/attributes
Programmatically add HTML attributes to the main tag. ...
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 Styles > 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
This filter introduces another level of security when using the Code element to run code. With the filter bricks/code/disallow_keywords you'll… ...
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 updating the theme will cause all your changes… ...