Episode 10: Building Design Prototypes in WordPress with Kadence

Written by:
Kathy Zant
| Published:
May 20, 2022
| Updated:
July 22, 2024

Every new design starts somewhere, and tools like Figma, Invision, Axure, or Adobe XD provide designers with innovative ways to create visual representations of web design. However, in the WordPress world, innovations in the block editor make creating designs natively, in the space closest to implementation, even easier. In this episode we get real about web design in WordPress. These tools can be helpful, but it’s critical to remain focused on the most important components of creating effective designs in WordPress. Unique content, an understanding of your customer, and effective communication through the design of your site is the best recipe for success.

Listen via the controls below, or add us to your favorite podcast app.

Listen in new window.

Timestamps & Links

  • 0:00 Intro: Hannah’s on the beach!
  • 1:33 Best WordCamp experiences: citymuseum.org
  • 8:47 Prototyping a new design in WordPress, where to start
  • 9:51 Bypassing the blank page problem
  • 10:50 Getting started with a LMS course landing page
  • 15:37 Competitive research: they exist, what’s working for them?
  • 18:41 The customer’s standpoint
  • 19:31 Get your content figured out before you design anything
  • 20:43 Your unique business has a unique selling point, use it
  • 22:40 Put your best content first
  • 25:00 Kadence is your design tool
  • 30:22 Shop Kit 2.0 getting ready to launch, iThemes training preview

Transcript for Episode 10

Kathy: Welcome to episode 10 of The Kadence Beat. We’ve made it to episode 10. And for episode 10, we wanted to have a little bit of a party. So we flew Hannah out of the country to an undisclosed location, close to a beach. Hannah, where did you go?

Hannah: I am in Mexico.

Kathy: You are! So it’s not just a party for episode 10. It’s a Fiesta for episode 10, huh?

Hannah: it’s a Fiesta. Yeah. I guess you guys missed the memo. I mean, I thought we were partying in Mexico for episode 10, but it turns out it’s just me.

Kathy: Well, Ben, I think you and I are missing out.

Ben: Yeah, it’s pretty cold here today and kind of like snow flurries coming down. So Mexico beach sounds pretty good.

Hannah: You know, that’s exactly why I’m here. Because last week Boise got record snowfall, and I was like, I can’t do this. So I used some miles and booked a ticket down to Mexico and I’m a lot happier, also a lot more sunburned. My body’s pretty crispy.

Kathy: Is it really. Well, you seem a lot happier and you seem ready to party for episode 10. So I’m excited. I’m going to live vicariously through you pretty much all year with all of your travels. So.

Hannah: Yeah, we’ll just invite everybody here, now. It just on the beach in Mexico the sun’s shining. This is where we are for episode 10 and welcome to the party.

Kathy: Excellent. And Hannah, you had a question for us for episode 10, what’s your question?

Hannah: Yeah, so I love a good party. I love hosting parties, and I think a great way to engage people in a party is to ask a good question. So, um, somebody I thought about is what is your favorite WordCamp experience, if you’ve been to a WordCamp? Well, I know again, Kathy and Ben have those of us who are here, we’ve all been. So tell me your favorite WordCamp experience?.

Kathy: I guess I can go. A WordCamp that I went to, my son was traveling with me and he had just turned 18, like just like within days. And we were at WordCamp Miami, and one of the people we were with decided we should go to South Beach. And it was spring break and we got stuck in a car with people just all around us. We were unable to move. And my just-turned 18 year old son got to experience South Beach, and I could not stop laughing because he was with his mom and it was, that’s not how you want to experience, the first spring break experience is hanging out with your mom.

And he was kind of mortified, but it’s still to this day makes me laugh and gives us funny stories to talk about, like, how about those girls in the back of the back of that convertible. And he’s just like hiding his face in the back of this car and there’s no escape because there’s just too many people around.

Hannah: I love that.

Kathy: It was pretty funny.

Ben: That’s awesome.

Hannah: That’s the best. Ben, how about you?

Ben: Um, I think we have a shared experience that was by far like the most memorable and it’s super ridiculous. And that was at WordCamp 2020 or 2019. They had an after party at a museum that I honestly, the whole time I was there, I was like, how’s this place not shut down. Like, this is so unsafe.

