How Cart Page Content Updates Automatically When Changing The Quantity
We shall remove the update button and update the cart content(w/o refreshing the page) when changing the quantity or removing the item(s). Here are the simple tips.
Adding Quantity Input Field to Bricks Mini Cart element
The bricks builder has a native side cart element (Mini Cart) for the WooCommerce site. In this tutorial, I shall show how we can add the quantity field with the ‘+’ and ‘-‘ buttons there. So the customer can easily update the cart item’s quantity from there without any page refresh. Step 1: Adding the Quantity Input FieldAdd the following PHP code to your site. You can use the Bricks Child theme’s function.php file or any 3rd party snippets plugin like WPCodex. – OR –
Creating Product Gallery Slider with Nested Slider Element
In this post, I shall show you how you will create the product gallery slider with the bricks’ native nested slider element. Bricks introduced the loop builder and you can use the loop builder in the nested slider element.BricksUltimate created a custom loop builder “Product Galleries” which is fetching the WooCommerce product’s gallery images and displays at the frontend.Before making the slider, make sure that you enabled the Image Attachment element from the Bricks -> BricksUltimate -> General Elements tab.Step 1: Add the section/container/block element as a wrapperStep 2: Add…
Creates Product Cross-sells Section with Query Loop Builder
As per request, the BricksUltimate add-on created a custom provider for the query loop builder and you can make the cross-sells products list (on a single product/ cart page) with the loop builder. Step 1: Linked Cross-sells Products with a Product At first, we shall link the cross-sells product to a product from the dashboard. 1. Login to your dashboard and add/edit a product.2. Click on the “Linked Products” tab3. Add some products in Cross-sells input box4. Save the post Step 2: Make List with Query Loop
Condition Logic for WooCommerce
Bricks 1.5.4 added a powerful feature “Condition Logic”. You can show/hide the content dynamically with it and set up your custom logic from the bricks editor. You do not need any extra code for it. BricksUltimate add-on added the custom condition for WooCommerce shop site. You will get them inside the Bricks’ conditional logic window. Right now there have a few logic. Later logic will increase and users can request the missing logic also. Current Logics: Product is in stock or notProduct is a featured productProduct is a virtual productProduct…
Creating a custom Add To Cart button layout
Someone asked me how we shall create the above Add To Cart button layout in Bricks. BricksUltimate addon implemented this layout in its’ own Add To Cart element.Step 1: You need the BricksUltimate 1.0.9 or later version.Step 2: Open the builder editor, select the Add To Cart element and enable the “Quantity Text” option Step 3: The default text is Quantity. But you can enter the custom text instead of the default text.Step 4: Adjust the default layout style like font size, color, border color, etc. All are available inside…
[WooCommerce + Bricks] Creates free shipping notification bar
BricksUltimate added the Free Shipping Notice element which is creating the free shipping notification bar on your WooCommerse shop site. It is coming with two inbuilt sub-elements: Free Shipping Notice and Free Shipping Bar. You can also display the custom message with the Bricks element and avoid those two sub-elements. Activate Free Shipping Notice Login to your dashboard, go to Bricks -> BricksUltimate -> Misc Tab page and activate the Free Shipping Notice feature. After this, you will open the bricks builder editor. You get two elements under Free Shipping…
Creates Product Upsells Section with Query Loop Builder
As per request, the BricksUltimate add-on created a custom provider for the query loop builder and you can make the upsells products list with the loop builder. Preview Step 1: Linked Upsells Products At first, we shall link the upsells product to a product from the dashboard.1. Login to your dashboard and add/edit a product.2. Click on the “Linked Products” tab3. Add some products in upsells input box4. Save the post Step 2: Make List with Query Loop Navigate to Bricks -> BricksUltimate -> MISC tab and enable the “Ultimate…
Displaying the reviews tab separately outside the WooCommerce tabs
By default description, reviews and additional information show in one ‘tabs’ section in WooCommerce. Want to display ‘reviews’ outside this ‘tabs’ area separately for more user engagement and visibility? You can quickly implement this with bricks builder.
Move the Reviews tab before the Description tab on the single product page
Show the Reviews tab as the first tab on the single product page. Add the following PHP code inside the Bricks’ code block element.