Docs

[Smarticle]

3 customisations required (based on this page… and another mentioned further down):

1.
Change the colour of the border highlight that appears around the box upon hover (which is currently set to black).

I just wanna make it highlight either rgba(0, 149, 143, 1) or rgba(254, 80, 0, 1). And is it possible to increase the thickness of the border highlight?

2.
Convert the date to lowercase (well, Sentence Case to be precise).

3.
Make the number of posts that show = infinite.

I’ve tried setting the post count to 0, hoping that would be the default for infinite, but it actually breaks the element, as you can see on this page. The boxes end up with no padding in between and the top few boxes have reduced in width, whereas the last one has maintained its size.

Here’s the shortcode in question:

[recent_posts count=”0″ no_image=”true” orientation=”vertical” category=”value-of-occupational-therapy”]

Basically, I want them both to look like this, but have the capacity to take on an infinite number of posts.

[Lely]

Hi There,

Thank you for posting in.

1.) Please add this CSS on Settings Tab > Custom CSS

.x-recent-posts a{
    border: 5px solid rgba(0,0,0,0.1);
}
.x-recent-posts a:hover {
    border-color: rgba(0, 149, 143, 1) !important;
}

2.)

.x-recent-posts .x-recent-posts-date {
    text-transform: initial !important;
}

3.) Please check this Recent Posts shortcode options. Maximum number of display is four. To display more, we have to use the OFFSET option. Infinite option is available by default. It is possible via customization but that would be outside the scope of our support.

We can add this CSS to control the space in between those recent post:

.x-recent-posts.vertical a.x-recent-post4 {
    margin-bottom: 2px; /* Adjust this to your preferred spacing*/
}

Hope this helps.

[Smarticle]

Thanks for the code, Lely. That worked great.

However, I didn’t quite understand the issue regarding Recent Posts. I mean, it appears to display an unlimited number of posts if I add ‘0’ to the post count. So why does it become ‘offset’? Also, you went on to say that the ‘infinite’ option IS available by default… which is what I want… so that’s left me a bit confused.

[Rue Nel]

Hello There,

Sorry for the confusion. The count option is responsible for displaying the number of items you want to display. If you use Cornerstone in creating your page, it is only possible to display 1 to 4 items only. On the other hand, if you use the shortcode and tried displaying more than 4 items link this: [recent_posts count="10"], you may display 10 items however the items may not look good because the css support is only for 4 items. To better understand the options available, please see the image below:

Hope this explain it briefly.

[Author]

Posts