And so it felt like we just got into a building that had been condemned and then somebody went into it and built a whole bunch of super sketchy things on the condemned building. And then it was like, everyone have a free for all and do whatever you want.

Hannah: And I think that’s somebody who was probably on drugs. Would you say?

Ben: So many things that were like, what, what, okay. Like this makes no sense. I mean, it’s hard to explain this museum. And I hope it’s still exists. Cause I think there’s, it needs a place in this world, but I also am very curious how it’s not shut down because there are so many things that we’re like, okay, yeah. this is really dangerous. We wandered around and we had a very, very good time because we knew nothing of what we were getting into.

And so it literally was just wandering through somebody’s on something, had a like dream, and this is what they created. At one point we were climbing up a two story. I mean, what do you like essentially, like, wire netting, suspended on a ceiling that was like half dome.

Hannah: Like a dome.

Ben: Yeah. And then like you popped out of that ceiling and you were on a roof and there was a huge slide that went down to like another part of the roof.

Hannah: With a giant grasshopper. Don’t forget about the giant grasshopper. What!

Ben: Then like, like the slide like ran into concrete there wasn’t , like nothing about it was like. And so then you slide down a nice slide and there’s like a nice ending. It was like, and you just slid into concrete and everyone got up like looked around, like, did that really just happen to me? I mean, they, yeah. Hannah help help me explain this place.

Hannah: Yeah, it’s tough to explain, but it was awesome. The best part was like Ben said, we, really had no idea. Like we spent maybe the first 45 minutes on the first floor, just like cocktail hour thinking, oh, this is just an interesting museum. And then we’re like, well, maybe we should wander. And then you go through like a tiny little doorway that you have to like crawl on your knees to get through. Then it opens up to this other crazy place. And you’re like, what? And it’s like every corner. You’re just like, what? And then next thing you know, you’re on the roof going down this grasshopper slide and then there’s like this crazy carousel.

And then there’s a slide that goes from the top floor, which was like, how many stories would you say? Five? All the way down to the bottom. It’s wild. It was honestly the most fun that was by far the best WordCamp experience I’ve had as well.

Ben: Yeah. I mean, the WordCamps are fun if you’ve not been, to the audience, there are a lot of fun. You, you do meet a lot of people. You get to be in like these sessions where you learn a lot of stuff, but the after parties are really awesome as well, because they’re usually in a random place. Even the year before that, there was a planetarium that was part of the after party, and that was a very fun, and also very dizzying experience. It’s a good time. Definitely. If you can make it to a WordCamp it’s worth your time.

Kathy: And that museum was in St. Louis. It’s called the City Museum. If you go to citymuseum.org, you can get a feel for the torture chambers that Hannah and Ben experienced there. Um, I didn’t even go up that slide, I like banged my knee on the way up and just turned around. Nothing good can come from this, I thought, but they actually have a Ferris wheel on the rooftop.

It’s a crazy place. The people who do the after parties, the organization for WordCamp US, are just amazing. WordCamp Europe also, happening in a couple of weeks. And that will probably be another epic party. I went to the one in Berlin a couple of years ago and they had, just amazing performers, like a Madonna impersonator. It was, like Madonna was there. It was crazy. So anyway, yeah, WordCamps are, are amazing. The after parties are definitely worth it and you get to meet people like Ben and Hannah. And sometimes me.

Hannah: Although we all were there and I don’t think we met, which I’m sad about that.

Kathy: I spent most of my time just going from conversation to conversation and just down tunnels and draperies in the sponsor area, it was a busy, busy, busy time, but, um, yeah, that’s kind of where Kadence really started getting some notoriety at WordCamp US 2019. That’s when people really started talking about how innovative some of these tools that you’ve put together have been.

Hannah: Yeah, yeah. At that point it was just Ben and I, and nobody knew who we were.

Kathy: Well, people who were watching picked it up really quick, and look at where we are today. Pretty exciting.

Hannah: Yeah, Episode 10. We’ve come a long way. We have a podcast!

Kathy: You have a podcast! And isn’t it easier now I told you to just hang with it until episode 10 and it’s easier, right. Just kind of like hanging out and chatting about cool stuff. And I edit out all the dumb stuff.

