12th Feb '23/4 commentsWP Grid Builder Filters inside Bricks’ OffCanvasSridhar Katakam This Pro tutorial provides the steps to move WP Grid Builder's filters inside the Bricks' native Offcanvas on smaller viewport widths. Let's work with the Posts page as the view. This means: a Page titled Blog was set as the Posts page at Settings → Reading. This Page is being edited with Bricks and a Posts or Query Loop element with the query set to output Posts has been added. Step 1 Create these WP Grid Builder facets: Categories, Reset, Pagination. Step 2 Set up your Posts page's structure to look like this: Step 3 Paste this in the Bricks editor at Settings (gear icon) → PAGE SETTINGS → CUSTOM CODE → Body (footer) scripts: This is a BricksLabs Pro tutorial. For full access login below or create your BricksLabs Pro account Username Password Remember Me Forgot Password Tagged: BricksJavaScriptPluginsProWP Grid BuilderSridhar KatakamSridhar Katakam is a Bricks enthusiast. He likes helping others by researching and solving WordPress-related problems and building websites.Get access to all 633 Bricks code tutorials with BricksLabs Pro
Pro [WooCommerce] Sticky on Scroll Add to Cart section in BricksSetting up a sticky section that fades in when scrolling down and fades away when scrolled to the top.Read more →Categories: Bricks, ProTags: JavaScript, sessionStorage
Dynamic Post Sliders in Bricks with BricksExtras and WP Grid BuilderThis article provides the answer to We are going to set up a Bricks query loop that shows the posts of a Custom Post Type…Read more →Categories: Bricks, Free, PluginsTags: BricksExtras, Pro Slider, WP Grid Builder
Pro How to hide Bricks Query Loop Posts until WP Grid Builder Facets are appliedHow to hide the Bricks QL posts until there’s an interaction by the user on the frontend like ticking a category or typing in a…Read more →Categories: Bricks, Plugins, ProTags: WP Grid Builder
Pro How to Limit a WP Grid Builder’s Term Grid to Only Current Post TermsIn the WP Grid Builder Facebook group (unofficial), a user asks: Hi All, I'm looking for a way to update the contents of a grid…Read more →Categories: Plugins, ProTags: WP Grid Builder
Pro Opening Submenus with Click Instead of Hover in BricksThis Pro tutorial provides the code for opening submenus with click instead of hover in Bricks. Step 1 Add this in child theme's style.css: Step…Read more →Categories: Bricks, ProTags: JavaScript, Nav Menu
Pro Grid.js in BricksThis Pro tutorial provides the steps to use Grid.js in a WordPress site powered by Bricks builder. Grid.js is a lightweight and performant JavaScript library…Read more →Categories: Bricks, ProTags: Grid.js, JavaScript
Setting Active Tab in Bricks’ Tabs (Nestable) ElementWith Bricks' Nestable tab element, here's how we can set which tab is active by default.Read more →Categories: Bricks, FreeTags: JavaScript, Tabs
Move Color Palette Selector To Top in Color PopupWe look at one way to move the color palette selector in the builder from the bottom of the popup to the top.Read more →Categories: Bricks, FreeTags: Editor Tweaks, JavaScript, MutationObserver
Pro Stock Quantity Block for WP Grid BuilderIn the unofficial WP Grid Builder Facebook group a user asked: Is it possible to show stock quantity on the card? I can't find it…Read more →Categories: Plugins, ProTags: WP Grid Builder