Custom CSS in Bricks Builder for an efficient workflow | How to CSS Tutorial | WordPress Tutorial

Learn how to use Custom CSS in Bricks Builder.
GET ACCESS TO MY ADVANCED & INDEPTH TUTORIALS

Bricks Builder WordPress | Tutorial
#wordpress #bricksbuilder #bricks

GET ACCESS TO MY ADVANCED & INDEPTH TUTORIALS

GET AUTOMATIC.CSS - A time saving utility class for WordPress websites
--------------------------------------------------------------
GET MOTION.PAGE - Interact & animate any WordPress site

--------------------------------------------------------------
GET RECODA WORKSPACE - Advance workspace for Oxygen Builder

--------------------------------------------------------------

GET YABE WEBFONT - Custom fonts management and self-host Google Fonts with seamless WordPress page builders integration

--------------------------------------------------------------
Get Breakdance - A record breaking visual builder for WordPress

--------------------------------------------------------------
GET 20% OFF HOSTING PLAN FROM HOSTINGER

DISCLAIMER: This video or description contains affiliate links, which means that if you click on one of the product links, you'll be supporting the channel, and I’ll receive a small commission.
=============================================

BOOK A 1-HOUR CONSULATION
=============================================

=============================================

[johnramos]

Magnificent tutorial. I'm learning tons with you! Thanks!

[mailwood]

Good lesson. I would like more lessons on design practices, classes and styles.

[Sascha.Hauser]

If you know CSS in an out, this might be faster than browsing through the Builder-Menu, no question about that.

However, if that is not the case, i am not sure that this workflow is really more efficient.

Also, when the code is getting longer and longer and you have to change something month later,
you have to find it in the code to change it, it is much more clear where to find and change things later on, when using the menu of the Builder.

Also, writing all those proper BEM classes and targeting them inside your CSS takes also some time.

Not forget that stuff not always work, so it also takes time to troubleshooting your code.

I have seen enough videos, where people search for +20-30 seconds to find things in their CSS, in that time you easily have
open the menu and change the value there.

[noraholmquist]

Very interesting tutorial. I have often wondered about how to solve the “where did I put that value” problem in builders. I see the logic of picking a logical unit of elements, such as a card. What do you think about using the page as the location for CSS?

[BGdev]

This reinforces the idea of using an external stylesheet.

Also.. I didn't know you could have Advanced Themer and ACSS installed together! It seems like there would be some conflicts between the two, namely color palettes. Can you do a short on configuring the two?

[elikemdaniels]

Your tutorials have been super helpful to me since I returned to WordPress from Webflow. Thanks a trillion times. I have a question: How do you design empty states and conditionally set it appear IF there are no posts? What I'm trying to achieve is that, I'd like to display styled content of a DIV if there are no posts. I can see that the query loop builder has a section at the bottom called NO RESULTS that allows you type a string of text to display of there are no posts, or perform a dynamic action. Not sure what exactly to do there because none of those action/functions really give me the desired direction.

What am I missing? Have you encountered this before?

[timbrown]

nicely explained with some kind of patois language cool ;) i think its a bit too long because i dont need to see styling here and there in details..overall concept to see is ok. i prefere local cudstom css too...

[tomashudolin]

So there is nothing like in Oxygen? I like the Oxygen's soluion where the CSSs can be splited based on purpose and is in directly in builder. So in Bricks I have only one place for whole CSS and outside of the builder, right?

[blackmagic]

Do you use wpcodebox to keep evrything together?

[SinisaSinjori]

Nice tutorial. Thanks.
I didn't think about writing css like that, because I thought it's faster with the builder, especially with Advanced Themer (that's a nice plugin). Maybe will give it a try next time.
However, where do you place media queries in that case? Also in the same "Custom CSS" box?
Also, where Bricks put that CSS code? External file (if that's selected in Bricks settings), or inline like it currently does with some CSS (regardless of choosing external file)?

[quickend]

First, I like to say - You have a very good teaching style and I do enjoy and learn well from your videos. It's very good to see you in alliance with Kevin G. (Thank you!)

Question - Does Advance Themer and the "Plaster" the plug-in that became part of ACSS overlap? do you use both at the same time? or is the plaster turned off as you use Themer? Also, I no longer seem to see or experience the plaster since it was rolled into ACSS.

At this point, I am not sure what the Plaster integration it's supposed to look or act like. Would you consider doing a small re-introduction of this option so we can know if we are using it to its potential?

[kevinrittershaus]

Great tutorial! Question...I assume if you're using the Bricks parent theme and update it, these customizations would be wiped out? Is that correct? Using a child theme, however, they would be saved with any updates to Bricks?

[jamieburchell]

I feel that's the worst of all worlds with Bricks. As you don't use the Bricks UI to style anything and all of your CSS is in one place, it might as well be in one place in a stylesheet?

[brianPowalski]

nice tutorial. rather see your beautiful face rather than this fake "james smith", just sayin

[lucianpascu]

Bad teacher...A lot of gibberish instead of clear communication.