So I’ve been working on a secret project, and something that Ben said in a presentation that he had done internally a few months ago, started to really ring true. And I started to say, oh yes, I understand exactly what Ben meant.

You had talked Ben, about how prototyping as close to the place that you are going to publish makes the most sense. And I am going through that now because I’m taking a prototype that was built elsewhere and I’m building it out in WordPress, in Kadence Elements, using custom fields and everything. And a lot of the things in the prototype just don’t. I just have to make decisions as I’m building, well this is going to work this way, because this is how WordPress works, this is how Kadence works.

And I wanted to have this conversation about best practices prototyping WordPress projects and designs, um, the different tools that people use. When do they make sense? When do they not make sense? And how do you get beyond that “blank page” problem. Does that sound like something we could talk about today?

Ben: Yeah, absolutely. I think the blank page problem is a great way to phrase this because I think everyone can relate to that. You show up and you’re like, I need to build whatever it is, a landing page, a sales page, you know, and you’re staring at a blank page and you go, okay, what do I do next? And it’s tricky cause like that’s, that’s the point and often times where people go next is they go through a very, trying time, a frustrating time, a time where they do 10 things and undo 10 things and do 10 more things and undo all of those. And at the end of it, they’re rarely satisfied with what they end up with.

And so I think, even more than what you’re saying too, like, it’s good to just think through. There are better strategies than showing up at a white blank page and going, I need to create a design. And so like even backing up a little bit from before you start using some of those tools, but like going okay.

So let’s talk about how you get from a blank page all the way to the end. And so I propose that we just talked about if you needed to build a landing page for your online course. That way, we have something we can talk through and think through like what actually needs to go in and how do we pull that content together?

Kathy: Perfect. I think that’s a great way to just hone in on one specific area where we may have a lot of people working with LearnDash or other LMS systems and… maybe they’re not even there yet deciding what LMS tool they’re going to use. But they’re like, I have knowledge, there has to be somebody listening to this who has knowledge that they can transfer to someone else and monetize that somehow.

Where do you even start?

Ben: I think one thing, whenever you’re starting a new page and this can extend everywhere, is you have to go, what is the primary goal of this page? I think we talked about this back when we talked about building a homepage for Hannah’s midwifery. And I think, you need to start there. You need to say, okay, what is the goal?

Because everything needs to lead toward that goal. And it all needs to be communicated as clearly as possible so that the customer’s not confused with, am I supposed to go here or am I supposed to go here with competing things or with just things that aren’t in their language and aren’t giving them a direct path.

You want to start with, what’s my goal. And if we’re doing the course page, the goal is that they sign up for a course. And you probably have options for that. You might have the basic course package and then the VIP package that comes with a free 30-minute consultation. And, you know, those add-ons that you typically see with courses where it’s like gain access to a private Facebook group, that kinda stuff.

So you probably gonna have some packages, you probably thinking about a pricing table. And then from there you need to say, okay, well, if my goal is to get them to buy, I need to start by giving them a reason to buy. To do that, you have to know how to communicate to the person that you’re trying to get.

So you need to know who you’re communicating with. And this kind of goes back to what we talked about before. What is that target customer? You need to make sure you’re speaking their language with all of that you’re saying, but right at the top of that page, what we need is we need something that basically says: this is why you want to take this course, and this is what’s going to change in your life. You’re defining for the customer that is showing up on this page right away, that you’re either hinting at their problem or you’re spelling it out for them. And you’re saying you have this issue, this course will solve it.

And when you’re talking about courses in particular, you’re not just solving one problem. You’re actually trying to define for them what the outcome is for them as an individual, what’s going to change for them and how that’s going to affect them going forward.

But in that terms, you still got to think through, okay, this person has problem. They want to write a book, and they need somebody who has experienced writing books to coach them through writing a book. So you have a course on how to write your first novel. That customer base, you need to speak to that and be like writing a novel is a lot more than having a good idea for a novel. It is about planning. It is about persistence. You start to explain that and say, and this course gives you not only all the tools to do it, but you also have a community around you to help you and to get feedback from, and now I’m coming in going, I think I need this.

