• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Changing Post Meta Data Overlaid on Images on Magazine Pro Theme

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Changing Post Meta Data Overlaid on Images on Magazine Pro Theme

This topic is: not resolved

Tagged: date info, Magazine Pro, meta data, post category

  • This topic has 9 replies, 5 voices, and was last updated 10 years, 10 months ago by bandj.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • March 7, 2014 at 11:22 pm #93919
    coralsea
    Member

    Hello,

    I just purchased the Magazine Pro Theme. I liked the way the date was overlaid on top of the featured image and the images in the two column section on the sample homepage. However, on my site, I would like it to display the post category (and not the date) over the image, and have the post date display below the image with the author info.

    I tried adding in [post_categories] before the date short code under show post info using the Genesis Featured Post widget, but this adds the category info below the image. The date stays in the same place.

    Does anyone know how to do this? My site is not live yet.

    Any help would be greatly appreciated. Thanks.

    March 12, 2014 at 9:57 am #94440
    charriott4
    Member

    I would like to know how to do this as well 🙂


    Web Designs By Chrissy | Twitter @designbychrissy

    Follow Me On Facebook

    March 22, 2014 at 9:20 pm #96123
    Randal Oulton
    Member

    Me three please, very much so!

    July 8, 2014 at 11:34 am #113439
    DTHkelly
    Member

    I don't know the answer (just submitted a help ticket), but here's what needs to be changed:

    Magazine Pro javascript files

    July 8, 2014 at 12:37 pm #113446
    DTHkelly
    Member

    Speedy and (partial) response from Support:

    This is all done with CSS and JS, so you'd need to find all the instances of CSS like this and change it to the corresponding CSS for category and change this script - https://github.com/copyblogger/themes/blob/master/magazine-pro/js/entry-date.js

    And also this css:
    .js .content .home-middle a .entry-time, .js .content .home-top a .entry-time {
    background-color: #E8554E;
    bottom: 24px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 300;
    padding: 5px 10px;
    position: absolute;
    right: 0;

    July 8, 2014 at 1:09 pm #113458
    DTHkelly
    Member

    From Support:

    Look in the theme folder itself on the server.

    /magazine-pro/js/entry-date.js

    It uses append($time) to produce the date.

    Remove that and replace with the function you wish to show.

    http://codex.wordpress.org/Function_Reference/get_the_category

    We have to replace: append($time) to produce the category

    Would it be:
    append($category)

    Close but ...?????

    July 29, 2014 at 8:58 am #116217
    bandj
    Member

    I changed the .entry-time parts to category but that doesn't work. This looks like it works on elements so I don't know how to target the categories.

    July 29, 2014 at 9:04 am #116218
    DTHkelly
    Member

    Have you submitted a support ticket to StudioPress? Hopefully they can provide the missing info.

    July 29, 2014 at 9:33 am #116222
    bandj
    Member

    just sent one. We'll see what they say

    July 30, 2014 at 5:31 pm #116386
    bandj
    Member

    1. Change the js file to this and notice where you have to put "categories"

    jQuery(function( $ ){

    // add js body class
    $('body').addClass('js');

    // find time for each entry and move it inside the image link
    $('.home-middle article, .home-top article').each(function(){
    var $time = $(this).find('.entry-categories');

    $(this).find('a.alignleft, a.alignnone, a.alignright').append($time);

    });

    });

    2. In the featured post widget where it says show post title show post info, in the box below add this

    [post_categories before=""]

    mine now looks like this: [post_date] By [post_author_posts_link] [post_comments] [post_categories before=""]. The 2 quotes at the end eliminates the words "filed under". You can add text between the quotes.

    3. In your css where you find

    .js .content .home-middle a .entry-time,
    .js .content .home-top a .entry-time

    Add this:

    .js .content .home-middle a .entry-categories,
    .js .content .home-top a .entry-categories

    Then add this in your css also for font color

    .js .content .home-middle a .entry-categories a,
    .js .content .home-top a .entry-categories a {
    color: #fff;
    }

    We can thank Amelia Briscoe Technical Support Advocate for this as we went through a few emails to get this right.

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble