Change width and style of Recent Posts

Support
#1

Hi, Im looking stylize the “Recent posts” a bit. Ive changed them some. If you look here I added them to the bottom of this page:

What I want to do is:

  • make the width narrower, about 225px

  • Turn the title into a clickable link

  • remove white border or make image full width so you can’t see the white border

  • Move the date above the title

Are any of these possible?

Thanks,
Rena

#2

Hello Rena,

Thanks for asking. :slight_smile:

  1. Please add following CSS under Pro > Launch > Theme Options > CSS to change width:

.x-recent-posts a.x-recent-post4 {width: 20%;}

  1. Title is already a clickable link. Can you please confirm?

  2. Please add following CSS under Pro > Launch > Theme Options > CSS to remove border.

.x-recent-posts a {padding: 0;}

  1. To move date above title will require change in core files. For that I suggest you to setup child theme.After setting up child theme, please copy recent-posts.php from /wp-content/themes/pro/cornerstone/includes/shortcodes/ to /wp-content/themes/pro-child/cornerstone/includes/shortcodes/. Next, all you need to do is interchange line number 74 and 75. You can also directly copy page following code. Here is the code you can use at line number 74 and 75/

. '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
. '<h3 class="h-recent-posts">' . get_the_title() . '</h3>'

Thanks.

#3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.