This release introduces multiple significant styling-related changes (plus one possible breaking change in regard to the position). Please read this changelog entry carefully before updating.
Breaking Change
If you experience layout offsets (top, right, left, bottom, z-index) this is most likely because of the removal of the position: relative Bricks default.
You can quickly globally restore this style by adding the following CSS to the style.css file of your Bricks child theme (or via the “Custom CSS” Bricks setting):[class*=brxe-] { position: relative; }
You can also run the new Add "position: relative" as needed converter option, which adds position: relative to your elements as needed:
If you notice an element that should have position: relative added after the converter, but didn’t, please let us know, so we can improve the converter according to your feedback.
Custom Breakpoints (experimental)
You can now edit the default breakpoints, add your own custom breakpoints, set a different base breakpoint, and use a mobile-first design approach.
Mandatory read: https://academy.bricksbuilder.io/article/responsive-editing/#custom-breakpoints
Also possible in 1.5.1: Custom CSS per breakpoint 😉
Cross-domain copy & paste
Copy & paste Bricks elements & styles cross-domain. As this new solution utilizes the Clipboard API you need to allow the paste in the target when prompted.
If you are using Firefox you need to follow the steps outlined here to enable the cross-site copy & paste: https://academy.bricksbuilder.io/article/known-issues/#copy-paste
Dynamic Data: Toggle between tags & actual data
You can now render dynamic data directly inside the builder by enabling the “Render dynamic data text on canvas” setting under Bricks > Settings > Builder > Dynamic Data.
More visual margin & padding UI (& number control)
We’ve retired the old “dimensions” control that we’ve used throughout the builder, which had numbers & units separated and all four directions aligned horizontally in one row with a more intuitive & visual spacing control.
The number + unit control is now also unified into one value (number & unit).
Full changelog
- Custom BreakpointsNew
- More visual margin & padding UI (Spacing control)New
- Custom CSS per breakpointNew
- Set Fallback FontsNew
- Cross-Domain Copy & PasteNew
- Dynamic Data: Toggle between tags & actual dataNew
- Builder: Parse Dynamic Data in colorsNew
- Display flex & alignment controls for non-layout elements (Style > Layout)New
- Maps element: Add min & max zoom level optionsNew
- Select & Load Only Specific Google Font VariantsNew
- New Converter option: Add “position: relative” as neededNew
- Builder: Generate control placeholder values from computed stylesImprove
- Remove “position: relative” default from elementsImprove
- Template import: Don’t add ‘__imported’ to class name if class already exists locallyImprove
- Shape Divider: SVG min-width & min-height issueImprove
- Nestable slider: Default arrows missingImprove
- Nestable Slider: Rename Direction ‘horizontal’ to ‘vertical’Improve
- Background video: Do not add the video wrapper if dynamic data is emptyImprove
- Video element: Render YouTube & Vimeo IDs inside the video element if using dynamic data tagsImprove
- Background image: background-size rule added multiple times if set to “custom”Improve
- Rename “Autoplay speed in ms” to “”Autoplay delay in ms”Improve
- Posts query: ADD ‘post__in’ to ‘orderby’ dropdownImprove
- Export template: Include page settingsImprove
- Nested slider: Use more specific selector to init scriptImprove
- Video background with dynamic data: Not showing on canvasFix
- Builder: Hide ‘No results found’ message (for a11y only)Fix
- Builder: Click on Code element doesn’t scroll it into view on canvasFix
- Custom Fonts: Empty font-style generates a validation errorFix
- Using CPT product without WooCommerce causes errorFix
- Woo: Product Custom Taxonomy archive not workingFix
- Animate CSS: Wrong classesFix
- Heading: Copy styles misses “Separator” settingFix
- var() input on margin/padding and lower breakpointsFix
- Panel: Tooltip creates horizontal overflowFix
- ACF Group inside of an ACF RepeaterFix
- Infinite Scroll: Not working on CPT archive or custom taxonomy archiveFix
- Exporting template saved as draft: Generated file is emptyFix
- Change Template Type: template isn’t editable anymoreFix
- Posts element: List + Content middle-right & alternate image direction on mobile fixFix
- Font styles revert when switching breakpointsFix
- Nestable slider: Missing background image using padding optionFix
- Template shortcode render issue inside builder: Lazy loading enabled, no backgroundFix
- Divider element doesn’t showFix
- Gradient/Overlay: angle 0 (zero) missing on frontendFix
- Error in Czech translation broke the builder (sprintf)Fix
- PhotoSwipe error in Nestable Tabs + Query Loop with image link set to lightboxFix
- Structure Panel: Context Menu position with scroll into viewFix
- Logo Element: SVG shows only text after updating to 1.5Fix
- Query Loop of a Post content (source: Bricks) in an archive template: Background images not showing if not using dynamic dataFix
- Icon List: Transition not applied correctlyFix
- Countdown: New settings ‘Align main axis’ & ‘Align cross axis’ settingsFix
- Animated Typing: Changing speed doesn’t reflect in builder without canvas reloadFix
- Logo element: Using dynamic data with external URLFix
- Comments element title shows “Bricks”Fix
- Image + Caption: Missing position relative on wrapperFix
- Icon element: SVG “Fill” doesn’t apply if SVG is linkedFix
- New Filter: bricks/comments/timestampFix
- Dynamic data: 3rd party custom fields assigned to a CPT not showing the tag picker and preview cannot render themFix
- Posts layout ‘Metro’ & ‘List’: Render non-featured image posts as wellFix
- Flex direction control: After clearing the setting the highlight is not correctFix
- Layout elements: Change “display” control, and then clearing it doesn’t return to defaultFix
- Gradient control: Transparency pattern overflowsFix
- Bricks Settings: Custom CSS (Backslash gets removed on save)Fix
- Some translations were always in EnglishFix
- Post title inside query loop rendered multiple timesFix
- Flex-wrap setting should show inherited value as placeholder on smaller breakpointsFix
- Select flex Direction “Reverse” removes highlight for Horizontal (row) buttonFix
- Fix W3 validator errors when using lazy loadFix
- Pods: Custom Taxonomy & User Fields not showing in dynamic data pickerFix
- Custom CSS “root” issuesFix
- Products element: Placeholder image is missingFix
- Nestable Slider: Arrows always showFix
- Nestable Slider in Template element: Missing styles (external files)Fix
- Icon element: SVG “Color” on hover not appliedFix
- Basic Text: Text on canvas isn’t editable with tag other than “div”Fix