Secrets to Stunning Bento Grids on WordPress & Advanced Themer

[@WPTuts]

Full written version with the raw CSS can be found here: learnbricksbuilder.com/easy-bento-grids-with-advanced-themer/

[@StefanSchleinitz]

Thank you, Paul. May I ask why you have used background images instead of placing the images inside the image blocks itself? Since I'm watching your tutorials along with the ones from Kevin Geary I would make this bento grid a list element and place the images directly inside the image block to make them more accessible. What do you think?

[@noraholmquist8231]

Excellent video. I liked the combo of Bricks+AT+Core, and bento grids are very topical now. Keep it up.

[@MarioSarto]

I like the combination (AT, Core with Bricks) and your video - as always 🙂 I think the setup of theese would help a lot of people.

[@Kal-el23]

Nice demo. Would love to see a follow up video of doing this in a loop or with Woocommerce products (so the latest one is maybe the biggest image, and then it gets moved every time there's a new product etc.)

[@tripwire8457]

Wouldn't filtering by Date work for that?

[@RichardMullin1]

Can you use Dynamic data to load the 4 images in the grid from an ACF gallery with say 10 images in it which you only see when you click through to the lightoom gallery in Bricks?

[@ocratest]

Great Paul - What would be an amazing follow-up to this tutorial. Is how to do this same layout with a query loop and maybe make the first item (of query) have a slightly different layout.

[@RichardWadeUK]

That is effin' brilliant mate.... MORE MORE MORE!

[@visualmodo]

Very good work!!!

[@antonichristian5845]

Really great tutorial Paul!!! I have been messing about with this for the last few days with sites that use fairly complex Bento Grid designs and then try to re-create them using Bricks with AT. It's pretty easy when you have them live in a webpage because you can inspect them which give you the columns and rows and also where the cells start and end. The issue is if you use a site like bentogrids which has lots of really nice but some very complex bento grid designs but you only get the image of the design. How on earth can you determine the columns and rows needed for such designs just by looking at the image? You would need to overlay the image with a grid and use the information from that instead. So if you had a method for creating more complex bento grids using Bricks and AT then I would love to see a tutorial on that also. Cheers!

[@RiyadhKey]

Hi, Great tutorial, can we have some bentos in a interaction tab section? that would be great.

[@philcarson7623]

A great tutorial! But in mobile landscape and below, the text block has a LOT of extra space on the bottom of the block - about 2/3 excess space.

[@MCbyGracjan]

I just installed the Core Framework along with the Advanced Theme, but I don't have the CF variables as it looks like you do. Do I need to set something in the settings to have variables from CF? I also have ACSS installed can it get complicated with the other add-ons?

[@OneKingArthur]

All the Bento layout examples I've seen become symmetrical at the floating breakpoint. Do you think it is possible and practicable to maintain an asymmetric configuration?

[@morozara4962]

Great video. How can you do this with query?

[@idee-creative]

Great video! Quick question about advanced theamer… does it come with all of the default variables for spacing etc? And do you always use the same ones? (Apart from colours and fonts of course), or do you create a new set of variables and styles for each and every site you build?

[@WPTuts]

AT provided the tools, but not a pre-built set of variables/classes.

[@martinmcshane4487]

Hi, I've tried answering our question, but YT keeps blocking it as spam, seems as soon as I mention tools I use it gets deleted. lol, so I can't answer that question openly.

[@ianonline]

I have the same t-shirt! It's fantastic being a member of the '77 Rebel Scum!

[@PhilippBremer]

Interesting would be to know how they work with query loops ✌️😉

[@WPTuts]

Perfectly. :) AT identifies it's a Query Loop and will address everything needed inside the CSS Grid builder modal. It's pretty slick.

[@PhilippBremer]

@@WPTuts But what if for example want to exclude certain grid items? Or include other titles, etc.?

[@WPTuts]

@@PhilippBremer that's kind of outside the remit of the builder. Without a proper example, I'd say you're going to have to handle a lot of that in the loop iteslef before you move to the grid side of things. Either that, or start using CSS to target specific children in the loop to hide or change their appearance.

[@PhilippBremer]

@@WPTuts Thx for clarification. And thx for your videos!

[@maximebeguin4346]

Instant like ❤

[@muhammadwaqas9235]

1st like ❤

[@BGdev305]

The silly face covers isn't recognized by youtube's algorithm anymore

[@WPTuts]

What? 🤷🏼‍♂️

[@martinmcshane4487]

I Iike this channel, but I'd like to see way more tuts away from bricks... It reminds me of when the baldy fella from wpcrafter never did anything but elementor for about 2 yrs

[@WPTuts]

Have you looked at the latest videos on the channel? I’ve covered WP plugins, LocalWP, website blueprints, email marketing and a load more that have nothing to do with Bricks. 🤷🏼‍♂️

[@martinmcshane4487]

​@@WPTutswhen I need a tut, your channel is my first port of call, especially acf, otherwise I wait for the KZbin push notifications for your latest view, which mostly feel like they're bricks-centric ATM

[@WPTuts]

@@martinmcshane4487 that’s because Bricks is part of my main stack, so it’s inevitable that’s going to feature heavily in my tutorials. I still cover ACF, etc, but moved away from Elementor as my main tool to demonstrate things as I’m pretty fed up with the need for additional plugins to handle a lot of what needs to be done with dynamic content. While I’ll still cover it, it won’t be my focus as I feel it’s fallen way behind as a serious tool to efficiently built dynamic websites.

[@martinmcshane4487]

​@@WPTuts​@WPTuts totally understand... I binned elementor off in 2021, too many updates breaking sites... It's all about the blocks for me, (not spectra tho 🤢) I tried bricks a few years ago when it first came out, but just didn't want to invest in another page builder tool when Gut was starting to take traction. But I understand why your vids are taking a bricks-first approach... I'll still follow

[@WPTuts]

@@martinmcshane4487what blocks are you using? Native Core blocks or something like Greenshift or Kadence?