And that’s how you can kind of start to get into that. You’ve got to be able to figure out that stuff first, before we jump into any kind of design stuff. What is it that is going to connect with this person? Let me get the content together that I’m going to need. Starting with, in my mind, when you’re doing a sales page. You got to start top of the page has to be big, pretty short text and as clear and concise as possible, you spelling out essentially the problem and how your solution is the answer to that problem. From there you want to work through what different pieces are going to make that initial offer better.

So as I scroll down, they’re going, they’re getting more and more of like, yeah, I need to do this. Yeah, I need to do this. And you can have that “buy now” button throughout the page. You don’t want the customer to ever be like, where do I sign up? You also can create that journey as they scroll down to like a pricing table. Testimonials are key. As you think through all of that, now you’ve got, I’ve got to have some concise language at the top, and I need some kind of picture, preferably somebody smiling or an outcome to visualizing the outcome with a picture.

As you’re thinking through, like, how do I build this? You got to start gathering that content together, the text that you need, the testimonials, you need to think about your pricing table and what are going to be the features of that pricing table. And so it’s really important that you do some content gathering and you really think through your customer initially.

Kathy: Once you have your content, you obviously don’t want just text on a page. You don’t want just like your button and a picture. How does someone start really putting some of those design elements together, where do you get ideas? Because you could go look at your competition and see what they’re doing. Maybe you’d do a search for other people who are doing a course on how to write a book or how to write a novel and see if there’s competition out there and how are they doing it. But who’s to say that they’re doing it well. How do you know what decisions to make around design?

Ben: Yeah. I mean, I think looking at your competition is a great strategy because usually if you have competition, they’re at least doing well enough to exist. So that’s, that’s at least a good, like if they exist. You know, they’re at least doing well enough to exist. So definitely you want to glean from competition.

I’m a big fan of doing searches for good design. The problem I find a lot of times when people like, just focus on design is that they’re not actually building a well converting page. So you can go to like design awards for websites and see all these really funky really out there kind of websites that may not actually be very converting websites, and also can be so outside of the norm, that for the average user, it’s like, this is a novelty, but like, I actually don’t know how to navigate this website. So I would just be careful with searching things like best web design. I think you want to focus on the problems you have.

And using words like conversion in your searches, but okay, I know I need a hero section. I know I need a testimonial section. I know I need a pricing table section. Sometimes you’re going to get better design ideas when you start searching for those sections versus how do I build a good course landing page?

Or just in general, what’s good design. And so I’m doing an inspiration and a search phase. I’m taking screenshots of things that I like. trying to take notes. So this would be a good time for something like a Miro board or a Figma where you’re just, you’re throwing in screenshots and you’re taking notes, and giving yourself a place where you can see all your pieces coming together in terms of elements that you want in your page or design ideas for how you want to organize your content, alongside of always keeping in mind your own color scheme and then your actual pictures. What I find the most is that, um, people will go and look at these designs and be like, oh, I want to recreate this. And then they put their pictures into it and they’re like, man, this sucks. And it’s because your images are not good enough.

And I think that’s another big thing. Images speak so much to the overall design of a page. I mean, it just, it is a massively overwhelming part of the design. You can spend all the time you want getting the right gradient or the right font, but choose the wrong images and your design goes out the window.

It’s a really important part, whether you’re finding stock images or you’re going to go take the pictures, getting really, really good images goes a really long way. If you want to have a good design, you gotta have the right pieces to start with.

Kathy: Hannah, from a customer standpoint, when you’re on a page and you’re considering purchasing something, what elements sort of… Is it the flow of the page? Is there something that pops within a page? How does that experience like resonate with you?

Hannah: Yeah, I would say it’s all of that. I mean, you’re really trying to create an experience for people, right? So, like Ben said, I think images are huge. Do your images match? You know, if you have stock photos that are clearly stock photos and they’re not, they don’t match and they don’t flow, that’s such a turnoff.

But when you clearly have created an experience and I feel like I’m. You know there, or, you know, you feel like you’re here in Mexico on the beach, you know, if you’re able to give someone that just by like them seeing your website or seeing what you’re offering them, that’s huge.

