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
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?
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 :)
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?)
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?
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.
Excellent 👌
Glad you enjoyed it! 😉
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
Thank you so much for your comment! Glad you enjoyed the video :)
Its very cool. Thank you.
Glad you like it!
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?
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 :)
Super cool! Also, the AI family... 😂
And the AI jingle ... probably from Suno. 😂
Thanks! 😁
It's a secret =)
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?)
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?
Align option is available, please check this documentation: wpspectra.com/docs/advanced-heading/
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.
Really good content! :_)
Thank you so much for your comment!
grandma1 faboulous tutorial
haha glad you enjoyed it :)
Could this work with looping pages or queries? Would be great to be able to display blog posts this way with dynamic content.
Thank you for sharing your feedback we will forward it to our team.
Spectra pro should have more woocommerce options.
It's in the works :)
@@BrainstormForce yes, that would be great because that will eliminate the need of using Elementor, especially for making product page templates.