Detailed explanation of the custom template path code of the WordPress Shortcodes Ultimate plugin

Have you ever wondered how to customize a unique template path in the Shortcodes Ultimate plugin?

There is no need to envy those technical experts who are good at WordPress, because now I will show you the secrets behind it!

Come on, let’s get straight to the point and get it done step by step!

What is Shortcodes Ultimate plugin?

Shortcodes Ultimate is one of the most popular plugins in WordPress. It can easily achieve various functions through shortcodes, such as creating buttons, image carousels, article lists, etc.

Even better, we can customize the template path to display content more flexibly.

How to add custom template path?

Let's first look at the most critical step - adding a custom template path.

This is the first step towards a personalized display!

Code example

In your theme functions.php Add the following code to your file or custom plugin:

add_filter(
    'su/shortcode/posts/allowed_template_locations',
    function( $locations ) {
        // 添加自定义模板路径 /wp-content/custom-templates/
        $locations[] = WP_CONTENT_DIR . '/custom-templates';

        return $locations;
    },
    10,
    1
);

Parsing code

1. filter su/shortcode/posts/allowed_template_locations
   This filter allows us to extend the default template path of Shortcodes Ultimate.

2. Custom Path /wp-content/custom-templates/
   We store the template in /wp-content/custom-templates/ directory so that they are not lost when the plugin is updated.

3. Safety
   Never modify the default template files of a plugin directly to avoid losing your customizations after the plugin is updated.

Creating a custom template file

Next, we need to create the template file in the custom path.

For example, we create a jiawen.php Template file for .

Template file example

On /wp-content/custom-templates/ In the directory, create jiawen.php file and add the following code:

<?php defined( 'ABSPATH' ) || exit; ?>
<div class="su-posts su-posts-teaser-loop <?php echo esc_attr( $atts['class'] ); ?>">

    <?php if ( $posts->have_posts() ) : ?>
        <?php while ( $posts->have_posts() ) : ?>
            <?php $posts->the_post(); ?>

            <?php if ( ! su_current_user_can_read_post( get_the_ID() ) ) : ?>
                <?php continue; ?>
            <?php endif; ?>

            <div id="su-post-<?php the_ID(); ?>" class="su-post <?php echo esc_attr( $atts['class_single'] ); ?>">
                <?php if ( has_post_thumbnail() ) : ?>
                    <a target="_blank" rel="nofollow" class="su-post-thumbnail" href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a>
                <?php endif; ?>
                <div class="su-post-title">
                    <a target="_blank" href="<?php the_permalink(); ?>">🔗<?php the_title(); ?></a>
                </div>
            </div>

        <?php endwhile; ?>
    <?php else : ?>

        <p class="su-posts-not-found"><?php esc_html_e( 'Posts not found', 'shortcodes-ultimate' ); ?></p>

    <?php endif; ?>
</div>

Template file description

• $atts['class']: Allows us to customize CSS classes to design unique styles for the template.
• Article thumbnail and title: Displays the article thumbnail and title, and links to the article details page.
• Safety:use defined('ABSPATH') || exit; Make sure template files cannot be accessed directly.

After creating the template, we can call it through the shortcode in the article or page.

Shortcode Examples

Add the following shortcode to your post or page:

【su_posts template="jiawen.php" posts_per_page="10" ignore_sticky_posts="yes" id="32277,30806"】

The above shortcode uses [] to avoid the shortcode being escaped in the article. When actually using it, the symbol [] needs to be changed to standard [].

Shortcode parameter description

1. template="jiawen.php"
   Specifies the name of the custom template file. The path is relative to /wp-content/ of.

2. posts_per_page="10"
10Showing 10 articles;
   -1Display all articles, but it is not recommended to setunlimitedIf there are too many articles, the website may crash because it cannot load all the articles.

3. ignore_sticky_posts="yes"
   Ignore pinned posts.

4. id="32277,30806"
   Only show articles with the specified ID. Here two article IDs are specified, 32277 and 30806. Only articles corresponding to these two IDs will be shown.

Final Thoughts

• Custom template path: Extend the default path through filters to avoid losing templates when plugins are updated.
• Create template file: Control the layout and content of the article list through PHP code.
• Calling template file: Flexible calling is achieved through shortcode parameters.

The ability to customize template paths greatly enhances the flexibility of the Shortcodes Ultimate plugin.

This way we have full control over how the article list is displayed.

This approach is particularly important when we need to implement diverse designs in different pages.

If you want to make your WordPress website more personalized, try it now!