It can be difficult to match your theme’s design for post summaries using just the shortcode and CSS. That’s where template parts come in.
Styling belongs in a theme
Your theme already contains the markup and styling for displaying posts. By leveraging it, the shortcode output can match the styling of your site.
A few years from now when you redesign your site, your shortcodes will automatically use the new post styles defined in that theme.
Markup in Template Partials
I use template partials for post layouts in my themes. Here’s the partials directory in my starter theme.
archive.php as the base layout for a post summary. It’s used on archive pages, and often elsewhere like a related posts section after a single post.
For areas that require a different output, I create a separate partial. In one theme we displayed featured posts in a rotator, so I created
I use the same approach when it comes to styling Display Posts. I might have two post layouts: large and small. I’ll create
dps-small.php to hold the markup. If the large layout matches the archive layout, you can simply include one into the other:
The small layout uses slightly different markup:
I use the “dps” prefix to indicate that these are for Display Posts Shortcode, and to limit which partials can be used by the shortcode.
Specify a layout in the shortcode
I add a “layout” custom parameter to specify which post layout should be used.
The partials are only used if a layout is specified in the shortcode, and a matching partial is found. This lets you keep using the plugin in other contexts as well, like a bulleted list of recent posts.
This also saves me from building custom widgets for Recent Posts. We simply add a text widget containing the shortcode and it matches the site: