Bricks Builder - Single Product and Shop Templates - WooCommerce Filters, Cart and Checkout Tutorial

[@aaqilayden373]

Very useful tutorial. Not many on bricks yet out there so thank you for this.

[@amrfarrouh]

Thank you so much Imran for this useful tutorial and its very easy to customize woocomerce shop , cart and checkout comparing to elementor and extra addons or extra plugins

[@GeorgeWebDevCy]

Useful walkthrough my friend. Thanks for running through it.

[@websquadron]

No problem 👍

[@skjelstad777]

I love your Bricks Tuts 😁🥰

[@websquadron]

Many thanks :)

[@nikkihstokes]

Really helpful seeing these in action, thanks.

[@Lerklinten]

Perfect as always 🎉

[@VijayKumarIM]

I feel like you are more enjoying playing with Bricks. So much flexibility and fun building with it. 👏

[@websquadron]

I am!

[@edycerpa]

Instead adding margin between columns, try using gap to the parent element, this will make responsive spaces

[@websquadron]

Yup just realised that last night :)

[@ElementoryMyDearWatson]

That was really helpful Imran, thank you so much.

[@elevateyourcreativeness]

Could use a nested container to stack your quantity and button side by side

[@websquadron]

Good point, thanks Greg :)

[@elevateyourcreativeness]

@@websquadron you are most welcome!

[@fabiankochendoerfer]

so if I sell a t-shirt or print I cannot even set up different sizes like small, medium, large, extra large and also different materials or colors like blue, red, green in the single product page? - or is that possible? why did nobody ever explained this? - this is super important for running an actually shop - thanks!

[@websquadron]

Let me double check.

[@fabiankochendoerfer]

@@websquadron thanks! I wrote Thomas in the forum this: Hi Thomas, I researched all day and could not find an answer. I got my license just two days ago. I need product variations in WooCommerce builder. A product - my prints - need to have different sizes and different prices with different materials. Example: 4 sizes, 3 different materials like paper, canvas, acrylic print. So that is 12 variations for the same image. Each variation has its individual price (and cost) obviously. If your WooCommerce builder cannot do that it is absolutely useless. These variations are absolutely essential in running a shop. T-shirs come in different sizes and colors too. So far I have not seen anyone setting a product up like this and also could not find any tutorial in the academy. Why? Please don’t get me wrong here - I am actually rebuilding my website just because of Bricks !!! I find the combination of Astra Pro + Elementor Pro way too confusing and useless. So I am hoping Bricks can do it better. Please let me know if and how this is possible. Thanks! Best, Fabian

[@davidwalls2304]

Thank you for this video Imran. Bricks appears to cover the customization of Woo components similar to how JetWooBuilder did in the past. One question, how did adding WooCommerce affect the page speed scores? Does WC code run on all pages requiring a separate plugin to prohibit that code execution? Thank you.

[@websquadron]

It knocked the home page down from 100% to 84% - however if Asset Clean Up was used to stop Woo running on the Home Pages - then the score jumped back up again.

[@StellaM22]

I wish you showed all the other pages in the checkout process, I am stuck on "order receipt page" what is meant to go in here? Thanks

[@goodchoices5125]

Hi, any chance to test, review the combination of Bricks, Winden and Nintu? I have found this to be the perfect setup for me - after trying out many tools. Fast, easy and pro designer quality.

[@websquadron]

Only when I have the Tools provided for free otherwise I have to cover the overheads.

[@KariposTheOne]

I really have a feeling that you will fall in love with Bricks or Breakdance 😂

[@websquadron]

I'm holding out on Breakdance until they have a final version.

[@BawlBag]

Ain't no one in their right mind paying hundreds per year for Breakdance over a one off payment in Bricks

[@androidhowto45]

I really want to try to switch for speed purposes but one of my review plugins only has elementor widgets. I tried short codes and it didn't work. I think that's the issue with these new builders ..3rd party dev support.

[@websquadron]

Yup there will be some grey areas as to what you can do. I’m sure that the 3rd party devs are eyeing up their own Bricks Addons. Were there any specific features you needed?

[@wotevermajorlooser]

There are certain fields from checkout that I cannot remove, e.g. additional information? and how can i edit the text of certain fields.

[@HiImRack]

Has anyone decided to use Bricks over Elementor yet? Any use case that make Bricks a better page builder solution than Elementor?

[@websquadron]

There are a few from my Live Chat that have. Over time I do think that Bricks will get stronger.

[@akivamajowka5742]

Every

[@MattHolztrager]

Those filters seem to working extremely fast. Other filtering plugin have varying levels of filtering speed-- How would you say these stack up? Are the built in filters with Bricks the fastest you've seen? Also, how good is the search filter? Could I just put the search filter standalone into my header and use it as my main shop search functionality, or do you feel like it lacks anything?

[@websquadron]

It’s really good. You could test it in the header.

[@alejandrozunino5428]

