Display Custom Hyperlink After Post Meta in Kadence Theme on Single Posts
The custom_kadence_after_entry_meta
function hooks into the kadence_after_entry_meta
action to display a custom hyperlink after the post meta on single posts. This link only appears for posts belonging to specified categories or their subcategories. The hyperlink points to the “recipe” section within the current post, identified by the HTML anchor #recipe
, and is styled with a custom CSS class to change its color to red.
Things to change:
- Line 5 the category ID
- line 10 the html anchor for the link.
- You can rename the css class “custom-recipe-link” to anything you want. just make sure to change it in the css value.
- Customize the css value to match your website.
- Set the html anchor in the post.
I use fluent snippet plugin for all my functions, js, and CSS:
Add this to your functions.php or code snippet plugin.
function custom_kadence_after_entry_meta() {
// Only run on single posts
if (is_single()) {
// Define the category IDs where the link should be displayed
$allowed_categories = array(1, 2, 3); // Replace with your category IDs
// Check if the current post is in any of the allowed categories or their subcategories
if (in_category($allowed_categories)) {
// Get the current post URL
$post_url = get_permalink() . '#recipe';
$link_text = 'Read More';
// Output the hyperlink with a custom class
echo '<a href="' . esc_url($post_url) . '" class="custom-recipe-link">' . esc_html($link_text) . '</a>';
}
}
}
add_action('kadence_after_entry_meta', 'custom_kadence_after_entry_meta');
If you want to add something infront of the entry meta change this: kadence_after_entry_meta to kadence_before_entry_meta in the script above.
The CSS you will need to add to your styles.css
a.custom-recipe-link{
color: red;
}
Make sure to add the html anchor to the block or section you want the hyperlink to go to.
Notes:
This basic script, CSS style, and plugin are designed to function optimally assuming minimal interference from your theme or other plugins. If conflicts occur or further customization is needed, additional adjustments may be necessary. Please note that this script, CSS style, or plugin must be used AS IS.
Wp Scriptly
Comments: