Suchen Sie eine PSD-zu-WordPress-Konvertierungslösung? Möchten Sie Ihre fertige Website PSD in WordPress konvertieren, wissen aber nicht wie? Okay, ich kann dir dabei helfen.

Sie wissen bereits, dass WordPress eine der am häufigsten verwendeten und vielseitigsten CMS-Plattformen der letzten Zeit ist. Das Erstellen einer voll funktionsfähigen Website von PSD zu WordPress-Theme ohne Codierung ist mit einem Seitenersteller wie Elementor viel komfortabler.

In diesem Artikel zeige ich Ihnen Schritt für Schritt „Konvertieren einer PSD in WordPress mit Elementor & WidgetKit“.

Mal sehen wie.

Auswählen eines PSD-Designs

So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 1

Bevor Sie eine PSD in ein WordPress-Theme konvertieren, müssen Sie zunächst ein PSD-Design einer Website auswählen. Kurz gesagt, PSD ist die Abkürzung für PhotoShop Design, eines der beliebtesten Design-Tools, mit dem die meisten WordPress-Website-Designs erstellt werden.

Sie können jedes Ihrer bevorzugten PSD-Designs aus der umfangreichen Sammlung von PSDHUB auswählen.

Sie bieten hochwertige kostenlose PSD-Vorlagen für Ihre Website, sowohl für den persönlichen als auch für den kommerziellen Gebrauch. Denken Sie daran, dass Ihr ausgewähltes PSD-Design einfach und zeitgemäß gestaltet sein muss.

Überprüfen Sie die folgenden Faktoren, während Sie ein PSD-Design auswählen,

  • Designstruktur: Das erste, was Sie beachten müssen, ist die Designstruktur. Design kennt keine Grenzen, aber die Codierung hat.
  • Sauberes und elegantes Layout: Drittens muss Ihr bevorzugtes PSD-Design sauber und elegant sein. Es hilft dem Entwickler, eine pixelgenaue Website aus einem sauberen und eleganten Layout zu erstellen.
  • Purpose Fulfillness: Die zweite Sache ist, ob das Design Ihren Zweck erfüllt oder nicht. Angenommen, Sie benötigen eine Reise-Website, dann muss Ihr PSD-Design eine Reise-Website PSD sein.
  • Komplexität: Versuchen Sie schließlich, die Komplexität zu ignorieren, wie sie für PSD auch in degnument ist.

Hier verwenden wir Eventia-Konferenz- und Eventmanagement-Vorlage von PSDHUB.

WordPress installieren

So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 2

WordPress ist bekannt für seine einfache Installation. In den meisten Fällen ist die Installation von WordPress ein sehr einfacher Vorgang und dauert weniger als fünf Minuten. Um eine PSD in ein WordPress-Theme zu konvertieren, ist die Installation von WordPress der zweite zu berücksichtigende Schritt.
WordPress.org bietet einen detaillierten Artikel über „So installieren Sie WordPress“ auf der Support-Seite ihrer Website. Jedoch; Hier sind die grundlegenden Anweisungen der WordPress-Installation für Sie,

  1. Laden Sie zuerst das WordPress-Paket herunter und entpacken Sie es.
  2. Erstellen Sie eine Datenbank für WordPress auf Ihrem Webserver sowie eine MySQL.
  3. Laden Sie die WordPress-Dateien an die gewünschte Stelle auf Ihrem Webserver hoch:
  4. Wenn Sie WordPress in das Stammverzeichnis Ihrer Domain integrieren möchten, verschieben oder laden Sie alle Inhalte des entpackten WordPress-Verzeichnisses in das Stammverzeichnis Ihres Webservers hoch.
  5. Wenn Sie Ihre WordPress-Installation in einem eigenen Unterverzeichnis auf Ihrer Website haben möchten, erstellen Sie das Blog-Verzeichnis auf Ihrem Server und laden Sie den Inhalt des entpackten WordPress-Pakets per FTP in das Verzeichnis hoch.
  6. Führen Sie das WordPress-Installationsskript aus, indem Sie in einem Webbrowser auf die URL zugreifen.

