Maison > Tutoriel CMS > WordPresse > Tout le processus de création de thème WordPress (7) : création de sidebar.php

Tout le processus de création de thème WordPress (7) : création de sidebar.php

藏色散人
Libérer: 2023-02-21 10:27:34
avant
1709 Les gens l'ont consulté

Je vous ai présenté "L'ensemble du processus de production d'un thème WordPress (6) : Création de footer.php". Cet article continue de vous présenter comment créer sidebar.php ~

Tout le processus de création de thème WordPress (7) : création de sidebar.php

.

C'est fait header.php et footer.php, aujourd'hui nous allons réaliser la barre latérale sidebar.php. Parce que la barre latérale est très personnalisable, le contenu de cette section est difficile et difficile à expliquer pour moi, et certains contenus seront omis !

En tant que barre latérale commune pour chaque page, nous extrayons toujours la barre latérale de index.php et la mettons dans sidebar.php tout comme nous l'avons fait header.php et footer.php. D'accord, créez maintenant un nouveau fichier sidebar.php sous votre répertoire de thème Aurelius, extrayez le code de index.php et mettez-le dans sidebar.php :

<!-- Column 2 / Sidebar -->
<div class="grid_4">
<h3>Catagories</h3>
<ul class="sidebar">
<li><a href="">So who are we?</a></li>
<li><a href="">Philosophy</a></li>
<li><a href="">History</a></li>
<li><a href="">Jobs</a></li>
<li><a href="">Staff</a></li>
<li><a href="">Clients</a></li>
</ul>
<h3>Archives</h3>
<ul class="sidebar">
<li><a href="">January 2010</a></li>
<li><a href="">December 2009</a></li>
<li><a href="">Novemeber 2009</a></li>
<li><a href="">October 2009</a></li>
<li><a href="">September 2009</a></li>
<li><a href="">August 2009</a></li>
</ul>
</div>
<div class="hr grid_12 clearfix"> </div>
Copier après la connexion

Utilisez ensuite un éditeur de texte pour ouvrir index.php, archive.php, page .php et single.php, supprimez le code similaire ci-dessus et remplacez-le par :

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

D'accord, ouvrez maintenant la page d'accueil de votre blog pour voir si le thème que nous avons créé peut toujours fonctionner normalement. À l'heure actuelle, notre barre latérale est encore un code statique. Tout le monde sait peut-être que dans le backend WordPress - Apparence - Widgets, vous pouvez faire glisser les colonnes de votre choix vers la barre latérale, mais notre thème ne prend actuellement pas en charge cette fonction. Maintenant, permettez-moi de créer ensemble la barre latérale complète.

Afin de nous adapter au programme WordPress, nous devons également peaufiner sidebar.php, télécharger la nouvelle feuille de style style.css et remplacer le style.css dans le répertoire Aurelius

Démarrer la production de sidebar.php. Nous allons créer la barre latérale dans la barre latérale. Dans l'état initial, c'est-à-dire lorsque vous ne placez aucun widget dans la barre latérale, les quatre colonnes de haut en bas sont le répertoire des catégories, le dernier article, le nuage de tags et l'archive mensuelle de l'article. Supprimez maintenant tout le code dans sidebar.php et remplacez-le par :

<!-- Column 2 / Sidebar -->
<div class="grid_4">
<?php if ( !function_exists(&#39;dynamic_sidebar&#39;) 
|| !dynamic_sidebar(&#39;First_sidebar&#39;) ) : ?>
<h3>分类目录</h3>
<ul>
<?php wp_list_categories(&#39;depth=1&title_li=&orderby=id&show_count=0&hide_empty=1&child_of=0&#39;); ?>
</ul>
<?php endif; ?>
<?php if ( !function_exists(&#39;dynamic_sidebar&#39;) 
|| !dynamic_sidebar(&#39;Second_sidebar&#39;) ) : ?>
<h3>最新文章</h3>
<ul>
<?php
$posts = get_posts(&#39;numberposts=6&orderby=post_date&#39;);
foreach($posts as $post) {
setup_postdata($post);
echo &#39;<li><a href="&#39; . get_permalink() . &#39;">&#39; . get_the_title() . &#39;</a></li>&#39;;
}
$post = $posts[0];
?>
</ul>
<?php endif; ?>
<?php if ( !function_exists(&#39;dynamic_sidebar&#39;) 
|| !dynamic_sidebar(&#39;Third_sidebar&#39;) ) : ?>
<h3>标签云</h3>
<p><?php wp_tag_cloud(&#39;smallest=8&largest=22&#39;); ?></p>
<?php endif; ?>
<?php if ( !function_exists(&#39;dynamic_sidebar&#39;) 
|| !dynamic_sidebar(&#39;Fourth_sidebar&#39;) ) : ?>
<h3>文章存档</h3>
<ul>
<?php wp_get_archives(&#39;limit=10&#39;); ?>
</ul>
<?php endif; ?>
</div>
<div class="hr grid_12 clearfix"> </div>
Copier après la connexion

Cliquez ensuite ici pour télécharger function.php et placez-le sous le répertoire de thème Aurelius. À ce stade, votre barre latérale peut fonctionner normalement dans le backend WordPress - Apparence. - Les widgets peuvent désormais être glissés normalement vers la barre latérale.

OK, sidebar.php a été créé avec succès. Cette section ne parle pas beaucoup de théorie. La clé est que je ne sais pas comment exprimer ces choses. Même si je le dis, vous ne le comprendrez peut-être pas très bien.

Apprentissage recommandé : "Tutoriel WordPress"

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:ludou.org
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