Wenn Sie Ihr WordPress-Theme-Design auf einfache Weise anpassen möchten, dann ist die Yellow Pencil WordPress-Plugin möglicherweise genau das Add-On, das Sie für Ihre Website benötigen. Mit diesem visuellen Stileditor können Sie das Erscheinungsbild Ihrer Website ändern, ohne eine Codezeile berühren zu müssen.
Die Verwendung von Yellow Pencil wird Ihnen die Freude am Webdesign beibringen und gleichzeitig eine schöne Website erstellen, die Ihre Besucher begeistert. Bearbeiten Sie jedes Element Ihrer Website, alles im Frontend und in Echtzeit. Die einzige Grenze für das Design Ihrer Website wird Ihre eigene Vorstellungskraft sein.
Diese ausführliche Anleitung zur Verwendung der Premium-Version von Yellow Pencil behandelt die wichtigsten Funktionen, einschließlich der Point-and-Click-Live-CSS-Bearbeitungsfunktionen und der Kompatibilität mit jedem WordPress-Theme. Anschließend schauen wir uns die angebotene User Experience an, damit Sie im Handumdrehen einrichten und gestalten können.
Für wen ist gelber Bleistift geeignet?
Egal, ob Sie nach einer schnelleren Möglichkeit suchen, Ihre Website anzupassen, oder mit CSS nicht vertraut sind, Yellow Pencil kann Ihnen helfen. Dieses Plugin enthält erweiterte Tools und Anpassungsoptionen, perfekt für Profis, die neue Websites für Kunden erstellen möchten.
Aufgrund der fehlenden Codierung, der Benutzerfreundlichkeit, der intuitiven Benutzeroberfläche und der detaillierten Support-Dokumentation können jedoch auch Benutzer mit begrenzter Designerfahrung auf dieses Plugin zugreifen. Kurz gesagt, wenn Sie das Erscheinungsbild Ihrer WordPress-Website anpassen möchten, ist Yellow Pencil der visuelle Stileditor für Sie.
Kurz gesagt, wenn Sie das Erscheinungsbild Ihrer WordPress-Website anpassen möchten, ist Yellow Pencil der visuelle Stileditor für Sie.
Hauptmerkmale des gelben Bleistifts
Yellow Pencil ist ein wirklich beeindruckendes Designwerkzeug. Die verfügbaren Funktionen und Tools ermöglichen die vollständige Kontrolle über das Erscheinungsbild Ihrer Website. Es kann in jedem WordPress-Theme oder -Plugin verwendet werden und ermöglicht es Ihnen, stilvolle und reaktionsschnelle Webseiten zu erstellen.
Mit dem Element Inspector können Sie jedes visuelle Element auf Ihrer WordPress-Website auswählen und anpassen. Bearbeiten Sie Farben, Hintergründe, Ränder und vieles mehr. All dies geschieht in Echtzeit am Frontend Ihrer Website, sodass Sie die Änderungen während der Durchführung anzeigen können. Yellow Pencil generiert Code im Hintergrund, so dass Sie sich keinen Code selbst ansehen müssen, es sei denn, Sie möchten. Weitere Funktionen sind:
- Ziehen und ablegen, um Elemente neu zu positionieren
- Ändern Sie die Größe von Elementen mit der Berührung Ihrer Maus
- Wählen Sie aus 600+ Schriftarten, 300+ Hintergrundmustern, 50+ Animationen und vielem mehr
- Unbegrenzte Farben verfügbar oder wählen Sie aus den modernen Farbpaletten von Yellow Pencil
- Verwenden Sie einen Live-CSS-Editor
Umfangreiche Dokumentation und Support sind ebenfalls verfügbar, damit Sie diesen visuellen WordPress-Editor optimal nutzen können.
Jetzt wissen wir also, was Yellow Pencil zu bieten hat. Aber wie fangen wir an und ist die Benutzererfahrung so beeindruckend wie die Funktionen, die sie bietet?
So installieren Sie den gelben Bleistift
Yellow Pencil ist extrem schnell und einfach zu installieren. Sobald Sie das Plugin von CodeCanyon gekauft haben (oder ein Premium-Theme wie New York gekauft haben, das das Plugin kostenlos enthält), laden Sie die „Nur installierbare WordPress-Datei“ von Ihrer Envato-Downloadseite herunter (oder Sie können die kostenlose Version verwenden, die auf WordPress.org).
Öffnen Sie dann Ihr WordPress-Dashboard. Wählen Sie „Plugins“ > „Neu hinzufügen“.
Klicken Sie auf der Seite Plugins hinzufügen auf ‚Plugin hochladen‘ > ‚Datei auswählen‘.
Wählen Sie dort, wo Sie es heruntergeladen haben, ‚waspthemes-yellow-pencil.zip‘. Klicken Sie auf „Jetzt installieren“.
Klicken Sie nach der Installation des Plugins auf „Aktivieren“. Geben Sie den Aktivierungscode ein, den Sie beim Kauf des Plugins erhalten haben. Dadurch erhalten Sie Zugriff auf Plugin-Updates, sobald diese veröffentlicht werden.
Nach der Aktivierung wird die Willkommensseite der Gelben Seite auf Ihrem Dashboard angezeigt. Unter „Ressourcen“ finden Sie die Dokumentation des Plugins, Tutorials und andere Hilfe und Unterstützung, die Sie möglicherweise benötigen, um loszulegen.
Wenn Sie fertig sind, klicken Sie auf „Los geht’s“. Dadurch gelangen Sie direkt in den Bearbeitungsmodus.
Die Benutzeroberfläche des gelben Bleistifts verstehen
Die Benutzeroberfläche des Yellow Pencil ist sehr klar und intuitiv zu bedienen. Die Leiste auf der linken Seite der Seite zeigt die verfügbaren Tools an.
Das Panel, das sich auf der rechten Seite der Seite befindet, ist das Editor-Panel. Wenn kein Element auf der Seite ausgewählt ist, werden die drei Customizing-Typen angezeigt, die bearbeitet werden können.
Wenn Sie auf ein Element auf der Seite klicken, ändert sich das Editor-Panel und enthält die Stileigenschaften.
Um ein ausgewähltes Element wird ein blaues Feld angezeigt, das zusätzliche Anpassungsoptionen anzeigt.
Wichtige Werkzeuge, die Sie benötigen
Die Werkzeugleiste auf der linken Seite zeigt zahlreiche Werkzeuge an, aber einige sind sofort wichtig, um Ihnen den Einstieg zu erleichtern…
- Element-Inspektor – Damit können Sie jedes Element auf der Seite zum Anpassen auswählen.
- Rückgängig machen und wiederherstellen – Probieren Sie verschiedene Designs auf Ihrer Seite aus, in der Gewissheit, dass Sie Ihre Änderungen rückgängig machen oder wiederherstellen können.
- Vollbild – Arbeiten Sie im Vollbildmodus und erhalten Sie einen klaren Überblick über Ihre Anpassungen, während Sie sie vornehmen.
Das Editor-Panel enthält drei wichtige Schaltflächen…
- Live-Vorschau – Zeigen Sie eine Vorschau Ihrer Änderungen an, ohne dass die Yellow Pencil-Benutzeroberfläche angezeigt wird.
- Änderungen zurücksetzen – Ihnen gefallen Ihre Änderungen nicht? Setzen Sie einfach die vorgenommenen Änderungen zurück.
- Speichern – Sobald Sie Ihre Arbeit in der Vorschau angezeigt haben und mit den Ergebnissen zufrieden sind, klicken Sie einfach auf die Schaltfläche Speichern.
Auswahl eines Customizing-Typs
Bevor Sie ein Element auf Ihrer Seite auswählen und mit der Bearbeitung beginnen, müssen Sie zunächst einen Anpassungstyp auswählen. Diese werden im Editor-Panel angezeigt, wenn kein Element ausgewählt ist. Es stehen drei Typen zur Auswahl; Global anpassen, eine Seite anpassen und Vorlagen anpassen.
Jeder der Typen ist relativ selbsterklärend. Wenn Sie „Global anpassen“ auswählen, werden die von Ihnen vorgenommenen Änderungen auf jede Seite Ihrer Website angewendet. Wenn Sie „Eine Seite anpassen“ auswählen, wirken sich alle Änderungen nur auf die Seite aus, an der Sie gerade arbeiten. ‚Vorlagen anpassen‘ gilt für den aktuellen Beitragstyp, eine gute Option, wenn Sie alle Produkt- oder Blogseiten konfigurieren möchten.
Der von Ihnen gewählte Anpassungstyp wird oben im Editorbereich angezeigt. Stellen Sie sicher, dass Sie den richtigen Typ bearbeiten, bevor Sie Ihre Arbeit speichern.
Was kann man mit gelbem Bleistift machen?
Sobald Sie sich mit der Benutzeroberfläche vertraut gemacht haben, können Sie loslegen. Nachfolgend finden Sie ein Beispiel für einige der zahlreichen Anpassungstools und Funktionen, die dieses Plugin bietet. Diese helfen Ihnen auf dem Weg zu einer schönen und professionellen Website.
Ändern Sie die Typografie
Die Auswahl einer für Ihre Website geeigneten Schriftart ist eine wichtige Aufgabe. Yellow Pencil bietet eine Vielzahl von Optionen, mit denen Sie Ihren Text so gestalten können, dass er zum Design Ihrer Website passt und die Aufmerksamkeit Ihrer Leser auf sich zieht.
Klicken Sie auf einen Textabschnitt, den Sie bearbeiten möchten, und wählen Sie dann ‚Text‘ aus dem Editor-Panel. Dadurch werden die Anpassungsoptionen für die Typografie angezeigt. Wählen Sie aus über 600 Schriftarten, ändern Sie die Schriftgröße, ändern Sie die Zeilenhöhe, steuern Sie den Abstand von Buchstaben und Wörtern und vieles mehr. Sie können auch die Farbe Ihres Textes ändern, indem Sie eine der modernen Farbpaletten von Yellow Pencil auswählen oder sich für Ihre eigene Farbauswahl entscheiden.
Einen Rahmen hinzufügen
Das Hinzufügen eines Rahmens zu bestimmten Elementen auf einer Seite kann dazu beitragen, wichtige Informationen hervorzuheben und effektive visuelle Elemente zu erstellen. Nachdem Sie das Bild oder den Text ausgewählt haben, dem Sie einen Rahmen hinzufügen möchten, wählen Sie im Editor-Bereich „Rahmen“. Es gibt vier Stile von
Nachdem Sie das Bild oder den Text ausgewählt haben, dem Sie einen Rahmen hinzufügen möchten, wählen Sie im Editor-Bereich „Rahmen“. Es stehen vier Rahmenarten zur Auswahl; durchgezogen, gepunktet, gestrichelt oder verdeckt. Sie können auch die Rahmenbreite ändern, um sie definierter zu machen, und die Farbe ändern.
Eine beeindruckende Funktion ist, dass Sie jede Seite des Rahmens separat anpassen können. Das bedeutet, dass jeder der vier Seiten eine andere Farbe, Stil und Dicke gegeben werden kann, was zu einem einzigartigen und auffälligen Erscheinungsbild führt.
Ändern Sie den Hintergrund
Ein auffälliger Hintergrund kann dabei helfen, ein Element hervorzuheben. Mit Yellow Pencil können Sie den Hintergrund jedes einzelnen Elements auf Ihrer Website ändern.
Klicken Sie dazu auf das ausgewählte Element und wählen Sie im Editor-Panel ‚Hintergrund‘.
Hier können Sie die Hintergrundfarbe ändern, aus einem von Yellow Pencils 300+ Mustern auswählen oder einen CSS-Verlauf auswählen. Sie haben auch die Möglichkeit, Ihre eigenen benutzerdefinierten Bilder hochzuladen. Wenn Sie sich für einen Hintergrund entschieden haben, können Sie die Größe und Position des Hintergrunds anpassen und, wenn Sie ein Bild hinzugefügt haben, wählen, ob es statisch ist oder mit dem Rest der Seite scrollt.
Animationen verwenden
Die Verwendung von Animationen ist eine weitere großartige Möglichkeit, Ihren Inhalten zu helfen, Wirkung zu erzielen. Unter ‚Animation‘ im Editor-Panel können Sie Ihrem ausgewählten Element einen Animationseffekt hinzufügen.
Wählen Sie im Live-Animations-Manager eine von über 50 Animationen aus, vom Vergrößern oder Ausblenden bis zum Springen, Drehen und vielem mehr. Sie können die Dauer und Verzögerung steuern sowie mehrere Animationen gleichzeitig ausführen, wenn Sie dies wünschen. Dies verleiht Ihrer Site Originalität und lenkt die Aufmerksamkeit auf die wichtigen Aspekte Ihrer Seite. Sie können auch versuchen, Ihre eigenen benutzerdefinierten Animationen zu erstellen, indem Sie den Animationsgenerator in der Symbolleiste auswählen.
Größe ändern und jedes Element neu positionieren
Die Größenänderung und Neupositionierung jedes Elements ist mit Yellow Pencil sehr einfach.
Um die Größe zu ändern, klicken Sie direkt auf ein Element, sodass das blau hervorgehobene Feld darum herum angezeigt wird. Ziehen Sie dann einfach die horizontalen und vertikalen Linien des blauen Felds, um die Größe zu ändern.
Um ein Element neu zu positionieren, klicken Sie darauf und halten Sie dann die Maustaste gedrückt. Ziehen Sie es per Drag & Drop an die entsprechende Position auf der Seite.
Der Nachteil dieser Drag-and-Drop-Funktion besteht darin, dass sie Probleme bei der Anzeige auf Mobiltelefonen verursachen kann. Verwenden Sie das Responsive Tool in der Symbolleiste, um zu sehen, wie Ihre Webseite auf allen Bildschirmgrößen aussieht. Möglicherweise müssen Sie Ihr Design entsprechend ändern.
Preisgestaltung
Das WordPress-Plugin Yellow Pencil ist bei CodeCanyon für 26 US-Dollar erhältlich. Dies beinhaltet einen 6-monatigen Support, aber Sie haben die Möglichkeit, zusätzliche 7,88 USD zu zahlen, um den Support auf bis zu 12 Monate zu verlängern.
Abschließende Gedanken
Yellow Pencil ist ein großartiges Werkzeug, wenn Sie das Erscheinungsbild Ihrer WordPress-Site anpassen möchten. Die Funktionen und die Benutzerfreundlichkeit bieten Ihnen alles, was Sie zum Erstellen einer benutzerdefinierten WordPress-Website benötigen. Um optimale Ergebnisse zu erzielen, stellen Sie sicher, dass Sie eine klare Vorstellung davon haben, wie Ihre Website aussehen soll.
Verfügt Yellow Pencil über die Funktionen, die Sie zum Personalisieren Ihrer WordPress-Website benötigen? Bitte teilen Sie Ihre Gedanken unten mit…