Ben: I think it’s important to state here, getting ahead of yourself and jumping into like actually designing, let’s say in Figma or actually designing in WordPress without your content figured out, it’s a recipe for absolute frustration. Cause when you’re like, well I’ll figure out my images later.

Don’t do it, because you will spend so much time messing with trying to make a design look good without the actual content that you’re going to need to do. And it’s just frustrating around, and you’ll end up redoing it over and over again, as you go through and actually finally get some of that content in and go, wow, none of this works because my images are different than what I was expecting. So don’t get ahead of yourself. Get your content together, spend the time to really think through. And that’s part of why you do the inspiration phase is to say, okay, now I know I need three images like this because I really want a section that talks through these three features or these three things that are important for the customer to know.

In that initial stage, as you’re getting your things together, then it’s like, okay, I really have to nail down what my content is going to be before I jump in and start actually designing. And don’t use someone else’s content to design with. You definitely want to get your own content first.

Kathy: Sure. Well, a unique selling point is going to be the unique content that you have on your site. The thing that connects with your audience in a unique way is something that only you can create. It’s not something that you can lift images from other places or copy from other places.

Just, just don’t do that. That’s not going to work. It’s not going to resonate because when you’re trying to replicate what somebody else has created and connect with an audience, it’s, it’s not going to have your unique voice. What you bring to it, what your business brings, what’s your brand brings is what is going to differentiate you in the long run and is going to help you rise above.

In terms of, okay, so let’s say I’ve got my Figma and I’ve got all of my sketches and all of the things that I want on the page. And I’ve got like a basic, okay. I’ve seen everybody’s using hero images at the top, so they must work. How do I then start structuring the page? Do I jump in with testimonials first? Do I need to explain things better first? How do I know which way I’m going to organize a page in order to really connect with the customer? What comes first?

Ben: I’m a big fan of that hero top and it doesn’t always have to be a full width image. Sometimes it’s a text and image beside it. You want to have that big header at the top that basically says, this is what you’re here for. And then from all the research I’ve seen, it actually doesn’t matter how you order the rest of the page.

Interestingly enough. If you want to go features testimonials, in the end, no one can say that testimonials next is more important. I think you want to put your best content first. So if you have the most amazing testimonial, you’re like, I need people to read this, put it front and center, put it right under that.

But if you don’t and you just have like, yeah, I have testimonials and they’re good, but they’re like, what you’d expect, then put them lower down because you need them on the page to just give yourself that level of brand trust. And that’s another part, maybe you’re in a situation where you work with known brands and so then you need to put like those, you might say, these brands trust us.

Or you have a ton of users and you say, I have this many users. You’re always wanting to figure out ways to get that customer to feel like I can trust this person. I’m not like their first customer. That can be done in more ways than testimonials and whether or not that comes first or in the middle, based on the research, it’s kind of like, it’s more about what you’re doing and what you’re selling or what you’re building for then, like, this is the exact path. I think in general, people say make sure you have that concise explanation and call to action at the very top of your page. Usually you want a picture there and then if it makes sense, sometimes that pricing table’s right at the top, especially if it’s second navigation for the user, like let’s say they go to your homepage and then they click on the pricing page.

You probably don’t want to dive that pricing page down below. They intend to look at pricing, so show them the price. In like a traditional landing page, that pricing page can go down below.

Make sure that you, you keep the call to action is clear and then I think you’re, you’re ready to go. So you’ve got your content. You kind of know what sections you want and you’re ready to start actually designing for your website.

And to me, at this phase, this is where I would push people to do it in WordPress.

I get it. I’ve gotten some pushback to say, well, it’s a lot easier to collaborate right now, both of you working on the same thing and something like a Figma or whatever. And I get that. If you have the luxury of collaborating with somebody, maybe that becomes the thing. Generally I don’t. And I don’t know a lot of people that do have that luxury of being like we’re going to have two or three designers working on the same thing at the same time.

But to me, you want to be as close to the where it’s gonna live, where it’s going to actually be. And you want to be doing it there. Don’t do your work three times by creating it in Figma and then trying to figure out how to, or, you know, we’re picking on Figma. like Figma is a great tool.

But it doesn’t convert to a finish website. You have to kind of manually do all that stuff. And I know people will be like, well, you can export the HTML and all that stuff. And it’s like, yeah, I’m in, but that’s not what you actually want in the end. What you want is in WordPress, and in the WordPress tools you want to use.

