Der gesamte Prozess der WordPress-Theme-Erstellung (8): Erstellen von index.php

Ich habe Ihnen „Der gesamte Prozess der WordPress-Theme-Erstellung (7): Sidebar.php erstellen“ vorgestellt. In diesem Artikel erfahren Sie, wie Sie index.php erstellen.~

Wir haben es bereits getan. Alle öffentlichen Seiten sidebar.php, footer.php und header.php wurden für den Blog erstellt. Ab heute werden wir separate Seiten erstellen. Was wir nun erstellen möchten, ist die Indexseite index.php. Hier können wir sie vorübergehend als Startseite verstehen, aber tatsächlich ist sie nicht so einfach wie die Startseite.

Die Hauptseite der Homepage ist die Artikelliste, die die Artikel in Ihrem Blog einzeln auflistet. Sie haben vielleicht bemerkt, dass der Stil jedes Artikels auf der Homepage gleich ist, aber die Textinhalte wie Titel, Zeit, Autor und Zusammenfassung sind unterschiedlich, nicht wahr? Wir benötigen nur den HTML-Code eines Artikels, um index.php zu erstellen. Wir müssen den HTML-Code nicht so vieler Artikel manuell schreiben. Wir benötigen nur eine Schleife, um alle Artikel auf der Homepage anzuzeigen. Eine Schleife besteht darin, wiederholt Artikel auszugeben. Wenn Sie zuvor eine Computerprogrammiersprache gelernt haben, ist es nicht schwer zu verstehen, was eine Schleife ist, und die Funktionen einer Schleife sind leicht zu verstehen, wie zum Beispiel while, for, foreach ...

Fügen Sie hier einen Satz ein: If Wenn Sie wirklich wissen möchten, wie man ein Thema erstellt, öffnen Sie bitte den Texteditor, folgen Sie mir Schritt für Schritt und ändern Sie es Schritt für Schritt. Aktualisieren Sie Ihr Blog jedes Mal, wenn Sie eine Änderung vornehmen, um zu sehen, welche Änderungen vorhanden sind Vertiefen Sie Ihr Wissen. Wenn Sie zu faul dazu sind, empfehle ich Ihnen, den folgenden Inhalt nicht zu lesen, da er Ihnen nicht viel weiterhilft.

Jetzt beginnen Sie mit der Erstellung von index.php. Zunächst gibt es drei Artikel in index.php. Wenn Sie index.php öffnen, können Sie die drei Tags des Artikels sehen: . Belassen Sie einen Artikel und entfernen Sie die Zusammenfassung des Artikels. Der geänderte Code lautet wie folgt:

<?php get_header(); ?>
	<!-- Column 1 /Content -->
	<div class="grid_8">
		<!-- Blog Post -->
		<div class="post">
			<!-- Post Title -->
			<h3 class="title"><a href="single.html">Loreum ipsium massa cras phasellus</a></h3>
			<!-- Post Data -->
			<p class="sub"><a href="#">News</a>, <a href="#">Products</a> • 31st Sep, 09 • <a href="#">1 Comment</a></p>
			<div class="hr dotted clearfix"> </div>
			<!-- Post Image -->
			<img class="thumb" alt="" src="<?php bloginfo(&#39;template_url&#39;); ?>/images/610x150.gif" />
			<!-- Post Content -->
			
			<!-- Read More Button -->
			<p class="clearfix"><a href="single.html" class="button right"> Read More...</a></p>
		</div>
		<div class="hr clearfix"> </div>
		
		<!-- Blog Navigation -->
		<p class="clearfix"> <a href="#" class="button float"><< Previous Posts</a> <a href="#" class="button float right">Newer Posts >></a> </p>
	</div>
	<?php get_sidebar(); ?><?php get_footer(); ?>

Wie Sie dem obigen Code entnehmen können, lautet das HTML-Skelett eines Artikels:

<div class="post">
	<!-- Post Title -->
	<h3 class="title"><a href="single.html">文章标题</a></h3>
	<!-- Post Data -->
	<p class="sub"><a href="#">标签1</a>, <a href="#">标签12</a> • 发布时间 • <a href="#">评论数</a></p>
	<div class="hr dotted clearfix"> </div>
	<!-- Post Image 文章的缩略图 -->
	<img class="thumb" alt="" src="<?php bloginfo(&#39;template_url&#39;); ?>/images/610x150.gif" />
	<!-- Post Content -->
	文章内容
	<!-- Read More Button -->
	<p class="clearfix"><a href="single.html" class="button right"> 阅读全文按钮</a></p>