Das war’s! WordPress sollte nun installiert sein.

Elementor installieren

So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 3

In diesem Artikel geht es darum, eine PSD mit Elementor in ein WordPress-Theme zu konvertieren. Wir benötigen also Elementor, um die PSD-Datei anzupassen und zu bearbeiten. Mal sehen, wie man Elementor installiert.
Elementor ist eine der besten vollständigen Designplattformen, um pixelgenaues Design in WordPress zu erstellen. Es ist am besten für seinen erweiterbaren benutzerfreundlichen Designansatz. Der Installationsprozess für Elementor ist ebenfalls eine einfache Aufgabe. Folgen Sie einfach ein paar einfachen Schritten und Sie sind bereit, Ihre PSD in Elementor Page Builder zu entwerfen.

Es gibt zwei Möglichkeiten, das Elementor-Plugin zu installieren. Der Installationsvorgang wird unten beschrieben,

Über die Elementor-Site

  • Gehen Sie zuerst zu elementor.com und klicken Sie auf Download.
  • Klicken Sie im WordPress-Dashboard auf Plugins > Neu hinzufügen.
  • Klicken Sie auf Plugin hochladen und wählen Sie die Datei aus, die Sie für Elementor heruntergeladen haben.

Über WordPress Dashboard

  • Klicken Sie im Dashboard auf Plugins > Neu hinzufügen.
  • Geben Sie im Suchfeld Elementor ein und wählen Sie den zu installierenden Elementor Page Builder aus.
  • Klicken Sie nach der Installation auf Aktivieren.

Dies ist alles, was Sie tun müssen, um Elementor Page Builder zu installieren. Sie können auch dem folgenden Video folgen, um mehr über den Installationsprozess zu erfahren.

Installieren Sie WidgetKit

So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 4

WidgetKit für Elementor – Das fortschrittlichste & leistungsstarke Elementor-Addons-Kit, das Ihre Website-Erstellungsfunktionen durch Hinzufügen weiterer Elemente und Layouts verbessert. Hier verwenden wir die Widgets und Elemente von its für die Konvertierung von PSD in WordPress.
Mit WordPress und WidgetKit können Sie fast jede Art von Seiten aus einer PSD erstellen. Die Installation von Widgetkit ist so einfach wie ein PSD zu WordPress-Theme mit ihm zu entwerfen. Über das WordPress-Dashboard können Sie WidgetKit ganz einfach hinzufügen, indem Sie einige einfache Schritte ausführen. Mal sehen,

Installieren Sie WidgetKit über WordPress Dashboard

  • Klicken Sie im Dashboard auf Plugins > Neu hinzufügen.
  • Geben Sie WidgetKit in das Suchfeld ein und wählen Sie WidgetKit aus, damit Elementor installiert werden kann.
  • Klicken Sie nach erfolgreicher Installation auf Aktivieren.

WidgetKit kann jetzt mit Elementor verwendet werden. Wenn Sie noch Verwirrung haben, folgen Sie einfach dem Video. Dies hilft Ihnen auch bei der Verwendung von WidgetKit.

Konvertieren Sie Ihre PSD in WordPress

So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 5

Der Installationsteil ist abgeschlossen. Jetzt ist es Zeit, die PSD in WordPress Elementor und WidgetKit zu konvertieren. Es gibt viele PSD zu WordPress Service Provider, die PSD zu WordPress sowie PSD zu Joomla Konvertierung derzeit geben. Jedoch; sie können Ihren eigenen bevorzugten Weg entwerfen. Hier zeigen wir nur eine grundlegende Möglichkeit, eine PSD in WordPress zu konvertieren.

Außerdem können Sie auch eines unserer vorgefertigten Themen und Vorlagen aus der umfangreichen Sammlung unserer WordPress-Themen auswählen & Plugins Verzeichnis.

Versuchen Sie, beim Entwerfen eines Layouts aus PSD der Reihenfolge zu folgen. Dies wird Ihnen sehr helfen,

Erstellen Sie eine neue Seite

