How to Use Kadence Elements: The Ultimate Guide (with Screenshots)
You’ve heard of the “Kadence Elements,” right? But you are not sure what it is. Is it a theme or plugin?
Kadence Elements is a feature in the Kadence Theme. A WordPress theme allows you to create beautiful, responsive pages with drag and drop. It is highly user-friendly and easy to use, making it an excellent option for those new to WordPress or website design in general. Kadence Elements is a great way to create custom sections or templates, and it includes a wide range of features and options that make it versatile and powerful.
What is Kadence Elements?
Kadence Elements is a no-code method of displaying content anywhere on the page. It allows you to take complete control over how your content looks on your website. There are a variety of different ways that you can use Kadence Elements to display your content, including templates and shortcodes. You can start creating Kadence Elements by clicking on the “Customize” link or navigating to the Elements link on the sidebar under Appearance > Kadence > Elements.
Kadence Elements is extraordinarily versatile and can be used for many purposes. It is perfect for those who want to create custom pages or sections without coding. The possibilities are endless!
Let’s look at how to use Kadence Elements to design your way.
You can use Kadence Elements to display:
- Affiliate disclosure text
- discount box
- author bio
- Call to action
- customize header
- styling elements
- and many more
What are the benefits/feature of using Kadence Elements?
Design your way
- You can use Kadence Elements to create custom pages or sections without knowing how to code.
- It is highly versatile and can be used for many purposes.
- It includes a wide range of features and options that make it robust.
- Kadence Elements is perfect for those who want to control how their website’s content looks.
- Flexible shortcodes – Kadence Elements includes flexible shortcodes that allow you to display content anywhere on the page.
Theme Builder / Page Builder
Kadence Elements has a Theme Builder’s functionality, allowing you to create custom page layouts with drag-and-drop Gutenberg Blocks.
What are some example use cases for Kadence Elements Templates?
Building a custom blog layout: You can use Kadence Elements to create a customized blog layout without having to code anything. Use Gutenberg Blocks to drag and drop your desired elements into place.
Customizing an individual blog post or category view: Kadence Elements allows you to customize the look of individual blog posts or categories.
Customizing the archive of a custom post type: You can use Kadence Elements to customize the archive page of a custom post type. It is perfect for those who want to control how their content looks on their website.
Styling individual posts in custom post type: Kadence Elements also allows you to style individual posts within a custom post type.
Making a custom page title/hero area: Kadence Elements allows you to create a custom page title or hero area without coding anything.
As you can see, Kadence Elements is universal and can be used for many purposes. It is the perfect way to take control of your website’s content and design.
How to get started with Kadence Elements?
Buy Kadence Pro
If you’re interested in using Kadence Elements on your website, you first need to buy Kadence Pro. Kadence Pro is the addon to the free Kadence theme that gives you access to all of Kadence Elements’ features.
Kadence Theme Pro is not available as a standalone plugin. You need to buy either the Essential Bundle or the Full Bundle. I recommend buying the Full Bundle since the price difference is not that big, and you get another premium plugin from Kadence.
Kadence Conversions is a great addition to the Elements functionality.
After you have purchased Kadence Pro, you need to log in to the Kadence member area and download the zip file.
Install the zip file by going to Plugins,
Once you have Kadence Pro installed on your WordPress site, you can begin using Kadence Elements to create beautiful, responsive pages and posts, Add New, Upload Plugins Button. Once uploaded, there is a new menu available under Appearance. Don’t forget to register Kdence Pro first by going to Appearance, Kadence.
Turn on Hooked Elements
How to use Kadence Theme hooks?
Go to Appearance, Kadence Elements on the left side of your WordPress dashboard.
Click the add new button; you see four different element types
- content section
- fixed section
- HTML editor
You can design and build any sections you need using Gutenberg blocks, Kadence blocks, or even your page builder when you choose Content Section.
In addition to Kadence Hooked Elements, Fixed Section Kadence Elements are insanely powerful. They allow you to create any section you want with Gutenberg blocks, Kadence blocks, or your page builder, except now you can fix them on your website, so they stay as users scroll.
Here are all the fixed placement options for a Kadence element:
- Fixed On Top
- Fixed Above Transparent Header
- Fixed Top After Scroll
- Fixed Bottom After Scroll (no space below footer)
- Fixed Bottom After Scroll
- Fixed On Bottom
- Fixed Bottom (no space below footer)
Template Kadence Element
Blog and archive pages can be customized entirely using this template element.
HTML Editor Kadence Element
Selecting HTML Editor for your element will present you with a slightly different screen that allows you to input code.
The editor allows you to input any HTML code you want for your site.
How to use Kadence Elements to create a custom layout?
You can create a custom layout with the Kadence Element type template. There are various scenarios of how to use a template. Here are a few placement conditions you can set in Kadence Elements.
- Replace Header
- Replace Footer
- Replace Sidebar
- Replace single post content
- Replace 404-page content
Kadence Elements offers a lot of display settings where you want to show the template on your website. For example, you can create a temporary section for a specific time and replace the default page.
How to use Kadence Elements to create a custom header?
When choosing the Element type Template, select “Replace Header” for the placement of your custom header. If you want to show a different header on your website, set the display condition where it will appear.
How to use Kadence Elements to create a custom footer?
Choose the Element type Template to create a custom footer and choose “Replace Footer” for the placement. Set the display condition on where on your website you want to show a different footer.
What are other options of Kadence Elements available for your WordPress site?
I already talked about the placement and condition option, but there are more.
- User Settings
- Device Settings (not available in Template elements)
- Expires Settings
Specify the audience for whom the element should be visible. You can limit access to logged-in users or administrators only, for example.
Show the element only on desktops, tablets, or mobile. You can explicitly choose the device.
Set an exact date when the element should expire. Great for sales offers for a limited time.
How Is Kadence Element Hooks Different compared to other themes?
Several Kadence theme rivals on the market now offer element hooks well before the Kadence theme was available. Some of my favorite themes that include hooks are Astra and GeneratePress. However, no one can match the features and capabilities of the Kadence Element Hooks.
For example, even beginners may use Kadence hooks thanks to their straightforward user interface and functionality.
Most other themes don’t have the same hooks feature that Kadence offers.
Kadence Element Hooks also come with many other options such as placement settings, expiry settings, and more that you won’t find in any different theme’s hooks.
Therefore, if you want to use the true power of hooks, then be sure to use the Kadence Element Hooks feature found only in the Kadence Pro Theme.
Why do you need Kadence Elements?
Kadence Elements, part of Kadence Pro, is a powerful feature that gives you everything you need to create beautiful, unique pages easily. Furthermore, Kadence Pro has a collection of pre-built templates you can use to get started or create your custom templates from scratch.
What are some other alternative themes to Kadence?
If you’re looking for other themes with a similar look and feel to Kadence, I recommend checking out the following themes:
These themes are all well-supported and offer a similar level of functionality and flexibility as Kadence.
What is Kadence Hooks?
Kadence Hooks allows you to add anything anywhere on your website with the Kadence Pro theme using Elements.
For example, add a fixed header banner, custom-made 404 page, affiliate disclosure, and many more awesome things.
What are some use cases for Kadence Hooks?
– different header for blog page
– custom sidebars
– affiliate product sales banners
– 404 error page
Kadence Element Hooks is one of the many outstanding features of Kadence Pro. The ideas are endless; what you can do with Kadence Elements, your imagination is the limit.
Please let me know how you are using Kadence Elements. You can also write me an email at email@example.com.