How to move Entry Meta for archive display

[jeffwaters]

I'd like to shift the Entry Meta (date+comments) to just above (and to the right of the featured image thumbnail) for just my archive listings. I'd prefer to leave the Page/Post Meta just as they are.

Is this possible? How would I go about it?

Example here:

http://lifeupfront.com/

[Tom]

Hi Jeff,

Add this code (carefully) to functions.php:

function themeprefix_archive_post_info() {
if ( !is_archive() )

	return; //bail if not archive

	//* Reposition the entry meta
	remove_action( 'genesis_entry_header', 'genesis_post_info', 12 );
	add_action( 'genesis_entry_content', 'genesis_post_info', 8 );

}
add_action('pre_get_posts','themeprefix_archive_post_info');

Refs:

Entry Header

https://codex.wordpress.org/Function_Reference/is_archive

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[jeffwaters]

Thanks, Tom! I have the Genesis Simple Hooks plugin installed. Would it be possible to use that instead of directly modifying the functions.php file?

[Tom]

No.

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[jeffwaters]

Here you can see the result of this change:

How would I go about reducing the padding (or line spacing maybe?) after the Date/Comment line just for Archive views? Is that some sort of conditional CSS thing?

[Tom]

Adjust the value as desired; this is placed in the child theme stylesheet before the media queries.

.archive .entry-meta {
	margin-bottom: 5px;
}

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[jeffwaters]

Very cool, thanks!

I am using a Child theme-- but, curious if I ever have to worry about losing these CSS customizations if there is an update to the Agency Pro theme?

Finally, how might I remove the divider line and move the post-info (Filed Under...) up under the excerpt? Again, I'd only do this for the Archive view and leave the Post view as-is.

[Tom]

Remove line: in stylesheet

.archive .entry-footer .entry-meta {
    border-top: none;	
}

Reposition: in functions.php

function themeprefix_archive_post_meta() {
if ( !is_archive() )

	return; //bail if not archive

	//* Reposition the entry meta
	remove_action( 'genesis_entry_footer', 'genesis_post_meta' );
	add_action( 'genesis_entry_content', 'genesis_post_meta' );

}
add_action('pre_get_posts','themeprefix_archive_post_meta');

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[jeffwaters]

1) thank you... you are amazing.

2) I ended up combining these above into a single bit of code:

//* Move Date metadata to the right of featured image in archive listings and shift the footer meta up
function themeprefix_archive_post_info() {
if ( !is_archive() )

	return; //bail if not archive

	//* Reposition the entry meta
	remove_action( 'genesis_entry_header', 'genesis_post_info', 12 );
	add_action( 'genesis_entry_content', 'genesis_post_info', 8 );

	//* Reposition the footer entry meta
	remove_action( 'genesis_entry_footer', 'genesis_post_meta' );
	add_action( 'genesis_entry_content', 'genesis_post_meta' );

}
add_action('pre_get_posts','themeprefix_archive_post_info');

3), here's the finished product if anyone else wants to follow these directions:

[jeffwaters]

One final bit:

I really like this concise archive view with the info to the right of the 150x150 thumbnail. Looks great in every view except in portrait mode on a smartphone. In that orientation, the text to the right of the image only has room for about 3 words per line and ends up spilling over below the image:

How could I have all post entry, excerpt and footer entry info show up below the thumbnail image in this scenario?

Ideally, the thumbnail would be resized larger size responsively fill the width... or, if that's not possible, center aligned.

[Tom]

@media only screen and (max-width: 480px) {
	
	.archive .entry-meta {
		clear: left;
	}
	
	.archive .entry-content img {
		width: 100%;
	}
	
}

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[jeffwaters]

THANK YOU!

Wow, that was simple and works great!

[Author]

Posts