[Resolved] Add a line break in meta on mobile

Hi Michelle,

May you kindly link us to a sample page in your website where you want to apply this change?

Hope to hear from you soon. 🙂

I see. If you still want it beneath on mobile, here is a CSS you may add in Appearance > Customize > Additional CSS:

@media (max-width: 768px) {
    /* CSS in here for mobile only */
    .wp-show-posts-entry-meta {
    display:flex;
    flex-direction:column
    }

    span.wp-show-posts-separator {
    display:none;
    }
}

Otherwise, if you wish to put the author after the date, you can try excluding the author as such: https://share.getcloudapp.com/kpuJ6d57

Then add this PHP snippet:

add_filter('wpsp_date_output', function($dateoutput){
	$holder1 = sprintf(
				'<span class="wp-show-posts-byline wp-show-posts-meta">
					<span class="wp-show-posts-author vcard" itemtype="http://schema.org/Person" itemscope="itemscope" itemprop="author">
						<a class="url fn n" href="%1$s" title="%2$s" rel="author" itemprop="url">
							<span class="author-name" itemprop="name">%3$s</span>
						</a>
					</span>
				</span>',
				esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
				esc_attr( sprintf( __( 'View all posts by %s', 'wp-show-posts' ), get_the_author() ) ),
				esc_html( get_the_author() ) );
	return $dateoutput . '| by ' . $holder1;
});

Adding PHP: https://docs.generatepress.com/article/adding-php/#code-snippets

Adding it through Code Snippets should work.

Hope this helps! 🙂

You’re welcome Michelle! Glad to be of assistance! Feel free to reach out anytime you’ll need assistance with anything else. 🙂