Display Posts Shortcode

The Display Posts Shortcode allows users to easily display listings of posts.

If you are using the Block Editor the Query Loop Block will do much of this, in a more visual way.

Add the shortcode in a post or page, and use the arguments to select based on tag, category, post type, and many other possibilities.

There are also some extra options to display something more than just the title: include_date, include_excerpt, and image_size.

You can also display the list in a Text Widget. See Embed Codes in widgets for details and examples.

For example [display-posts category ="news" ] will give you this:

display-posts-plugin

This technique is extremely powerful but can get tricky if you are trying for more advanced methods. The display-posts-shortcode Wiki on GitHub gives more details.

More Examples

[display-posts post_type="page" post_parent="743"]

Will show pages whose parent has the id of 743. This is the plugin page on this site.

A way to find out the id of a page: In the Post or pages list, hover over the post title and the id is in the link shown in your status bar:

Screenshot explaining how to get the id of a page from the page list.

Here we include an excerpt and the date and limit the number of posts to three.

[display-posts category ="releases" include_excerpt="true" include_date="true" posts_per_page="3"]

Glow Blogs Update October 2026 (10/14/2026) - There has been a new release on Glow Blogs, dealing with some issues, updating themes and plugins.
Glow Blogs Update 27 Aug 2026 (8/27/2026) - There has been a new release on Glow Blogs, making some changes, dealing with some issues and updating themes and plugins.
Glow Blogs Update July 2026 (7/9/2026) - There has been a new release on Glow Blogs, dealing with some issues and updating themes and plugins. Event Organiser A security issue has developed with this plugin. We have temporarily patched(fixed) the problem for sites already using the plugin. We have also prevented the plugin from being installed on sites. If you remove the … Continue reading Glow Blogs Update July 2026 →

And here we don’t have a list but put each post in a div.

[display-posts category="issues-news-2" include_excerpt="true" wrapper="div" posts_per_page="3"]

Advice – Changing Privacy Levels - There can be a problem with changing privacy levels on a site with a lot of media (photos, video, audio etc.). We are planning a change to Glow Blogs to prevent this. In the meantime we have some advice around changing site privacy. The problem only affects sites with a lot of media. When you … Continue reading →

H5P Interactive Video Problems with YouTube Videos - There are two problem with some H5P interactive videos. Both are the result of changes in YouTube behaviour. This post provides a fix to one and a workaround to the other.

Glow Blogs Twitter Changes - Twitter/X keeps changing the goal posts for integration with other systems. Recently they have stripped out most of the functionality for free third party use.

More Advanced Examples

We can cange the appearance by using some custom css. You can activate the editing of CSS in the Dashboard-> Settings -> General. More information on our CSS page.

[display-posts category="news" include_excerpt="true" excerpt_length="20" wrapper="div" posts_per_page="3" wrapper_class="examplecss"]

Glow Blogs Update October 2026 - There has been a new release on Glow Blogs, dealing with some issues, updating themes and plugins. … Continue reading →

Advice – Changing Privacy Levels - There can be a problem with changing privacy levels on a site with a lot of media (photos, video, audio… … Continue reading →

H5P Interactive Video Problems with YouTube Videos - There are two problem with some H5P interactive videos. Both are the result of changes in YouTube behaviour. This post… … Continue reading →

CSS


/* for display posts shortcode page */
.page-id-1403 .examplecss .listing-item {
    width: 30%;
    float: left;
    padding: 3px;
}

.page-id-1403 .examplecss a.title {
    display: block;
    width: 100%;
    font-weight: bold;
    text-decoration: none;
    background: lightyellow;
    border: solid 1px #ccc;
}

.page-id-1403 .examplecss .excerpt-dash {
    display: none;
}

Featured Images

If your posts use featured images you can use them too. Here is an screenshot example from the Blogging Bootcamp #2 blog.

This uses:

[display-posts category="announcement" wrapper="div" wrapper_class="ann-grid-layout" image_size="thumbnail" order="ASC"]

And this CSS:

.page-id-632 div.listing-item {
float: left;
width: 150px;
margin: 3px;
border: solid 1px #eee;
padding: 3px;
}

.page-id-632 .ann-grid-layout {
width: 500px;
}