Maison > Tutoriel CMS > WordPresse > le corps du texte

Comment publier de longs articles sur WordPress

Libérer: 2019-07-27 15:36:07
original
2939 Les gens l'ont consulté

Comment publier de longs articles sur WordPress

Parfois, une seule page d'article est trop longue, ce qui affectera la vitesse de chargement de la page et l'expérience utilisateur. Dans ce cas, nous devons utiliser WordPress pour afficher de longs articles en pagination. Il existe deux façons d'implémenter la pagination, l'une consiste à utiliser le plug-in de pagination d'articles longs WordPress et l'autre consiste à l'implémenter en modifiant le code.

Étapes pour paginer de longs articles WordPress :

Étape 1 : Accédez au backend du site Web WordPress, recherchez l'option « Modifier » sous Apparence, puis recherchez le module de page d'article. single .php, recherchez le code suivant dans single.php

<?php the_content(); ?>
Copier après la connexion

Étape 2 : Après avoir trouvé le code ci-dessus, ajoutez le code de fonction de fonction de pagination de WordPress en dessous :

<?php wp_link_pages(); ?>
Copier après la connexion

Étape 3 : Le code dans la deuxième étape, vous pouvez obtenir un effet de pagination simple. Si vous souhaitez rendre le bouton de pagination plus beau, vous pouvez remplacer le code de la deuxième étape par le code d'appel suivant :

<?php wp_link_pages(array(&#39;before&#39; => &#39;<div>分页阅读:&#39;, &#39;after&#39; => &#39;&#39;, &#39;next_or_number&#39; => &#39;next&#39;, &#39;previouspagelink&#39; => &#39;上一页&#39;, &#39;nextpagelink&#39; => "")); ?> <?php wp_link_pages(array(&#39;before&#39; => &#39;&#39;, &#39;after&#39; => &#39;&#39;, &#39;next_or_number&#39; => &#39;number&#39;, &#39;link_before&#39; =>&#39;<span>&#39;, &#39;link_after&#39;=>&#39;</span>&#39;)); ?> <?php wp_link_pages(array(&#39;before&#39; => &#39;&#39;, &#39;after&#39; => &#39;</div>&#39;, &#39;next_or_number&#39; => &#39;next&#39;, &#39;previouspagelink&#39; => &#39;&#39;, &#39;nextpagelink&#39; => "下一页")); ?>
Copier après la connexion

via le code CSS suivant pour contrôlez le style d'affichage du bouton de pagination, copiez directement le style CSS suivant dans le fichier style.css, afin que l'effet suivant puisse être obtenu

/**页面分页**/
.fenye{text-align:center;margin:0px auto 10px;font-weight:bold}
.fenye span{background-color:#DDDDDD;color:#fff;font-weight: bold;margin:0px 1px;padding:1px 6px;display:inline-block;text-decoration:none;border:1px solid #e0e0e0;}
.fenye a{text-decoration:none;}
.fenye a span{background-color:#F6F6E8;font-weight: normal;color: #000;text-decoration: none;}
.fenye a:hover span{background-color:#DDDDDD;color: #fff;}
Copier après la connexion

Étape 4 : Insérez le code de pagination là où la pagination est requise dans le article [Doit être inséré en mode texte code]

<p><!--nextpage--></p>
Copier après la connexion

Étape 5 : Si vous trouvez gênant d'utiliser le code de pagination à chaque fois, vous pouvez l'utiliser en ajoutant un "bouton de pagination" au dessus de l'éditeur, c'est-à-dire , si nécessaire dans l'article. Cliquer sur le "Bouton de pagination de page" dans la zone de pagination ajoutera automatiquement le code de pagination. [Cette étape peut être effectuée ou non]

1. Recherchez le fichier /wp-includes/class-wp-editor.php. Recherchez « wp_more », tag : (à la ligne 366)

$mce_buttons = apply_filters(&#39;mce_buttons&#39;, array(&#39;bold&#39;, &#39;italic&#39;, &#39;strikethrough&#39;, &#39;¦&#39;, &#39;bullist&#39;, &#39;numlist&#39;, &#39;blockquote&#39;, &#39;¦&#39;, &#39;justifyleft&#39;, &#39;justifycenter&#39;, &#39;justifyright&#39;, &#39;¦&#39;, &#39;link&#39;, &#39;unlink&#39;, <SPAN style="TEXT-DECORATION: underline"><STRONG><SPAN style="COLOR: #ff0000; TEXT-DECORATION: underline">&#39;wp_more&#39;,</SPAN></STRONG></SPAN> &#39;¦&#39;, &#39;spellchecker&#39;, &#39;fullscreen&#39;, &#39;wp_adv&#39; ), $editor_id);
Copier après la connexion

2. Ajoutez « wp_page » après « wp_more » (y compris les guillemets simples et les virgules). Le code modifié est le suivant :

$mce_buttons = apply_filters(&#39;mce_buttons&#39;, array(&#39;bold&#39;, &#39;italic&#39;, &#39;strikethrough&#39;, &#39;¦&#39;, &#39;bullist&#39;, &#39;numlist&#39;, &#39;blockquote&#39;, &#39;¦&#39;, &#39;justifyleft&#39;, &#39;justifycenter&#39;, &#39;justifyright&#39;, &#39;¦&#39;, &#39;link&#39;, &#39;unlink&#39;, <SPAN style="TEXT-DECORATION: underline"><STRONG><SPAN style="COLOR: #ff0000; TEXT-DECORATION: underline">&#39;wp_more&#39;,&#39;wp_page&#39;,</SPAN></STRONG></SPAN> &#39;¦&#39;, &#39;spellchecker&#39;, &#39;fullscreen&#39;, &#39;wp_adv&#39; ), $editor_id);
Copier après la connexion

3. À ce moment, vous pouvez voir une icône similaire au bouton de balise plus sur l'éditeur de texte en arrière-plan pour écrire et éditer les pages d'articles.

De même, un bouton page suivante apparaîtra dans l'éditeur de code.

Étape 6 : Éliminez le problème selon lequel les articles sur différentes pages ont le même titre après classification pour éviter d'affecter l'optimisation du référencement du site Web. Recherchez le code similaire à ... dans le fichier de modèle de thème header.php et remplacez-le par le code suivant.

<?php if ( is_single() ) { ?><title><?php echo trim(wp_title(&#39;&#39;,0)); ?><?php if (get_query_var(&#39;page&#39;)) { echo &#39;-第&#39;; echo get_query_var(&#39;page&#39;); echo &#39;页&#39;;}?> — <?php bloginfo(&#39;name&#39;); ?></title><?php } ?>
Copier après la connexion

Étape 7 : Une fois la fonction de pagination implémentée, les articles de la page de flux seront paginés. Généralement, seul le contenu de la première page sera affiché. Solution : Ouvrez le fichier query.php dans le fichier. wp-includes répertoire et recherchez la ligne de code suivante (environ la ligne 3578)

if ( strpos( $content,&#39;<!–nextpage–>&#39; ) ) {
Copier après la connexion

Modifiez-la avec la ligne de code suivante.

if ( strpos( $content, &#39;<!--nextpage-->&#39; ) && (!is_feed()) ) {
Copier après la connexion

De cette façon, nous avons complété l'effet de lecture paginée parfait des longs articles.

Pour plus d'articles techniques liés à WordPress, veuillez visiter la colonne tutoriel WordPress pour apprendre !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal