Display Post Publish Date with Custom Styling – Kadence Pro Guide

By Webmaster

Posted: 12m & 12d ago
🕑 3 min read

👁 Views: 498

(0) Leave a Comment

Shortcode - WpScriptly

Display Post Publish Date with Custom Styling (Kadence Pro Advanced Users)

For advanced users who own a copy of the Kadence Pro package, we have a custom solution to display how many days ago a post was published, complete with CSS styling.

This solution involves adding a shortcode to your WordPress site, which can be done by modifying your theme’s functions.php file or by creating a new snippet. Once set up, you can use the shortcode Posted: 12m & 12d ago to display the publish date in a “days ago” or “hours ago” format, styled according to your preferences.

This snippet will display how many hours or days ago the post was published!

I use fluent snippet plugin for all my functions, js, and CSS:

Implementation Steps:

  1. Add the Code: Insert the following PHP code into your theme’s functions.php file or a custom plugin

2. Use the Shortcode: Place the Posted: 12m & 12d ago shortcode in the content of any post, page, or widget to display the “days ago” text.

Example:

If a post was published 6 hours ago or 3 days ago, using the shortcode Posted: 12m & 12d ago will display:

3 days ago  or 6 hours ago

Styling Customization:

The CSS class .days-ago is applied to the output of the shortcode. The following styles are included in the days_ago_shortcode_styles function:

  • font-weight: bold; – Makes the text bold.
  • color: #0073aa; – Sets the text color. You can change #0073aa to any color you prefer.
  • font-size: 16px; – Sets the font size. You can adjust the size as needed.

Feel free to customize the CSS to match your website’s design.

Note: This solution is designed for advanced users who are comfortable editing PHP files and have access to the Kadence Pro package for additional customization options. Additionally, you will need to know how to design a custom post loop within Kadence Elements. Please ensure you have a backup of your site before making any changes.

Author: Webmaster, Admin at WpScriptly

Hey, I’m Scot, the guy behind WpScriptly. I create simple, no-fluff WordPress plugins and tools to make your site easier to manage and more powerful. Everything I build is tested on my own projects first — if it’s here, it’s because it works. Thanks for checking out the site. Hope you find something useful at Wp Scriptly.

*These scripts and plugins are provided as is with no guarantees or warranties. If you need assistance or run into issues, feel free to reach out via the contact page.

Comments: