Bento Style Grid In WordPress With Spectra - RIDICULOUSLY EASY IN 2024

[@SEBASTIAN_JOSY]

Excellent 👌

[@BrainstormForce]

Glad you enjoyed it! 😉

[@goatcheeta]

Well done! Looked at various implementations and Spectra is the best. I also have worked at CSS grid manually outside of Spectra and it can be a humbling experience. Thanks for this tutorial and look for more on this subject

[@BrainstormForce]

Thank you so much for your comment! Glad you enjoyed the video :)

[@cesarcrash]

I could create the exactly layout I wanted using this method. But I wanted to put post grid inside the containers and that's when things got messy. The containers stretched its height much more than the grid, leaving a blank space between post grids. Any tutorials on this or a hint on where can I fix this? Thanks.

[@miguelparraudcordeyro]

Brilliant! Very good and perfectly explained! Thank you so much. The only thing I noticed is that, in the family tree when you show the tablet and mobile versions, there is a larger space between the two containers. Was it done this way on purpose?

[@BrainstormForce]

Good point! This can be changed in the Style tab > Spacing options by changing the bottom margin of the upper container, and the top margin of the bottom container :)

[@atishmandlik9356]

Its very cool. Thank you.

[@BrainstormForce]

Glad you like it!

[@TheAbabackar]

thanks for the video and tutorial. I wanted to create a bento style website so timing is perfect. On an other note, I already asked on an older video but seems that I can't find Align Self option in Spectra pro like we have with Elementor... Have I missed something or this option doesn't exist?

[@BrainstormForce]

Align option is available, please check this documentation: wpspectra.com/docs/advanced-heading/

[@GrahamPhillips1985]

Could this work with looping pages or queries? Would be great to be able to display blog posts this way with dynamic content.

[@BrainstormForce]

Thank you for sharing your feedback we will forward it to our team.

[@annascovel1978]

Super cool! Also, the AI family... 😂

[@writeafterthis]

And the AI jingle ... probably from Suno. 😂

[@BrainstormForce]

Thanks! 😁

[@BrainstormForce]

It's a secret =)

[@kberwager]

This is great but I have two questions… 1) How would you fix that gap on mobile? 2) Can we use ACF Photo field (dynamic data in the containers to display the images?)

[@visualmodo]

Really good content! :_)

[@BrainstormForce]

Thank you so much for your comment!

[@imdailymarkom9269]

grandma1 faboulous tutorial

[@BrainstormForce]

haha glad you enjoyed it :)

[@rahulbhalla6230]

Spectra pro should have more woocommerce options.

[@BrainstormForce]

It's in the works :)

[@rahulbhalla6230]

@@BrainstormForce yes, that would be great because that will eliminate the need of using Elementor, especially for making product page templates.