Get Bricks

Collection: Developer

  • 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: $query_vars…
  • 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…