Changing Post Meta Data Overlaid on Images on Magazine Pro Theme

[coralsea]

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.

[charriott4]

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

---

Web Designs By Chrissy | Twitter @designbychrissy

Follow Me On Facebook

[Randal Oulton]

Me three please, very much so!

[DTHkelly]

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

Magazine Pro javascript files

[DTHkelly]

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;

[DTHkelly]

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 ...?????

[bandj]

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.

[DTHkelly]

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

[bandj]

just sent one. We'll see what they say

[bandj]

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