Tailwind CSS VS OxyProps, Bricks Builder "Dark Mode", replacing WP Rocket with FlyingPress
HTML-код
- Опубликовано: 10 апр 2023
- ⛑️ Services I am now offering:
Get a Website Quote: wagepirate.com/?ff_landing=12
WP Consulting (I offer advice, you do the work): wagepirate.com/?fluent-bookin...
WP Support (I do the work for you): wagepirate.com/?ff_landing=15
📩 Get my free WordPress Newsletter (join 1600+ other people)
Subscribe ➜ wagepirate.com/subscribe/?utm...
(I share tips covering Bricks, FunnelKit, WooCommerce, business & marketing strategy + WordPress news)
great staff. thanks for your effort.
Super nice tutorial and very helpful!!! 💌❤❤❤
Hey Buddy, Thank you so much for your detailed explanation of OxyProps / BricksProps and for thinking about making this incredibly useful video in response to my inquiry. Also, you pronounced my name correctly. Cheers 😊 Keep rocking. 👍
Can't wait to see more of your Oxyprops videos. Starting from the beginning, going through the whole setup process (colors, fontsizes, ...) with explanation of all the details would be amazing. 🙏
Awesome. This video should be out shortly. Do you own OxyProps or mainly just curious ?
@Grant Ambrose Cool 😎 I own OxyProps, own Oxygen and Bricks but I am mainly focused on developing for bricks so I am missing time to study Oxyprops for Bricks. Here a proper tutorial series would safe my day(s) ☺️☺️
Yes! Switched from WP Rocket to FlyingPress nearly 18 months ago, it’s been a huge difference! It’s much better IMO. 😊
Nice!!! I don’t know why WP Rocket couldn’t make it as simple as FlyingPress, being as mature as it is :s
Loving this type of video. Raw thoughts of yours.
I have a question. As mentioned in the video, you are using 1 column for the entire websites (including blog). It's looks great and blue tone is smoothing. Previously you were having the Lead capture in the sidebar. Did you noticed any noticeable difference of getting leads, after removing the sidebar?
Thank you for the vid!
I barely got any leads through that vs the other optins, so I removed that and left an affiliate link only to a product of the month and that got very few clicks when compared to other placements so I removed that. The best one is exit intent and the full screen pop up after X seconds for me. You just reminded me that I need to set it up again soon on the new site
Great video as always, thank you . Would like to know about oxyprops
I have a few videos planned :)
I use mathml and latex for displaying math equations rendering with mathjax library. Could you please make a video on how to create custom blocks?
yep! coming shortly :)
Hey Grant, thanks for the vid!
While you showed oxyprops or rather bricksprops I was wondering why you didn't use the bricksprops classes?
For example when you did the rounded corners you could have used the utility class "o-rounded-2" class from bricksprops, the same for when you created the grid layout, bricksprops has everything for you already made, e.g if you want a 3 grid layout, you apply the class "o-grid-3" and if you want a grid 1 layout on mobile you could apply "o-sm-grid-1" beside the "o-grid-3" class.
Just curious here 🙃
I made the decision to just not use utility classes as a rule for me, because when I was developing I always had to stop and think if I should add a utility class vs create a class with custom props, and I felt it slowed me down. It was something I was testing at the time and I'm still doing it so far. Personal preference for this one but I can also see why people use them for grids / rounded corners.
@@GrantAmbrose I see, thanks for the explanation! I catch myself most of the time adding a "XX__heading" class and then just apply styling to the class instead of add multiple utility classes. I think its also better maintainable? Let's say you have an image, create a class for it with 8px rounded corners, now you can apply this class to every image, wanna change it to 14px? Just change it once on any applied element and you're done instead of going to every image and change the utility classes.
yeah definitely. If you check the source code of my site now wagepirate.com/ I have kept everything very simple. I just have all my sizing as custom props like --size-s --size-m (default) --size-l etc and I plug these into the CSS class names. so I would have something like .box{border-radius: var(--size-m)} and then if I need to update it, I edit the css class in the builder, so similar to you and I have found it worked really while I built my new site (I converted it from Bricks to Cwicly)
Hey Grant! Are you on a paid plan with Cloudflare or do you have any paid addon with Cloudflare to improve speed? I've noticed a very low TTFB (a good thing) and I wonder what settings you have enabled in Cloudflare. Thanks!
Hey! I have Cloudflare APO enabled. So it's $5/month but 10000% worth it if you have global traffic. The free plan of Cloudflare serves your assets from its caching network, but Cloudflare APO caches all your HTML also which makes a bit difference
Hi Mate, thanks for such a great video, I actually use Oxy/Bricks-props and I am very happy that I purchase.
Regarding Bunny CDN how do you display dinamically videos from Bunny CDN. Appreciate your comments.
I just embed the videos into my content. What do you mean by dynamically?
@@GrantAmbrose sorry wrong term, I meant query loop, for example I have a CPT with a CF to add the video link, so the users only need to paste the link in that field.
Oxyprops V ACSS+Plaster mmmmmm what to choose?
Yes, please make a comparison for oxyprops vs acss+frames - which way to go :)
Thanks Grant for this video! This is so interesting to see someone else actually using the plugin.
If I can make a suggestion, when you adjust your box shadow color, the way I would handle this would be creating your own custom property and reassigning its value in dark mode. This way, you could easily use this color for something else than only your box shadow.
In your global CSS :
html {
--_my-responsive-color: var(--o-brand-025);
}
[color-scheme="dark"] {
--_my-responsive-color: var(--o-surface-4);
}
This way you can use --_my-responsive-color anywhere, and if one day you want to change its value for light or dark mode, this is easy from a single place and all you custom classes using it will reflect the change.
Good point!
@oxyprops I just found out about oxyprops watching this video and it looks super interesting.
What is strange is that I never heard of oxyprops all this while, and was inclined towards ACSS, but your product definitely is a lot smarter and efficient. May be up your marketing game a bit do more people in the bricks community know about it.
I'm still a little torn on whether or not I'm going to check out BricksProps (or rather OxyProps). Just not sure about the performance, as OxyProps seems to be a bit on the heavy side with all the classes and variables it loads along. I've also taken a look at Advanced Themer in the last few days. No CSS framework, instead it relies more on CSS variables and you're able to set up a bit more yourself. I usually like that, as I love the freedom and flexibility of it. But OxyProps looks pretty damn good.
TBH I don't think it's an issue. I disable all utility classes and just use the CSS custom properties and create my own classes and that significantly cuts out a lot of overhead. My site loads super fast, also. AND... I saw they are working on JIT so that could be interesting.
@@GrantAmbrose That sounds really good. Especially if the developer plans to implement JIT. Thanks for the information! I think I will have a look at OxyProps.
Interesting, if you are working anyway with gutenberg, maybe generatepress or another blockbuilder would be a better fit for you - did you ever consider it? Although I hope you continue publishing bricks content :)
I bought GeneragePress and I think I got an email saying my license expires soon... I should try it. But I can't stand doing any design work currently in Gutenberg. I can write faster in it and produce long form content, but anything to do with designing inside it seems cumbersome VS Bricks. That said, never say never - I will give it a go because I've only heard good thing
How are you building your custom blocks?
I'll have a video coming out soon showing how I've got it set up
Bricksforge... Brings gasp to wordpress building but surprised that no one is really posting tutorials...
I am trying not to add addons to my site as much as possible so haven't had a play with Bricks Forge but I've only heard good things.
Hi! where I can find Swiss Knife for Bricks? ty
It doesn’t look like it has been released to public yet / I can’t find it on their website either
It's released now
Are you somehow applying Bricks css to Gutenberg content?
Nah Bricks and Gutenberg styling are separate
@@GrantAmbrose That's one of the biggest pain-points I have with Bricks. My clients will always enter plenty of content in Gberg.. I want to keep them out of Bricks as much as possible.
Coming from a coding background I prefer tailwind, but this is interesting forsure!
I have never tried to build a site with Tailwind that isn't inside a WordPress page builder and I know I should (and I want to). Are you using Tailwind in your own theme or a page builder?
@@GrantAmbrose I have always built from the ground up. I used to use bootstrap but tailwind is much better. I've only recently started using Wordpress to develop websites as my clientele has grown and there has been a large influx of clients wanting a wordpress site. I use bricks but still code it all by hand and it renders as it should making my themes usable.
Bricks saving form subs to database - I think Bricks Builder developers are based in Europe... Saving form subs to the database is a potential headache for GDPR, so maybe it's not a priority from their point of view.. 🤔dunno.
Yeah hmmm. Not too sure how GDPR would affect the developers creating it. I would imagine (Based on all the other Form plugins available) that this wouldn't be why they haven't included it yet. I think they could just add this and give us the ability to manage GDPR on our sites :S
@@GrantAmbrose Yeah, I think you are right :) It's not the Brick dev's concern how we deal with GDPR individually.