thank you, but not found, create template cart but don`t update, and remove template and show the cart, reinstall clean woocommerce but is same. 😞

[@PicSta]

Not tested it, just theory here, but the quantity and add to cart button should float next to each other if you use a display inline. Or you have to make use of the given CSS classes and use this to style them next to each other. Inspect the quantity field and the button, maybe this shows you how it could work. Hope my thoughts help you.

[@philipgebhardt3453]

Hey, can you do a video based on using Bricks with custom post types? I use a plugin called Pods.

[@websquadron]

That's on my upcoming list :) Hopefully by next week.

[@philipgebhardt3453]

@@websquadron nice one!

[@artisanbusiness1314]

Hi Imran, Can you answer the following? How do i make my buttons hover with a different colour? How do i make my button 100% of column width?

[@websquadron]

Go to the class, click on Hover, and then add your changes in terms.

[@NOALNOM]

#GoodByeElementor #HelloBricks

[@unprofor10]

flex box , column mode the it is side by side

[@user-to7ni1lv5j]

why does the section disappear under the header?

[@davidknecht6865]

That the quantity and add to cart are side by side, I have solved with a style: .woocommerce-variation-add-to-cart.variations_button { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }

[@websquadron]

Excellent. :) :)

[@blakeXYZ]

Can Bricks' woocommerce 'Product Filter' element be used to filter Custom Fields? I'd like to filter Archived Blog Posts. Ideally, I'd like to buy one less plugin and use Bricks elements. Thanks!

[@websquadron]

Not tried that yet.

[@ReheatedDonut]

Somehow my buttons don't have a hover colour, and there's no option under in Bricks "Settings > Theme Styles > Woo Button" Do you know where I set this? Thanks.

[@websquadron]

Are you clicking the state at the top of the screen (left side) and activating the Hover State to then select the colour.

[@ReheatedDonut]

@@websquadron I didn't even see that. Just moved from Oxygen to Bricks and fubmling my way around!

[@maayanzilberberg2523]

How can I do compare products and wishlist including showing them on navbar like jetwoobuilder (that now working with bricks)? Thanks

[@websquadron]

I'd have to look into that - but that would be as 1-2-1 Consultation time.

[@maayanzilberberg2523]

@@websquadron what is that mean? How much?

[@websquadron]

I don't have any recommended plugins yet without testing them with Bricks. Normally I would just tell you, but if I have to spend time on researching then I charge for Consultation time. Please note that I am not recommending you do that as you could search Google or ask others for advice, but if you did want some 1-2-1 support, then I charge £160 per hour. @@maayanzilberberg2523

[@ThePretendgineer]

How do you get the product data to show in the editor? There's no woocommerce options at all for me under populate content.

[@websquadron]

It should bring it automatically if you've set it as a Single Product Template.

[@ajitjadhav9040]

Hello dud , I want to create video streaming website with content restriction??

[@websquadron]

Use Paid Membership Pro to restrict access to pages. kzbin.info/www/bejne/oKSvYY1jiNOKi80

[@ninjaoftherift1620]

Have you tried oxygen ?

[@websquadron]

Seen it, but not my preferred tool (yet).

[@drteddyweb]

I think that Product Filters don't work as they should. If I click a specific product category, although products are displayed correctly the filter does not have selected the respective category.

[@websquadron]

Is the Query set to Current Query?

[@drteddyweb]

@@websquadron Where is "Current Query"? I can't find it in "Products" element

[@KomentarSaya]

hi imron, please make this video again without woocommerce, only metabox or CPT, and add Whatsapp button in every product,

[@websquadron]

Yup, and will you pay me for my time to produce it? Not on my radar to create with Metabox yet, plus you'd still need Woo to use the Woo Templates.

[@KomentarSaya]

@@websquadron or using any custom field

[@dazman88]

Do you really need to spend 2 minutes explaining what category filtering does?

[@websquadron]

And that's because you know that everyone watching this video, fully understands what category filtering is? I'll wait for you to provide the statistics on that.

[@dazman88]

@@websquadron Pretty sure everyone can wrap their heads around what category filtering does since it's in the name.

[@websquadron]

Are you so sure of that? I'm still waiting for your proven statistics - and how me explaining to remove doubt was not required. If you can show with no doubt then yes I shouldn't have spent 2 mins on explaining it, but I'm not convinced that your subjective view can be generalised for every person that views the video. @@dazman88

[@Tom59Kriek]

Enough of these Bricks videos. Get back to Elementor!

[@websquadron]

Don't worry - there's load of Elementor ones to come :) Keeping my options open as a backup. Thought about Breakdance and GBerg, but then opted for Bricks :)

[@nefertari82]

hi I came over bricks and really enjoy you good videos. I was almost ready to purcase it but then oh I have a membership plugin: YITH WooCommerce Membership. AND it seems it doesn't support this yet. Would love to see if you can work around some memberships plugins with bricks

[@websquadron]

Have you tried Paid membership pro?