A Look At The KadenceWP Design Library

 

KadenceWP is a great WordPress theme, but a huge bonus is the built-in design library. We’ll talk about how it’s different from a block pattern library and show you how to use it.

Transcription

Hey folks, welcome to another HeroPress Tip of the Week. This week we’re going to talk about the Design Library that’s built into the Kadence WP theme.

Now, to start off with a little transparency. I need to point out that I’m running the pro version of the theme because they gave it to me, because they believe in what HeroPress is doing. That said, this is not a paid video. I’m doing this one because my friend Birgit asked me to. So Birgit, this one’s for you.

I’m here on a page for editing. And at the top, there’s a button called the design library with the Kadence logo next to it. There are a few other plugins and themes that provide design libraries. So watch for the one with the K here. And when I click this, it brings up this modal. And these are similar to block patterns.

These are collections of blocks that can be dropped into a theme, or to a page or post. So I click all and it gives me more than you could ever imagine. But if we click on here, then these are some things that could go at the top of your page. Or any place that needs a lot of attention.

Then there are these cards, you can make columns of things. Media, counter stats, and there’s a whole bunch you can see in this form’s gallery, accordion, etc. Now, the thing that sets us apart from just the regular block pattern library is that each of these is individually an iframe rendering using my personal theme’s settings. So you’ll notice in the bottom left, here, we have style, and there’s white, black, and blue. And I can click, and it changes the styles of these. Well, these are the colors that are set in my theme.

So if we go to this other tab here, this is the customizer, and I’m under the color section. There are some more of those colors, but it’s the same general palette. But if I click this and say I choose this one, and publish, we’ll come back over here and then I’m gonna refresh the whole page. And it’ll complain that I’m leaving, but that’s okay. I don’t care about that right now.

Here we are with orange, black and white for a few of our options. It’s not really black, it’s more of a dark gray. In addition to the colors, it uses the fonts that are set. I’m not going to mess with that to show you, but in the customizer we’re going to reset my colors real quick. I could come in here and set all of my headers and all that kind of stuff. And then those will be reflected here as well. That doesn’t happen with the regular block pattern. The block patterns are pretty well cemented.

So to reiterate, this is similar to the block list or block pattern library. But each of these reflects the settings of your current theme. And no other design library is going to do that really. This is the Kadence theme tied in carefully with Kadence blocks and they’re going to work really well together. So if you are using Kadence WP, I strongly recommend you take a look at the design library.

Something that’s cool to note. I’m looking at the post loop design and these are actual posts. These are my posts, not placeholders or anything like that. So you can see what that looks like. Want to choose this one and just see what it looks like? There you go. That’s pretty cool. I hope you find it useful too.