View Categories

Kadence Elements – How-to’s

When customizing your Kadence theme using elements hooks, choosing the right hooks depends on where you want your custom content or design to appear on your website. Here’s a guide to some of the most commonly used hooks and their typical use cases:

Which Hooks To Use & How

Header Hooks:

  • before_header: These are perfect for announcements, promotional banners, or notifications that appear above the header. They can convey a “Free shipping on orders over $50!” message or an emergency alert.
  • after_header: This can be utilized for full-width hero images, welcome messages, or site-wide notifications that appear directly after the header. You can also include a large call-to-action section or a seasonal sale banner.
  • inside_header: You can customize the header area by adding extra elements such as a menu item, social icons, or a custom search bar to display a unique phone number or an additional menu.

Content Area Hooks:

  • before_content: Here you need to consider including breadcrumbs, a welcoming message, or a custom introduction before the main content. This will enhance user experience and provide necessary content across all posts and pages.
  • after_content: Incorporating site-wide calls to action, such as a newsletter signup form, social share buttons, or related content suggestions. All these extras can be crucial for maximizing user engagement and interaction.
  • before_entry: You can add custom content or notices that appear before each post or page content starts. These can include content such as author disclaimers, legal notices, or introductory text.
  • after_entry: After each post or page content ends, you can add content such as author bios, related posts, and comments sections, as well as an author bio box or post navigation links.

Post Title Hooks:

  • before_title: Here, you can add categories, dates, or icons before post titles and display post categories or a custom label (e.g., “New”).
  • after_title: Displaying metadata or post details directly after the post title is a great way to showcase important information such as the author’s name, date, or comment count.

Footer Hooks:

  • before_footer: Here, you can include site-wide call-to-action sections, footer widgets, or any preferred content above the footer. Additionally, you can consider adding a “Contact Us” button or a secondary navigation menu for enhanced user engagement.
  • after_footer: You can add legal notices, copyright information, or any custom content after the footer. Additionally, GDPR compliance and cookie consent notices can be included.
  • inside_footer: You can easily customize your footer by adding social media icons, custom text, or additional navigation. You can also incorporate custom HTML or text widgets within the footer area.

Archive Page Hooks:

  • before_archive_content: Integrating introductory text or SEO content at the top of category, tag, or archive pages is essential for optimizing those types of pages. Additionally, you can provide a clear introduction or description for a specific category page, which is paramount for enhancing user experience and search engine visibility.
  • after_archive_content: At the bottom of archive pages, you can include a compelling call-to-action or promotional offer relevant to the archived content.

WooCommerce Specific Hooks (if using WooCommerce):

  • woocommerce_before_shop_loop: Here, you can add content or ads to display before the product grid on shop pages, such as a shop-wide promotion or sale announcement.
  • woocommerce_after_shop_loop: Here, you can display content like custom navigation, calls to action, or information after the product grid. Other things can include “You May Also Like” product suggestions or cross-sell promotions.
  • woocommerce_before_single_product_summary: Here, you can add trust badges, product info, or custom content before the product details, such as a “Free Shipping” badge or trust seals.
  • woocommerce_after_single_product_summary: Here, you can include related products, upsells, or additional product information, like the “Frequently Bought Together” section or customer reviews.

NOTE: Check out our shop recommendations here

Sidebar Hooks:

  • before_sidebar: Here, you can add custom content like ads or announcements before the sidebar. You can also display a custom notice or ad banner.
  • after_sidebar: Here, you can add custom content after all sidebar widgets such as, “Follow us on Social Media” icons or a footer ad.

Choosing the Right Hook

To choose the right hooks, explore the variety of ready-to-use hooks to identify the most effective placements for your website. When working with Elements Hooks, we suggest working in a Staging environment so you can test and identify what will work best for you and your site.

You can also consider the specific goals of your content, such as providing information, engaging users, or promoting products. Then, place the content strategically to ensure it enhances, rather than disrupts user experience.

How to Choose Hooks Effectively

Keep in mind the following details Kadence consistently provides a visual map displaying all hook locations. This is essential for visualizing the placement of your content. You can assess different page templates to identify the most impactful areas for dynamic or promotional content. Some hooks may perform better on desktops than on mobile devices so you may have to make small adjustments to compensate for this.

NOTE: If some of these options are unavailable, you most likely do not have the Kadence Pro installed.

Related Resources

  • Kadence Pro (use this link to grab your discount)
  • WP Staging Pro offers super-fast backup duplicator, staging, and migration

Join The Party For Fun Updates & Big Discounts!