Explicació detallada del codi de ruta de la plantilla personalitzada per al complement WordPress Shortcodes Ultimate

Alguna vegada us heu preguntat com personalitzar una ruta de plantilla única al connector Shortcodes Ultimate?

No cal envejar a aquests mestres tècnics que estan jugant amb WordPress, perquè ara us portaré a revelar el secret que hi ha darrere!

Vinga, anem directament al punt i fem-ho pas a pas!

Què és el connector Shortcodes Ultimate?

Shortcodes Ultimate és un dels complements més populars de WordPress. Pot implementar fàcilment diverses funcions mitjançant codis curts, com ara la creació de botons, carrusels d'imatges, llistes d'articles, etc.

Encara millor, podem personalitzar la ruta de la plantilla per mostrar el contingut de manera més flexible.

Com afegir un camí de plantilla personalitzat?

Vegem primer el pas més crític: afegir una ruta de plantilla personalitzada.

Aquest és el primer pas cap a una presentació personalitzada!

exemple de codi

al teu tema functions.php Afegiu el codi següent al fitxer o al connector personalitzat:

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

        return $locations;
    },
    10,
    1
);

anàlisi del codi

1. filtre su/shortcode/posts/allowed_template_locations
   Aquest filtre ens permet ampliar els camins de plantilla predeterminats de Shortcodes Ultimate.

2. camí personalitzat /wp-content/custom-templates/
   Emmagatzemem la plantilla /wp-content/custom-templates/ directori perquè no es perdi en actualitzar el connector.

3. 安全 性
   No modifiqueu mai el fitxer de plantilla predeterminat d'un connector directament per evitar perdre contingut personalitzat després d'actualitzar el connector.

Creeu un fitxer de plantilla personalitzat

A continuació, hem de crear el fitxer de plantilla al camí personalitzat.

Per exemple, creem un fitxer anomenat jiawen.php fitxer de plantilla.

Exemple de fitxer de plantilla

在 /wp-content/custom-templates/ directori, crear jiawen.php fitxer i afegiu el codi següent:

<?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>

Descripció del fitxer de plantilla

• $atts['class']: Ens permet personalitzar classes CSS i dissenyar estils únics per a plantilles.
• Títol i miniatura de l'article: Mostra la miniatura i el títol de l'article i enllaça a la pàgina de detalls de l'article.
• 安全 性:usar defined('ABSPATH') || exit; Assegureu-vos que no es pugui accedir directament als fitxers de plantilla.

Després de crear la plantilla, podem trucar-la mitjançant un codi curt en un article o pàgina.

Exemple de codi curt

Afegiu el codi curt següent a la vostra publicació o pàgina:

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

[] s'utilitza al codi curt anterior per evitar que el codi curt de l'article s'escapi en ús real, el símbol [] s'ha de canviar a l'estàndard [].

Descripció del paràmetre de codi curt

1. template="jiawen.php"
   Especifiqueu el nom del fitxer de plantilla personalitzada, el camí és relatiu /wp-content/ de.

2. posts_per_page="10"
10Mostrant 10 articles;
   -1Mostra tots els articles, però no es recomana establir-losil·limitatSi hi ha massa articles, el lloc web pot fallar perquè no pot carregar tots els articles.

3. ignore_sticky_posts="yes"
   Ignora els articles fixats.

4. id="32277,30806"
   Mostra només articles amb l'identificador especificat. Aquí s'especifiquen dos ID d'article, 32277 i 30806. Només es mostraran els articles corresponents a aquests dos ID.

总结

• Camí de plantilla personalitzat: Amplieu el camí predeterminat mitjançant filtres per evitar la pèrdua de plantilles a les actualitzacions de connectors.
• Crea un fitxer de plantilla: Controla el disseny i el contingut de la llista d'articles mitjançant el codi PHP.
• Fitxer de plantilla de trucada: Les trucades flexibles s'aconsegueixen mitjançant paràmetres de codi curt.

La possibilitat de personalitzar els camins de la plantilla millora molt la flexibilitat del complement Shortcodes Ultimate.

D'aquesta manera tenim un control total sobre com es mostra la nostra llista d'articles.

Aquest enfocament és especialment important quan necessitem aconseguir dissenys diversos en pàgines diferents.

Si vols que el teu lloc web de WordPress sigui més personalitzat, prova-ho!