Hide recent posts via show more link

Support
#1

Hi,

I have added “recent posts” from the some category as text links on the widget:

Unsere Reiseberichte aus den USA[gap size=“5px”][recent_posts count=“100” category=“usa” no_image=“true” orientation=“vertical”]

Because the list is very long I´m searching for a possibility to show only 20 items and the rest via a link “show more”.
Is there a way to do this via CSS?

I like to have 100 links in the source code for SEO reasons but show only 20 links on the page.

Merry Christmas

#2

Hi there,

Thanks for posting in.

That’s not possible with CSS, and the recommended count is 4 only. I recommend using Essential Grid or The grid plugin if you wish to display many items with pagination. Those are bundled plugin which you can install in X/Pro overview page.


Thanks!

#3

What is the difference to use Essential Grid or The grid instead of [recent_posts count=“100” category=“usa” no_image=“true” orientation=“vertical”]?

#4

Hey @michaelxxx,

The max count value of Recent Post is only up to 4. To display 100 posts, you need to setup 25 Recent Post shortcodes with the offset attribute set for each shortcode.

That would be tedious to do so it would be best to use one of the grid plugins. Another advantage is you have more layout options.

Thanks.

#5

I use [recent_posts count=“100” category=“usa” no_image=“true” orientation=“vertical”] on the sidebar and as you can see it displays more that 4 posts…

#6

Hi there,

There is a dirty way to have 20 items shown instead of 100 in CSS. You can add the code below to X > Launch > Options > CSS:

.x-sidebar .widget a.x-recent-post100 {
    display: none;
}

.x-sidebar .widget a.x-recent-post100:nth-child(1),
.x-sidebar .widget a.x-recent-post100:nth-child(2),
.x-sidebar .widget a.x-recent-post100:nth-child(3),
.x-sidebar .widget a.x-recent-post100:nth-child(4),
.x-sidebar .widget a.x-recent-post100:nth-child(5),
.x-sidebar .widget a.x-recent-post100:nth-child(6),
.x-sidebar .widget a.x-recent-post100:nth-child(7),
.x-sidebar .widget a.x-recent-post100:nth-child(8),
.x-sidebar .widget a.x-recent-post100:nth-child(9),
.x-sidebar .widget a.x-recent-post100:nth-child(10),
.x-sidebar .widget a.x-recent-post100:nth-child(11),
.x-sidebar .widget a.x-recent-post100:nth-child(12),
.x-sidebar .widget a.x-recent-post100:nth-child(13),
.x-sidebar .widget a.x-recent-post100:nth-child(14),
.x-sidebar .widget a.x-recent-post100:nth-child(15),
.x-sidebar .widget a.x-recent-post100:nth-child(16),
.x-sidebar .widget a.x-recent-post100:nth-child(17),
.x-sidebar .widget a.x-recent-post100:nth-child(18),
.x-sidebar .widget a.x-recent-post100:nth-child(19),
.x-sidebar .widget a.x-recent-post100:nth-child(20){
    display: block;
}

Hope it helps.

#7

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