Als erstes müssen Sie eine neue Seite über das WordPress-Dashboard erstellen. Klicken Sie oben links im WordPress-Dashboard auf Seiten > Neu hinzufügen.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 6

Klicken Sie dann auf Bearbeiten mit Elementor, um den Elementor Page Builder aufzurufen. Sie sehen ein Elementor-Panel wie unten gezeigt.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 7

Erstellen Sie Ihre Seite aus der PSD-Datei

Um eine Seite zu erstellen oder eine PSD in ein WordPress-Theme zu konvertieren, sind drei wichtige Dinge zu beachten: Abschnitte, Spalten und Widgets. Hier Abschnitte sind die größten Bausteine, und erfasst die Spalten. Sie können Widgets in Spalten platzieren. Durch Klicken auf die Option Bearbeiten können Sie den Abschnitt, die Spalte und die Widgets mit ihrem Handle steuern.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 8

Kopfbereich hinzufügen

Für den Kopfbereich verwenden wir hier ein vorhandenes Theme Eventia von Themexpert. In WordPress haben Sie ein vorhandenes Thema als Rahmen für das Entwerfen einer Vorlage verwendet, andernfalls fügt WordPress selbst eine für Sie hinzu. Anschließend können Sie mithilfe des vorhandenen Designdesigns oder Layouts ein Logo und ein mehrseitiges Design hinzufügen.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 9

Heldenabschnitt hinzufügen

Jetzt konvertieren wir den Heldenabschnitt. Zuerst fügen wir ein Hintergrundbild wie die PSD hinzu und fügen dann Spalte in Spalte hinzu, um mehrere Inhalte und Symbole hinzuzufügen.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 10

Für die Zähleroption hier verwenden wir WidgetKit Countdown Element. Die Ausgabe und die Bearbeitungsoption finden Sie unten.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 11

Inneren Abschnitt hinzufügen

Jetzt ist es Zeit, den inneren Abschnitt zu entwerfen. Hier verwenden wir Elementor-Elemente, um Hintergrund und Text zwischen zwei Spalten hinzuzufügen.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 12

Dies ist der Abschnitt Über dieses Ereignis bearbeiten mit Elementor Element. Hier fügen wir Text und Bannerbild in die Abschnittsspalte ein. Die Ansicht schaut unten.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 13

Mit dem vertikalen WidgetKit-Teamsymbol entwerfen wir den Lautsprecherbereich der PSD-Datei. Dort fügen wir Bilder und Social-Site-Symbol in verschiedenen Spalte mit Namen und Bezeichnung.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 14

In diesem Abschnitt fügen wir einfach ein zufälliges Symbol aus der PSD hinzu und geben eine Überschrift.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 15

Wir können nicht alles mit Elementor machen. In einem solchen Fall, was wir tun? Wir verwenden Addon aus verschiedenen Themen oder machen ein Addon für unsere eigenen. Dies ist eine häufige Sache beim Entwerfen einer PSD zu WordPress Theme. Hier verwenden wir Schedule Addon von Eventia Theme.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 16

Für den Blog-Bereich verwenden wir das Blog Carousel-Element von WidgetKit. Mit verschiedenen visuellen Inhalten können Sie Hintergrund hinzufügen und sogar mehr lesen.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 17

Für den Footer-Bereich verwenden wir hier ein vorhandenes Theme Eventia von Themexpert wie vor dem Header-Bereich. Hier erhalten wir mehrere Social-Site-Symbole und eine Schaltfläche zum Abonnieren.

  •  So konvertieren Sie PSD mit Elementor WidgetKit in WordPress 18

Vorschau & Veröffentlichen Sie Ihre Seite

Sobald Sie mit dem Entwerfen Ihrer Seite aus der PSD fertig sind, können Sie eine Vorschau Ihrer Arbeit anzeigen und diese veröffentlichen. Sie können auch eine veröffentlichte Seite bearbeiten und Ihre Arbeit als Entwurf speichern. Das bedeutet, dass Sie Ihre veröffentlichte Seite nicht ruinieren, während Sie Ihre Arbeit als Entwurf speichern. Hier ist die Vorschau Visual von Eventia PSD.

Letztes Wort

Articles

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.