I create 20 Bento Grids using Bricks Builder and Advanced Themer

[@mreclecticguy]

Really love Advanced Themer. While there’s much to love about it I really appreciate the ability to create variable CSS sizes and colors. The interface enhancements are nice too. There are many other features that really expand the power of Bricks Builder.

[@vaughanprint]

Grid 4 was like a pantomime. Every one shouting “behind You… over to the left a bit, down on the right a bit”.

[@AdvancedThemer]

Grid 4 was a pure pain 😂 I’ve been so confused on it… speaking doesn’t help for the concentration 😅

[@BGdev305]

Would really be nice if Advanced Themer could generate a "Style Guide"!

[@AdvancedThemer]

There used to be a custom element for that, but it wasn’t compatible with the new color/variable manager. I may get it back in future…

[@maxziebell4013]

Nice! 🌟 Just started and I'm already excited for the full episode tonight. Your videos are a blast - like unwrapping presents at Christmas or discovering new wonders in these capability demos. Keep up the fantastic work! 🎉 Wishing you a joyful and prosperous New Year! 🎆🥳

[@AdvancedThemer]

Thanks Max! Happy New Year to you too, and thanks for your continued support, it’s mean a lot to me 👍

[@goshenweb]

Maxime - Great use cases for AT and compliments of the new year to you. To make your work flow easier to follow next time, I suggest you use a screen annotation tool to draw the boxes round the design you are trying to replicate. I bet it was a bit painful to watch for some as you determine the fr sizes of the grid cells and the number of rows and columns.

[@goshenweb]

Also, a split screen may help reduce the back and forth between the design and the grid builder, but I guess, that would mean keeping the selected designs on bentogrid website instead of downloading it to the resources screen. Just some suggestions on how to keep the workflow easier to follow. Thanks

[@goshenweb]

Also, it would be nice to have a keyboard shortcut for opening the grid builder when the grid container is selected in the structure. I noticed the number of times you had to click to open the builder every time you flipped between the resource and builder…lol.

[@John.Rearden]

I am so impressed with Advanced Themer that I wonder what magic trick will you pull up from your sleeve for the next release! Keep up the good work, Cheers!

[@haroonqraja]

In the fourth one (the complex one that took long), you got everything correct except for the last item. It was supposed to be one row shorter, and the two items above it needed to be one row taller. The sixth one was supposed to have five rows because there was a small difference in starting point of the second items in the first and last columns in the original design...they weren't perfectly aligned in the original like they were in your implementation. PS: You often overcount the rows by skipping a number while counting, like you'd go one row, two rows, three rows, then you'll skip "four" and go five rows, six rows and so on, ending up at eight rows instead of seven. :D Great work overall though!

[@KarloRIVERAVELASQUEZ]

37:14 "you know wives..." 😂 I know this pain 😂

[@thewebstylist]

U have mad design skills sir! So this is your fav page builder and web design platform?

[@AdvancedThemer]

Yep it is!

[@jason-m]

Really like that you release big new features, then continue refining them in subsequent minor updates. I think this grid builder/canvas/resources system is screaming for some shortcut keys or buttons in the relevant screens to easily switch from grid builder straight to resources screen? Seems the inbetween step of canvas is clunky or not (always) necessary.

[@AdvancedThemer]

Yeah I agree, it wasn’t the best experience ever. The resource panel should probably go on top of existing panel and avoid closing all panels when closing itself. It would have save a lot of clicks :)

[@chantscreen]

Fantastic!

[@thierry-leadway]

Great video! Thanks Maxime. Happy New Year! 🎉

[@thierry-leadway]

You know what i learned in this video? That there is a resource panel! 😂🙈

[@BrendanOConnellWP]

hell yea! great idea.

[@Hassanakora]

Great tutorial

[@mafiasalesman]

I enjoyed this.

[@martineverswessel8615]

Great!

[@adrianlopezayala281]

Hi i'm taking my firsts steps with bricks and I loved advance themer so I bought it, one dummie question, the classes like .bento-section__block where it comes from? I'm trying to use the class .radius-img but it doesn't do anything

[@AdvancedThemer]

I created these classes manually before creating the video. The radius-img you’re referring to is a css variable - not a class - and should be used inside the controls directly. 👍

[@bunediyo]

Tomorrow : pre made grid templates feature added to AT in next reliase😀

[@AdvancedThemer]

Not sure about premade grids, but what about a random grid generator ? 😅

[@bunediyo]

Ah ok. So both please @@AdvancedThemer 😁

[@vmm666]

[@toby-green]

If you were designing layouts yourself rather than modelling existing layouts would you simplify to avoid having, for example 0.3fr column widths etc. Or is that lack of balance/symmetry considered an integral aspect of the aesthetic of bento designs? As a non-graphical designer it's tempting to just go with full units, but maybe that loses some of the appeal...

[@AdvancedThemer]

I’d probably go with full units when I’m designing myself. For complex grids, I’d probably use a 12*12 grid and place items manually…

[@fabiamc]

Hi would be nice if you could explain in a short video the responsive side of bento grids. Cheers

[@AdvancedThemer]

Please check my previous videos on the grid builder, it has been covered already

[@antonichristian5845]

This is really cool and shows the power of the Grid Builder but how do you determine the columns and rows needed for certain grids just by looking at them? I looked at some and thought there was only 3 columns needed for example but you said 5 and so on. Is there a tool you can use to help with this? thanks.

[@AdvancedThemer]

You mostly need to count the intersections in each row

[@antonichristian5845]

@@AdvancedThemer Thank you for your answer but I still find this confusing especially in more complex grids. If the grid is online then I can chromes dev tools to inspect and get the grids columns and rows but ofc we don't get this option with an image. Is there any software you can use to drop a bento grid image into and overlay some kind of grid to help with this? Good work on AT 2.7 btw looks fantastic and I can't wait to try out nested elements.

[@AdvancedThemer]

I’m not aware of similar software I’m afraid. Maybe chatgpt?

[@t.t.2977]

Will there be container queries instead of e.g. media queries in future updates?

[@AdvancedThemer]

I can’t guarantee that

[@Edgar_Pineda]

any chance to get lifetime deal

[@AdvancedThemer]

I have no plans for it atm

[@vaughanprint]

What what? I see you popping up something called Resources Panel. Where is that hiding? I must go and track it down. AT is a bit of an Aladdin’s Cave.

[@AdvancedThemer]

It’s in theme settings -> Extras 💪

[@vaughanprint]

@@AdvancedThemer Found it.

[@vaughanprint]

@@AdvancedThemer Just coming back to you on that Resources Panel. I found the togghle for it in Extras and am now able to open the panel. From there I am at a loss. From the site ducumantation it says the following: Simply create your galleries in the theme options, and you can easily display them within the builder. This is the part wher I don't see anything in AT or Bricks settings to set up said gallery?

[@AdvancedThemer]

If you enable the toggle, you’ll see a new tab “resources” showing up on the left. Once clicked on it, there is a repeater with image galleries where you can upload the images that will be loaded inside the resource panel.

[@vaughanprint]

@@AdvancedThemer Ok Got it now.. One of those situations where I was just being screen blind. Too many tabs to look at all day and the brain just shuts down.