My thing is Kadence should be enough of a tool that you don’t need another design tool to design in that you can actually do your design work in Kadence. And not needing a tool to do it, but you get into Kadence and you go, okay. And you only need a little bit more padding here.

And I know I want border radius here and a little bit of drop shadow here, and you can get that really fine design right inside of Kadence because it’s a design tool. And so you get to use it as a design tool and you get to tweak and you get to move and you can undo things and redo things, but you’re doing all the work there.

So when you’re done, you’re actually done and not like, okay, we finally finalized the design and it’s in Figma. And then you go, okay, great. Now we’ve got to do all this work again to actually make it in WordPress. To me, I want to be much closer to the end of where it’s going to live and designing there and also designing under the restrictions of that.

Like there’s restrictions in WordPress and there’s restrictions in Kadence. As much as I want to give you every single option and I continue to work toward making it as more options as possible. There is still always going to be design restraints. And you need to think about those as not always restraints, but as like, it’s keeping me within a certain, a certain realm of what I should be editing and what maybe I shouldn’t.

Kathy: Right. I have so many things I want to say. First of all, I think what ends up happening is when you’re designing in a tool like Figma, or Miro or whatever, and you’re ideating on what you want something to look like, you can get almost get into, a perfectionism model where, well, and then we can tweak this and we can tweak this and we can tweak this.

And all of a sudden, you’ve got this pie in the sky design that may look great. Maybe absolutely perfect. It may have, the best minds, putting all of their content and design ideas together into something that’s absolutely perfect. And then it doesn’t necessarily translate well in the real world. The other thing is when you’re even designing, for example, if you’re designing something that is using custom fields and you’re doing data design and in a perfect third-normal form database, this is how everything should work, right.

It should have this table related to that table and everything should be perfect and third normal form. In the real world, that might not actually be the best way to give data input to someone, to Jane in the front office, you’re going to have to select this and it’s going to be this way.

And then when you turn it over to actually having it in WordPress, it might not actually be able to be designed to that way. So when you’re designing much closer to the tool, not only are you saving time, you’re saving the analysis paralysis of making everything perfect in your design tool, walled-off garden. But you’re doing it with the tool that’s going to display it to the customer. You’re doing it in the way that’s going to be best not only for the people who are using wp-admin, but the people who are viewing it on the front end, within the constraints of the tools. And a lot of this dynamic content, the tools for dynamic content are still sort of in their, well, they’re not really in their infancy, but there’s a lot more that needs to be done. There’s a lot more that can be done to make the no-code way of dynamic content work. So working within that, building something that can grow with the tools as they’re growing, doing it in WordPress makes a lot more sense, at least from my experience. I’m off my soapbox now.

Ben: Yeah. I think it’s pretty frustrating sometimes when you know, I I’ve gotten files from a designer in Figma and I’m like, but what is, what about mobile? And they’re like, oh yeah, I probably need to make you a mobile version too, huh. And I’m like, well, no, when you design in WordPress, you’re designing already in mobile.

You’re already trying to figure it out as you go. You just had to think that way right from the beginning. And you can get into some of these design tools and not be forced to think that way. I think the most common thing, actually, I see it’s not even mobile because most people are a little bit more aware.

It’s big wide screens. They designed these really pretty narrow pages and I’m like, well, but what happens when that only fills one-third of your screen? And you pull that width out, and all of a sudden it’s totally different design. I think those tools are really helpful, but I often am more frustrated by what they’re not showing when somebody is designing them and what the designer is not thinking about and able to kind of not think about, well, I don’t need to think about a 27-inch wide screen here because I set my pixel width at 1400 and that’s this wide it’s the screen is cause that’s what it is in Figma and things like that.

So, I would encourage people to try to design in WordPress when they can, but don’t do it without your content because you will be so frustrated to try to do it without. It just doesn’t, it just never really works.

Kathy: Okay. Well, that’s a definitely an interesting discussion. We’d love to hear from you about your experiences, designing new sites or redesigning sites. What tools are you using? What works for you? Are you finding tools like Figma, Miro, and I don’t know, Adobe’s got stuff too. There’s a whole list of things that you can use in order to design.