</div>
<div class="hr clearfix"> </div>

Das HTML-Skelett von Artikeln zu verschiedenen Themen ist unterschiedlich. Wenn Sie mit HTML vertraut sind, können Sie es schnell identifizieren Das Artikelskelett. Das Obige ist das Skelett unseres Themas, basierend auf:

1 Fügen Sie den Artikeltitel hinzu:

<h3 class="title"><a href="single.html">Loreum ipsium massa cras phasellus</a></h3>

<h3 class="title"><a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a></h3>

Hier sind die Erklärungen zu diesen PHP-Funktionen:

Geben Sie den URL-Link des Artikels aus

des Artikels

• 2. Artikel-Tags hinzufügen

Viele von uns fügen beim Schreiben von Artikeln gerne einige Tags hinzu, und wir haben auch eine „Tag-Wolke“ zur Seitenleiste hinzugefügt. Gefunden:

<a href="#">News</a>, <a href="#">Products</a>

geändert in:

<?php the_tags(&#39;标签：&#39;, &#39;, &#39;, &#39;&#39;); ?>

Funktionsreferenz: the_tags

3. Hinzugefügtes Datum

Gefunden: 31. September 09 geändert in:

<?php the_time(&#39;Y年n月j日&#39;) ?>

Funktionsreferenz: the_time

Was das von Y n j in dieser Funktion erhaltene Datumsformat betrifft, können Sie sich auf das Dokument (Chinesisch) beziehen und das gewünschte Zeitformat auswählen: zh-cn: Benutzerdefinierte Uhrzeit und Datum

Vielleicht haben Sie die bereitgestellten Zeit- und Datumsdokumente gelesen oben, immer noch verwirrt, hier sind ein paar Beispiele, Sie können dem Beispiel fast folgen und das gewünschte Zeit- und Datumsformat angeben:

PHP-CodeAusgabeinhalt1999-05-01 99-05-01 02 :09:08

	4、显示评论数 现在我们来添加评论数代码，查找代码： <a href="#">1 Comment</a> 改成： <?php comments_popup_link(&#39;0 条评论&#39;, &#39;1 条评论&#39;, &#39;% 条评论&#39;, &#39;&#39;, &#39;评论已关闭&#39;); ?> 该函数会根据文章的评论数量显示不同的文字链接，0 条评论、1 条评论等等，当然能你可以根据自己的爱好定制文字内容。该链接会直接打开对应的文章，并移动到文章的评论区. 函数参考：comments_popup_link 5、添加编辑按钮 如果文章作者已登录，我们将允许他在首页点击对应文章的编辑按钮，就可以直接修改文章，这个功能是可选的，你可以不添加。接上面的评论按钮，我们在其后面添加相应代码： <?php comments_popup_link(&#39;0 条评论&#39;, &#39;1 条评论&#39;, &#39;% 条评论&#39;, &#39;&#39;, &#39;评论已关闭&#39;); ?> 函数参考：edit_post_link 6、添加文章内容 可能有些人喜欢在首页输出全文，而有些人喜欢在首页输出文章摘要，这里提供两种方案，任君选择。查找： 将其改成： <!-- Post Content --> <?php the_excerpt(); ?> 只要在写文章的时候在"摘要"框内填写摘要，在首页显示的就是摘要，如果不填就输出全文！以下是方案二，用于输出全文，除非你在文章中使用了，代码修改： <!-- Post Content --> <?php the_content(&#39;阅读全文...&#39;); ?> 函数参考: the_excerpt the_content 7、阅读全文 这里给添加阅读全文链接，如果在6、添加文章内容中你选择了输出全文，本步骤可以忽略，查找代码： <a href="single.html" class="button right"> Read More...</a> 改成： <a href="<?php the_permalink(); ?>" class="button right">阅读全文</a> 8、添加文章循环 到目前为止，你的首页还只能显示一篇文章，要想输出所有文章，需要我们之前提到的循环。查找代码： 改成： <!-- Blog Post --><?php if (have_posts()) : while (have_posts()) : the_post(); ?> 再查找： <div class="hr clearfix"> </div> 改成： <div class="hr clearfix"> </div> 再次查找： </div><?php get_sidebar(); ?> 改成： <?php else : ?> <h3 class="title"><a href="#" rel="bookmark">未找到</a></h3> <p>没有找到任何文章！</p> <?php endif; ?> </div> <?php get_sidebar(); ?> 好了，现在查看你的主页，是不是可以显示多篇文章了呢？文章数量取决于你在后台设置每页可显示的文章数量。以上的循环可以简化为以下内容，这样看起来应该比较容易理解了，在endwhile之前不断地输出每篇文章，直至文章数量达到每页显示的最大文章数量；如果你的博客上一篇文章都没有，就会输入无文章提示。 <?php if (have_posts()) : while (have_posts()) : the_post(); ?> 文章html骨架 <?php endwhile; ?> <?php else : ?> 输出找不到文章提示 <?php endif; ?> 9、添加文章分页 上面你已经看到，每页只能显示部分文章，要想看下一页，就得添加分页。现在查找代码： <p class="clearfix"> <a href="#" class="button float"><< Previous Posts</a> <a href="#" class="button float right">Newer Posts >></a> </p> 改成： <p class="clearfix"><?php previous_posts_link(&#39;<< 查看新文章&#39;, 0); ?> <span class="float right"><?php next_posts_link(&#39;查看旧文章 >>&#39;, 0); ?></span></p> 参考函数： previous_posts_link next_posts_link 10、文章缩略图 对于大部分人来说，不太需要文章缩略图的功能，而且有很多插件可以实现这个功能。这里我们将首页的文章缩略图代码删除： <!-- Post Image --><img class="thumb" alt="" src="<?php bloginfo(&#39;template_url&#39;); ?>/images/610x150.gif" /> 另外，还有个存档页面的模板archive.php，跟index.php的制作过程完全一样，只不过需要在functions.php里添加一个函数，这里就不再罗嗦，下载自己看吧，注意：functions.php中的代码已经修改，要想让你的分类、标签等存档页能够正常显示，请下载最新的functions.php覆盖原来的。另外，标签页和分类页支持在该页面顶部显示介绍，前提是你在后台文章标签和分类处要填上了描述。 好了，到目前这个主题也像个样子了，不过还有很多要完善，后面我们将继续完善！ 推荐学习：《WordPress教程》 Das obige ist der detaillierte Inhalt vonDer gesamte Prozess der WordPress-Theme-Erstellung (8): Erstellen von index.php. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website! Erklärung dieser Website Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn Heiße KI -Werkzeuge Undresser.AI Undress KI-gestützte App zum Erstellen realistischer Aktfotos AI Clothes Remover Online-KI-Tool zum Entfernen von Kleidung aus Fotos. Undress AI Tool Ausziehbilder kostenlos Clothoff.io KI-Kleiderentferner AI Hentai Generator Erstellen Sie kostenlos Ai Hentai. Mehr anzeigen Heißer Artikel R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall) 3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌 R.E.P.O. Beste grafische Einstellungen 3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌 Assassin's Creed Shadows: Seashell Riddle -Lösung 1 Wochen vor By DDD R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können 3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌 WWE 2K25: Wie man alles in Myrise freischaltet 3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌 Mehr anzeigen Heiße Werkzeuge Notepad++7.3.1 Einfach zu bedienender und kostenloser Code-Editor SublimeText3 chinesische Version Chinesische Version, sehr einfach zu bedienen Senden Sie Studio 13.0.1 Leistungsstarke integrierte PHP-Entwicklungsumgebung Dreamweaver CS6 Visuelle Webentwicklungstools SublimeText3 Mac-Version Codebearbeitungssoftware auf Gottesniveau (SublimeText3) Mehr anzeigen Heiße Themen Wo ist der Login-Zugang für Gmail-E-Mail? 7450 15 CakePHP-Tutorial 1374 52 Wie lautet das Format des Kontonamens von Steam? 77 11 Win11 -Aktivierungsschlüssel dauerhaft 40 19 NYT -Verbindungen Hinweise und Antworten 14 7 Mehr anzeigen Related knowledge PHP vs. Flutter: Die beste Wahl für die mobile Entwicklung May 06, 2024 pm 10:45 PM PHP und Flutter sind beliebte Technologien für die mobile Entwicklung. Flutter zeichnet sich durch plattformübergreifende Funktionen, Leistung und Benutzeroberfläche aus und eignet sich für Anwendungen, die eine hohe Leistung, plattformübergreifende und benutzerdefinierte Benutzeroberfläche erfordern. PHP eignet sich für serverseitige Anwendungen mit geringerer Leistung und nicht plattformübergreifend. So ändern Sie die Seitenbreite in WordPress Apr 16, 2024 am 01:03 AM Sie können die Breite Ihrer WordPress-Seite ganz einfach ändern, indem Sie Ihre style.css-Datei bearbeiten: Bearbeiten Sie Ihre style.css-Datei und fügen Sie .site-content { max-width: [Ihre bevorzugte Breite] hinzu. Bearbeiten Sie [Ihre bevorzugte Breite], um die Seitenbreite festzulegen. Änderungen speichern und Cache leeren (optional). So erstellen Sie eine Produktseite in WordPress Apr 16, 2024 am 12:39 AM Erstellen Sie eine Produktseite in WordPress: 1. Erstellen Sie das Produkt (Name, Beschreibung, Bilder); 2. Passen Sie die Seitenvorlage an (fügen Sie Titel, Beschreibung, Bilder, Schaltflächen hinzu). 3. Geben Sie Produktinformationen ein (Lagerbestand, Größe, Gewicht); 4. Variationen erstellen (verschiedene Farben, Größen); 6. Kommentare aktivieren/deaktivieren; In welchem ​​Ordner liegen WordPress-Artikel? Apr 16, 2024 am 10:29 AM WordPress-Beiträge werden im Ordner /wp-content/uploads gespeichert. Dieser Ordner verwendet Unterordner, um verschiedene Arten von Uploads zu kategorisieren, einschließlich Artikeln, die nach Jahr, Monat und Artikel-ID geordnet sind. Artikeldateien werden im Nur-Text-Format (.txt) gespeichert und der Dateiname enthält normalerweise seine ID und seinen Titel. Wo ist die WordPress-Vorlagendatei? Apr 16, 2024 am 11:00 AM WordPress-Vorlagendateien befinden sich im Verzeichnis /wp-content/themes/[Themenname]/. Sie werden verwendet, um das Erscheinungsbild und die Funktionalität der Website zu bestimmen, einschließlich Kopfzeile (header.php), Fußzeile (footer.php), Hauptvorlage (index.php), einzelner Artikel (single.php), Seite (page.php). , Archiv (archive.php), Kategorie (category.php), Tag (tag.php), Suche (search.php) und 404-Fehlerseite (404.php). Durch Bearbeiten und Modifizieren dieser Dateien können Sie das Erscheinungsbild Ihrer WordPress-Website anpassen So suchen Sie nach Autoren in WordPress Apr 16, 2024 am 01:18 AM Suchen Sie nach Autoren in WordPress: 1. Sobald Sie sich in Ihrem Admin-Bereich angemeldet haben, navigieren Sie zu „Beiträge“ oder „Seiten“, geben Sie den Namen des Autors über die Suchleiste ein und wählen Sie „Autor“ in den Filtern aus. 2. Weitere Tipps: Verwenden Sie Platzhalter, um Ihre Suche zu erweitern, verwenden Sie Operatoren, um Kriterien zu kombinieren, oder geben Sie Autoren-IDs ein, um nach Artikeln zu suchen. Welche WordPress-Version ist stabil? Apr 16, 2024 am 10:54 AM Die stabilste WordPress-Version ist die neueste Version, da sie die neuesten Sicherheitspatches und Leistungsverbesserungen enthält und neue Funktionen und Verbesserungen einführt. Um auf die neueste Version zu aktualisieren, melden Sie sich bei Ihrem WordPress-Dashboard an, gehen Sie zur Seite „Updates“ und klicken Sie auf „Jetzt aktualisieren“. Welche Sprache wird zur Entwicklung von WordPress verwendet? Apr 16, 2024 am 12:03 AM WordPress wird unter Verwendung der PHP-Sprache als Kernprogrammiersprache für die Handhabung von Datenbankinteraktionen, Formularverarbeitung, dynamischer Inhaltsgenerierung und Benutzeranfragen entwickelt. PHP wurde aus Gründen wie plattformübergreifender Kompatibilität, einfacher Erlernbarkeit, aktiver Community sowie umfangreicher Bibliothek und Frameworks ausgewählt. Neben PHP verwendet WordPress auch Sprachen wie HTML, CSS, JavaScript, SQL usw., um seine Funktionalität zu erweitern. See all articles Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！ Über uns Haftungsausschluss Sitemap © php.cn All rights reserved