Thank you for sharing these insights! Managing shape dividers in Bricks Builder can indeed be tricky, but these tips with CSS variables and tokens seem invaluable for maintaining control and ensuring responsiveness. Using calc() for dynamic designs is a brilliant idea-I appreciate learning about these advanced techniques. It's clear that proactive management of dividers can make a big difference in site aesthetics and functionality. Those overlapping dividers with varied dimensions sound like a great way to enhance visual appeal. Your comment has definitely given me some valuable ideas to improve my web design skills!
"Don't repeat yourself!" This is probably one of the most representative tutorials of yours showing the power and importance of using tokens. Excellent one, as always! Thanks Kevin! 🙏🏼
Wow how frustrated I was with the Shape Divider because I couldn't adjust it the way I wanted... And now you come and show me how! As always, an absolutely blatant tutorial!
You have just saved me a ton of time! I have just implemented it on a new site and it's looking good! I wish Bricks Builder had Curved Shape Dividers! Thanks again, excellent tutorial on what could turn out to be a complex, messy and time-consuming implementation.
Kevin, I've watched a ton of training in my life that was informative. I've never watched training that was as informative and as entertaining as yours. ❤
Fantastic! Just finishing up my first website in Bricks, and I'm planning on using some dividers. Glad I decided to check out this video before going ahead with those! (Of course that decision was a no-brainer, as it is completely clear that if Kevin Geary has a video on an aspect of web design / Bricks, then watching it will have you learn important things + avoid problems!)
Thanks, you saved me. I have a huge client site with a lot of dividers in the making. I ddn´t know that issue exits in bricks and oxygen. I don´t use dividers so often anymore. PS: codebox is great. I use it for all projects. So easy to structure even large complex css.
@digitalambition Why don't you add to the ACSS control panel / settings page and area for one to enter custom vars (instead of using WP Code)? This way everything is kept withing Bricks + ACSS. Also to keep everything within one single export / import of settings.. when moving things from site to site... like you say "maintainability".
Because that would basically require us to build an entirely new product (code editor) into the existing product. It might get there some day, but we have many other priorities as well.
Thanks for the great video. I will create the settings for the section padding and the overlay header as token too. Then I can see all the settings in WPcodebox at a glance and have a clear template for other projects that I can easily customize.
Kevin, is there any way to remove .brxe-div from rendered element?? I need blank div with some custom class, but Bricks always add .brxe-div behind my custom class , (example: .myClass.brxe-div), I just want .myClass without .brxe-div behind it.
Couldn't you just use the Bricks Global Variable Manager to setup you vars so that you don't have to use CodeBox? That way you can select them when needed them in Bricks? Also is there a way to load ACSS vars into the Bricks Global Variable Manager?
hmm, doesn't seem to work for me....I'm using WPCodebox for SCSS. Followed what you did to a T, but the 125% width doesn't seem to apply....it actually made my divider smaller. And then there is a small gap at the bottom of my divider even though I have it aligned to the bottom of the section.
Sorry, normally I zoom in when I'm writing CSS, but I forgot on this build. So you'll probably have to watch on a desktop if you want to follow along.
The new UA-cam update has pinch to zoom, with adaptive resolution! So one can zoom into the code on mobile!
@@DesignwithCracka oh nice!
I do like an old divider myself so boy am I glad I watched this video today, early in my journey into Bricks world.
Utterly agree, Kevin. There are just some elements/components that should not have classes.
Thanks so much! When you don't know what you don't know and then someone like Kevin comes along and tells you. Just awesome!
You are so welcome!
Thank you for sharing these insights! Managing shape dividers in Bricks Builder can indeed be tricky, but these tips with CSS variables and tokens seem invaluable for maintaining control and ensuring responsiveness. Using calc() for dynamic designs is a brilliant idea-I appreciate learning about these advanced techniques. It's clear that proactive management of dividers can make a big difference in site aesthetics and functionality. Those overlapping dividers with varied dimensions sound like a great way to enhance visual appeal. Your comment has definitely given me some valuable ideas to improve my web design skills!
I'm relieved every time I learn something from you because I know I'm learning the right thing! Thank you!👍
"Don't repeat yourself!"
This is probably one of the most representative tutorials of yours showing the power and importance of using tokens. Excellent one, as always! Thanks Kevin! 🙏🏼
Glad it was helpful!
Exactly!
Pure gold in this video - thanks Kevin
Thanks for watching!
Wow how frustrated I was with the Shape Divider because I couldn't adjust it the way I wanted... And now you come and show me how! As always, an absolutely blatant tutorial!
🙌
You have just saved me a ton of time! I have just implemented it on a new site and it's looking good! I wish Bricks Builder had Curved Shape Dividers! Thanks again, excellent tutorial on what could turn out to be a complex, messy and time-consuming implementation.
Kevin, I've watched a ton of training in my life that was informative. I've never watched training that was as informative and as entertaining as yours. ❤
Really appreciate that!
Fantastic! Just finishing up my first website in Bricks, and I'm planning on using some dividers. Glad I decided to check out this video before going ahead with those! (Of course that decision was a no-brainer, as it is completely clear that if Kevin Geary has a video on an aspect of web design / Bricks, then watching it will have you learn important things + avoid problems!)
Excellent, as always, Kevin.
I like the enthusiasm you spread the knowledge, too.
I appreciate that!
Granted this video is older now, however I learned tons and will definitely be using these techniques. Thanks!
Great to see those advanced tips! Thanks Kevin 😊
💪🏻
Glad I watched this. Thanks!
Marvellous video. I am learning so much from you. Thank you!
You are so welcome!
Thank you! Truly a life saver!
Great great great great content! Thanks Kevin !!!!!
My first time learning about tokens. My new favorite wrord. Tokens!
Very good tutorial. Couldn't you adjust the height with the clamp function?
Maybe. I’d have to go back and watch again.
Love your passion and energy :)
Great strategy! thanks Kevin ❤
Fantastic video Kevin!
Glad you liked it!
beast ! thanks for all the info its great !
Monster Tutorial! 😮
I wonder if you could make these as settings in acss or use a custom field to change the value 🤔
this is dopeception. thanks kevin!
Thanks, you saved me. I have a huge client site with a lot of dividers in the making. I ddn´t know that issue exits in bricks and oxygen. I don´t use dividers so often anymore. PS: codebox is great. I use it for all projects. So easy to structure even large complex css.
🙏
@digitalambition
Why don't you add to the ACSS control panel / settings page and area for one to enter custom vars (instead of using WP Code)? This way everything is kept withing Bricks + ACSS.
Also to keep everything within one single export / import of settings.. when moving things from site to site... like you say "maintainability".
Because that would basically require us to build an entirely new product (code editor) into the existing product. It might get there some day, but we have many other priorities as well.
Thanks a lot for giving us insane content value!
My pleasure!
Great as always!
Thank you! Cheers!
Thanks for the great video.
I will create the settings for the section padding and the overlay header as token too. Then I can see all the settings in WPcodebox at a glance and have a clear template for other projects that I can easily customize.
That's a great idea!
thanks for the video. when are the frames going to be released ?
Black Friday
@@Gearyco can’t wait to purchase it. Thanks
Really liked this, I followed it but on a phone my hero kind of overflows to the right… I’m guessing this is because of the 125% width on the divider?
Add overflow hidden to section
@@Gearyco cheers, that fixed that. I blame elementor, being a user of it for 5-6 years never thought me a damn thing!
Question: couldn't you add the custom code to Bricks' custom code fields? Great tut, BTW. Nothing like it I could find.
I don't recommend it --- not a great experience.
Is there a reason to not add an SVG as an image with absolute positioning so you can use classes instead of using the shape divider element?
You can definitely manage shape dividers manually and have much more global control. I show how in this video: ua-cam.com/video/v-MF4NfSwHM/v-deo.html
It is exactly possible to add a class in the custom svg code itself I found out. Would did work?
🤷♂️
Kevin, is there any way to remove .brxe-div from rendered element?? I need blank div with some custom class, but Bricks always add .brxe-div behind my custom class ,
(example: .myClass.brxe-div), I just want .myClass without .brxe-div behind it.
It’s submitted as a feature request I believe
Couldn't you just use the Bricks Global Variable Manager to setup you vars so that you don't have to use CodeBox? That way you can select them when needed them in Bricks? Also is there a way to load ACSS vars into the Bricks Global Variable Manager?
the variable manager didn't exist when this video was created.
@Gearyco oh that makes sense. That said, is there a way to load the acss vars into the manager?
@@joshpaynedesigns No reason to. We have right click context menus that auto-insert the vars and organize them better than Bricks does.
hmm, doesn't seem to work for me....I'm using WPCodebox for SCSS. Followed what you did to a T, but the 125% width doesn't seem to apply....it actually made my divider smaller. And then there is a small gap at the bottom of my divider even though I have it aligned to the bottom of the section.
Probably made a small mistake somewhere
Yup, I did. Didn't enable the snippet. 😬
@@Gearyco Worked beautifully. Thanks for this!
This video pairs perfectly with PB101: L07. Like a juicy steak and a Napa Cabernet.
You will make me a superman i believe 😂
Why not add some shape dividers into frames?
Frames is a UX tool not really a UI tool.
Shape dividers over images next.
Good video thanks but I feel like the nitty gritty content was 5 minutes not 34 sorry
You get what you pay for.
More disaster: you can't copy or create classes for shape dividers in Bricks. Only by custom css / child theme css.