Do they help your process? And if so, how? Or do they kind of just get in the way and you’d rather just, start with a starter template or Kadence wire frames and just roll from there. We’d love to hear from you. Ben, you did a great training the other day was that yesterday?

Ben: That was yesterday. Yeah.

Kathy: I am so excited about Shop Kit 2.0, I know everybody who was on that training is excited for it. We’re getting pinged on Twitter and other social media places. When’s it dropping? When can we play with it too? Give us a good overview of what Shop Kit 2.0 includes and when we can see this in people’s dashboards.

Ben: Yeah. I mean, I think you can see it in your downloads page by the time you’re listening to this, you should be able to go into your account and see it in your downloads page. Um, that’ll be the beta version. Things are really close. I’m still always kind of like doing little tweaks in here about like what settings, but it very much is like a good foundation for templating inside of WooCommerce.

So what 2.0 largely brings into the equation is the ability to create templates for your product pages, your archive pages and things like that. And you can apply them to an individual product or you can apply them across a category or a tag or whatever. , that key means that like every piece of WooCommerce then got kind of put into a block with its own block settings.

So you can kind of rearrange and organize and there’s some cool things you can change the way that tabs work inside of a product page, which is kind of a standard WooCommerce implementation, but you’re going to get a lot more control over it. Hide and show tabs, change the order, things like that. You also get, with Shop Kit 2.0, we kind of rewrote our gallery. So the gallery extension now is a lot more robust. It does like variation galleries and has a lot more control for different layouts based on screen size, so that’s pretty exciting. So yeah, it’s largely going to be a tool to help you build very unique and much more interesting product pages, so it’s just going to be much easier for you to do really cool stuff.

Kathy: Very exciting. And so the beta is going to be available. If you are a bundle owner full bundle or the lifetime or if you bought Shop Kit in the past, that’s available to you as well. And the full version going to be ready in a couple of weeks, looks like. So very exciting. Well, if you are on our mailing list, you will get an announcement as soon as all of the stuff comes out.

And that’s the big news with Kadence right now. I know you got a lot of other things going on. I don’t want to put any pressure on you of when those types of things are coming. Cause I know this is a big one and big news for Kadence and WooCommerce users. Well, any final thoughts?

Ben: Well, go party up on the beach, Hannah, for us both because you’re only one that’s successfully is in the party zone.

Hannah: I’ll do what I can.

Kathy: Excellent. Yeah, we’re all living vicariously through Hannah’s adventures right now. So very cool. Well, we will be back in a couple of weeks. I think next time we should talk a little more about WooCommerce because there’s some interesting things happening there. So thanks for tuning into the Kadence Beat and we will talk to you next time.

Create Your Website With KadenceWP Today!

Kathy Zant
Written by Kathy Zant

Kathy is a writer and speaker who helps businesses and people thrive. She creates some of the best content and tutorials about how to get more out of technology, marketing how-tos that help you grow your business, reports on security issues you need to know as they occur, and gives you all the tutorials to stay ahead and secure your life and business.

View more articles by Kathy

3 responses to “Episode 10: Building Design Prototypes in WordPress with Kadence”

  1. Doug Watt Avatar

    Very keen to start playing with Shop Kit 2.0.

  2. Kathy Zant Avatar

    Hi Doug, the beta version is available in your product downloads. Please let us know if you have feedback!

  3. Line49 Design Avatar

    I enjoyed this discussion about designing right in WP! It’s kind of the holy grail to be able to design and build simultaneously and have things just be ready for production.

    I think Figma etc is in no danger of that happenning for UX designers, and if they were trying to work in a web building tool they might prefer Wix over the WP block interface. However for those of us who both handle design and then build with something like Kadence, there are definitely going to be cases where going straight to WP makes sense.

Kathy Zant

By Kathy Zant

Kathy is a writer and speaker who helps businesses and people thrive. She creates some of the best content and tutorials about how to get more out of technology, marketing how-tos that help you grow your business, reports on security issues you need to know as they occur, and gives you all the tutorials to stay ahead and secure your life and business.

Updated July 22, 2024

| 27 min read

Create Your Website With Kadence

More to Explore