Was ist eine PSD?

PSD- und WordPress-Themes sind zwei Begriffe, die im Webdesign nicht eingeführt werden müssen. PSD ist ein Photoshop-Dokument, das von Adobe Photoshop erstellt wurde.

Was sind WordPress-Themes?

Angenommen, Sie sind neu in WordPress-Themes, erlauben Sie mir, es Ihnen in einer einfachsten Form zu erklären. Betrachten Sie WordPress-Themes ähnlich wie Ihre Smartphone-Themes.

Schritt 1: Schneiden Sie Ihre PSD

Sie schneiden Ihre PSD und teilen sie in separate Bilddateien, so dass jede Designkomponente effektiv als separate Designdatei gespeichert wird. Sie können jede Fotobearbeitungssoftware oder vorzugsweise Adobe Photoshop verwenden, um Ihre PSD-Dateien zu schneiden.

Eine einfache Möglichkeit, Ihre PSD zu schneiden, besteht darin, zuerst nach diesen Komponenten zu suchen.

• Hintergrund
• Kopfzeile und Trennzeichen
• Fußzeile und andere

Schritt 2: Index erstellen.html und Stil.css

Nun besteht der nächste Schritt darin, die Programmierwelt von der Designwelt aus zu erreichen. Aber es wird ziemlich einfach sein. Erstellen Sie aus dem von Ihnen erstellten PSD-Design eine statische HTML- und CSS-Vorlage.

Sie können einem responsiven Webdesign folgen, um sicherzustellen, dass Ihre Website auf allen Bildschirmen schön aussieht.

Lassen Sie mich Ihnen ein Beispiel für die Aufteilung des Codes basierend auf dem div-Tag und dem CSS-Styling zeigen.

Schritt 3: Zerlegen Sie Ihren Index.html in WordPress-Theme-Dateistruktur

Jetzt haben Sie die grundlegende Vorlage bereit und müssen sie in die WordPress-Umgebung portieren. Aber bevor Sie das tun, benötigen Sie möglicherweise ein wenig Wissen darüber, wie die Dinge in WordPress organisiert sind.

WordPress hat eine bestimmte Dateistruktur, der Sie folgen müssen. Sie werden Ihre Webseite grundsätzlich in WordPress-Themes hochladen, und die WordPress-Software sollte nahtlos damit arbeiten, damit die Plugins und zusätzlichen Funktionen ohne Probleme oder Inkompatibilitätsprobleme hinzugefügt werden können.

Einige Hinweise, die Ihnen helfen können, sind unten aufgeführt.

Grundlegende Dateien des WordPress-Themas

• Index.php
• Kopfzeile.php
• Seitenleiste.php
• Fußzeile.php

• stil.css

  Das Haupt-Stylesheet: Diese Datei muss an das Thema angehängt werden und enthält die Header-Informationen des Themas.

• rtl.css

  Das Haupt-Stylesheet: Diese Datei muss an das Thema angehängt werden und enthält die Header-Informationen des Themas.

• Index.php

  Die Hauptvorlagendatei: Es ist die übergeordnete Datei der Vorlage.

• Bemerkungen.php

  Diese Datei definiert die Kommentarvorlage.

• Titelseite.php

  Das frontpage Template: es wird nur für eine statische Frontpage verwendet.

• Zuhause.php

  Die Startseite ist standardmäßig die Startseite.

• einzeln.php

  Diese Datei wird verwendet, wenn ein einzelner Beitrag abgefragt wird. Für diese und alle anderen Abfragevorlagen, Index.php wird verwendet, wenn die Abfragevorlage nicht vorhanden ist.

• Seite.php

  Dieser wird für individuelle Seitenvorlagen verwendet.

• Kategorie.php

  Diese Seite wird benötigt, um die Kategorien anzuzeigen.

• Etikett.php

  Diese Seite wird benötigt, wenn das Tag benötigt wird.

• Datum.php

  Um das Datum / und die Uhrzeit anzuzeigen, benötigen wir diese Vorlagenseite.

• archivieren.php

  Wird verwendet, wenn eine Kategorie, ein Autor oder ein Datum abgefragt wird. Beachten Sie, dass diese Vorlage nach Kategorie überschrieben wird.php, Autor.php und Datum.php für ihre jeweiligen Abfragetypen.

• Suche.php

  Um eine Suche durchzuführen, benötigen wir diese Datei in der Vorlage.

• Anlage.php

  Um einen einzelnen Anhang anzuzeigen, benötigen wir diese Datei.

• Bild.php

  Bildanhangsvorlage wird verwendet, wenn ein einzelner Bildanhang angezeigt wird.

• 404.php

  Die Vorlage 404 Not Found soll die Fehlermeldung anzeigen, wenn der Beitrag nicht gefunden wird.

Schritt 4: Fügen Sie WordPress-Tags hinzu

Alles, was Sie jetzt tun müssen, ist, die fantastischen integrierten Funktionen von WordPress mithilfe von WordPress-Tags in Ihre Themendateien zu importieren und diese Tags hinzuzufügen. Folgen Sie dem angegebenen Link, um die verfügbaren WordPress-Vorlagen-Tags zu kennen.