![\"html-wordpress](\"https:\/\/blogging-techies.com\/wp-content\/uploads\/2021\/10\/1634828047_221_Introduccion-a-la-anatomia-de-un-tema-de-WordPress.png\")
<\/p>\nEtikett. Sie k\u00f6nnen beispielsweise den body() Ihrer Website in mehrere Abschnitte unterteilen, z. B. Navigation, Kopfzeile, Hauptinhalt, Seitenleiste und Fu\u00dfzeile.\n<\/p>\n
Sobald Sie Ihre Webseite in Abschnitte unterteilt haben, k\u00f6nnen Sie die Abschnitte mithilfe von CSS nach Ihren W\u00fcnschen anordnen (oder organisieren). Dieser Vorgang wird als Styling bezeichnet und beinhaltet das Hinzuf\u00fcgen weiterer Styling-Elemente wie Farbe, Gr\u00f6\u00dfe, R\u00e4nder, Spezialeffekte usw. Das ist die Leistungsf\u00e4higkeit von CSS, was \u00fcbrigens die Abk\u00fcrzung f\u00fcr Cascading Style Sheets ist. Wenn Sie Ihre HTML- und CSS-Dateien zusammenf\u00fcgen und ein paar Bilder hinzuf\u00fcgen, erhalten Sie am Ende eine vollst\u00e4ndige Website.<\/p>\n
Bei WordPress-Themes ist es nicht viel anders. Wie wir in Teil 1 von \u201eSo erstellen Sie ein WordPress-Theme aus HTML\u201c gesehen haben, sind WordPress-Themes in verschiedene Dateien unterteilt. Wenn Sie an dieser Stelle keine \u00c4hnlichkeiten feststellen k\u00f6nnen, lassen Sie es mich erkl\u00e4ren.<\/p>\n
Statische HTML-Webseiten werden mithilfe von in Abschnitte unterteilt (die wir oben als Abschnitte bezeichnet haben). <\/p>\n
Etiketten (oder Tabellen, wenn Sie wirklich altmodisch sind). Andererseits werden WordPress-Themes in verschiedene PHP-Dateien aufgeteilt, die dann mithilfe von Template-Tags wieder zusammengef\u00fcgt werden.<\/p>\n
Anstatt also alle K\u00f6rperelemente (Kopfzeile, Hauptinhalt, Seitenleiste, Fu\u00dfzeile usw.) in einer einzigen Datei zu haben (wie es bei statischem HTML der Fall ist), ist jedes K\u00f6rperelement (in WordPress-Themes) darin enthalten separate Dateien.<\/p>\n
Der Header wird also in header.php leben, die Seitenleiste wird den Anfang in sidebar.php finden, der Hauptinhalt wird in index.php oder single.php (wenn es ein Beitrag ist) oder page.php (wenn es eine Seite ist) leben. . ). Der Fu\u00dfzeilenbereich befindet sich in footer.php und so weiter.<\/p>\n
Folgst du? Schauen Sie sich die folgende Abbildung an:<\/p>\n
<\/p>\n
Aus unserer vorherigen Abbildung werden , und als Template-Tags bezeichnet. Seine Aufgabe besteht darin, header.php, sidebar.php und footer.php in dieser Reihenfolge aus Ihrem Theme-Verzeichnis abzurufen und den Inhalt in Ihrer index.php anzuzeigen und so die Webseite zu vervollst\u00e4ndigen.<\/p>\n
Lass ihn nicht .php<\/strong> Es macht Ihnen Angst, der Inhalt in PHP-Dateien ist nur HTML-Code, mit dem Sie vertraut sind. Beispielsweise kann Ihre header.php eine typische HTML-Listennavigation enthalten. Ebenso k\u00f6nnen Sie typischen HTML-Code in footer.php, sidebar.php und index.php einf\u00fcgen.<\/p>\n Sie k\u00f6nnen das auch platzieren loop.php<\/strong> in Ihrer index.php (oder wo auch immer Sie m\u00f6chten) ein, um Ihre Blog-Beitr\u00e4ge anzuzeigen, aber Sie sollten langsamer werden und zur Anatomie der WordPress-Themes zur\u00fcckkehren. Ich habe in Teil 2, wie man ein WordPress-Theme aus HTML erstellt, ein oder zwei Dinge \u00fcber die Schleife erw\u00e4hnt. und wir werden in Zukunft dar\u00fcber (die Schleife) und andere Funktionen sprechen.<\/p>\n Nach vorne\u2026<\/p>\n Ein grundlegendes WordPress-Theme besteht aus mindestens vier Vorlagendateien, n\u00e4mlich:<\/p>\n Mal sehen, was jedes davon beinhaltet magisch<\/strong> Dateien:<\/p>\n Dies ist die Hauptdatei, ohne die Sie kein funktionierendes WordPress-Theme haben. Es ist die erste (oder Standard-)Datei, die geladen wird, wenn Sie eine WordPress-Website besuchen. Betrachten Sie es als das \u00c4quivalent von index.html.<\/p>\n Eine typische index.php in WordPress-Themes sieht so aus:<\/p>\n Sie k\u00f6nnen die Schleife zwischen und hinzuf\u00fcgen, um Blog-Beitr\u00e4ge auf der Startseite (index.php) anzuzeigen, wie unten gezeigt:<\/p>\n Diese Vorlagendateien enthalten Ihren Header-Code, die Navigation und den HTML-Header-Code. Grunds\u00e4tzlich speichert header.php alles, was Sie oben auf Ihrer Website anzeigen m\u00f6chten. Wissen Sie, Dinge wie der Titel Ihrer Website und solche Dinge.<\/p>\n Es verlinkt auch auf Ihr CSS-Stylesheet in header.php. Hier ist ein einfaches Beispiel f\u00fcr header.php:<\/p>\n This is header section. Put your logo and other details here.<\/p>\n<\/pre>\n Sidebar.php enth\u00e4lt alles, was Sie brauchen, um in Ihren Seitenleisten zu erscheinen. Die Seitenleiste enth\u00e4lt zus\u00e4tzliche Men\u00fcs, Widgets, Kategorien, Social-Media-Symbole, benutzerdefinierte Inhalte, HTML-Code wie Anzeigen usw.<\/p>\n Sidebar.php kann je nach Bedarf reines HTML-Markup oder PHP-Funktionsaufrufe enthalten. Daher k\u00f6nnte eine einfache sidebar.php so aussehen:<\/p>\n \r\n\r\nPut your custom content or HTML code here.\r\n\r\n<\/p><\/pre>\n Was geh\u00f6rt Ihrer Meinung nach in die Datei \u201efooter.php\u201c? Sie k\u00f6nnen hier Ihre Copyright-Informationen, zus\u00e4tzliche Men\u00fcs, Links, Social-Media-Symbole usw. einf\u00fcgen! M\u00f6chten Sie sehen, wie eine einfache footer.php aussieht? Hier:<\/p>\n Beachten Sie die schlie\u00dfenden Tags und in der footer.php? K\u00f6nnen Sie sich vorstellen, warum sie in footer.php enthalten sein sollten? K\u00f6nnen Sie auch erraten, warum und? <\/p>\n Sind die \u00f6ffnenden Tags in der header.php enthalten? Teilen Sie uns Ihre Vermutungen im Kommentarbereich am Ende dieses Beitrags mit \ud83d\ude09<\/p>\n Die vier Vorlagendateien, die wir gerade oben behandelt haben, bilden ein sehr einfaches WordPress-Theme. Es gibt viele andere Vorlagendateien; F\u00fcr jedes Element, das Sie in einem WordPress-Theme sehen, gibt es eine Vorlagendatei, seien es Kommentare, Suchergebnisse und 404-Fehlerseiten, um nur einige zu nennen.<\/p>\n Um die Anatomie eines WordPress-Themes vollst\u00e4ndig zu verstehen, m\u00fcssen Sie sich mit verschiedenen Vorlagendateien vertraut machen. Sie k\u00f6nnen alle in WordPress verwendbaren Vorlagenkacheln durchsuchen.<\/p>\n Dann haben wir Template-Tags, die WordPress verwendet, um Template-Dateien aus dem Theme-Verzeichnis zu finden. Erfahren Sie mehr \u00fcber Template-Tags und ihre Rolle in WordPress.<\/p>\n Ein WordPress-Theme besteht aus den folgenden anatomischen Elementen:<\/p>\n Und hier ist eine Illustration, die die Anatomie eines WordPress-Themes zusammenfasst:<\/p>\n M\u00f6chten Sie weiter lernen? Schauen Sie sich den ausf\u00fchrlichen Leitfaden zur Theme-Anatomie im WordPress Codex an.<\/p>\n Jedes WordPress-Theme, das Sie im Web sehen, verwendet dieselbe anatomische Struktur (sogar unser beliebtes Total WordPress-Theme), die Sie an Ihre Bed\u00fcrfnisse anpassen k\u00f6nnen. Sobald Sie die Grundlagen der WordPress-Theme-Entwicklung verstanden haben, sind Ihren M\u00f6glichkeiten mit WordPress-Themes keine Grenzen gesetzt.<\/p>\n ","protected":false},"excerpt":{"rendered":" Etikett. Sie k\u00f6nnen beispielsweise den body() Ihrer Website in mehrere Abschnitte unterteilen, z. B. Navigation, Kopfzeile, Hauptinhalt, Seitenleiste und Fu\u00dfzeile. Sobald Sie Ihre Webseite in Abschnitte unterteilt haben, k\u00f6nnen Sie die Abschnitte mithilfe von CSS nach Ihren W\u00fcnschen anordnen (oder organisieren). Dieser Vorgang wird als Styling bezeichnet und beinhaltet das Hinzuf\u00fcgen weiterer Styling-Elemente wie Farbe, […]<\/p>\n","protected":false},"author":1,"featured_media":859677,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","fifu_image_url":"https:\/\/blogging-techies.com\/wp-content\/uploads\/2023\/06\/160_products-BLOG.webp","fifu_image_alt":""},"categories":[7],"tags":[],"_links":{"self":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/posts\/859676"}],"collection":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/comments?post=859676"}],"version-history":[{"count":0,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/posts\/859676\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/media\/859677"}],"wp:attachment":[{"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/media?parent=859676"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/categories?post=859676"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogging-techies.com\/ge\/wp-json\/wp\/v2\/tags?post=859676"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}\n
Index.php-Vorlagendatei<\/h2>\n
\r\n\r\n\r\n\r\n<\/pre>\n
\r\n\r\n\r\n<\/pre>\n
Header.php-Vorlagendatei<\/h2>\n
\r\n\r\n\t\">\r\n\t\r\n\t\r\n\t\r\n\t\">\r\n\t\" type=\"text\/css\" \/>\r\n\t\r\n\t\r\n\r\n\r\n\n
Sidebar.php-Vorlagendatei<\/h2>\n
Footer.php-Vorlagendatei<\/h2>\n
\r\n\r\nPut your footer content here including php function calls (to fetch different template files e.g. search.php) if need be.\r\n\r\n\r\n\r\n\r\n\r\n<\/pre>\n
Zusammenfassung<\/h2>\n
\n
![\"\"](\"https:\/\/blogging-techies.com\/wp-content\/uploads\/2021\/10\/Introduccion-a-la-anatomia-de-un-tema-de-WordPress.jpg\")
<\/p>\nAbschluss<\/h2>\n