Wie wäre es mit der Anpassung des Live-WordPress-Designs in Echtzeit? Nun, CSSHero ist ein Plugin, um Änderungen auf einfache Weise vorzunehmen

WordPress ist ein CMS-Framework voller Anpassungsmöglichkeiten und bietet eine Reihe von APIs und Hooks, mit denen jeder Entwickler Themen und Plugins ändern kann. Aus diesem Grund haben wir derzeit die Möglichkeit, Plugins aus Tausenden von verfügbaren Plugins aus dem offiziellen WordPress-Repository auszuwählen.

In diesem Beitrag werden wir das neue Plugin CSSHero mit allen Details besprechen. Aber bevor wir anfangen, konzentrieren wir uns auf these questions .

• Wie nehme make live changes an deiner WordPress-Seite vor?
• Themenwechsel in Echtzeit?
• Gibt es eine einfache Möglichkeit, die Anzahl der CSS-Eigenschaften für das WordPress-Design zu ermitteln?
• Bearbeiten Sie Ihren WordPress-Blog mit Echtzeitvorschauen
• Anpassen von WordPress-Themes, bevor sie live sind

Wenn Sie eine der oben genannten Fragen haben, dann sind Sie hier genau richtig.

Wenn Sie Live-Änderungen selbst without any help des Plugins vornehmen möchten, müssen Sie im Voraus fast ~300 of CSS properties kennen. Es ist irgendwie unmöglich, diese zu ändern, um echte Änderungen im Live-Designmodus zu sehen. Mit dem WordPress- customizer können Sie einige der Eigenschaften ändern, aber nicht alle, und das ist ein echtes Problem, das wir haben.

Ich würde sagen, wir haben ZWEI Möglichkeiten:

Option-1) Führen Sie CSS-Änderungen manuell durch

• Öffnen Sie Ihren Blog in Chrome / Mozilla
• Klicken Sie mit der rechten Maustaste auf CSS-Elemente wie Header, Post, Bild usw
• Klicken Sie auf Inspect , um die CSS-Eigenschaften anzuzeigen
• Nehmen Sie Änderungen vor, um die Wirkung zu sehen
• Sobald Sie in Ordnung sind – Gehen Sie zur style.css -Datei des Themas und speichern Sie die Änderungen
• Wiederholen Sie den Vorgang mehrmals

Option-2) Verwenden Sie ein Plugin mit integrierter Funktionalität, in unserem Fall ist es CSSHero

• Führen Sie Änderungen auf der live site mit dem Editor durch
• Siehe Live-Ergebnis
• Klicken Sie auf die Save button und Sie sind done

CSSHero verschenkt in Zusammenarbeit mit Crunchify 10 free Licenses an Crunchify-Leser. Ausfüllen dieses Google-Formular um Ihren Namen aufzulisten. – Werbegeschenk BEENDET

Lassen Sie uns CSSHero installieren und Live-WordPress-Theme-Änderungen durchführen

NOTE : Überprüfen Sie das vollständige Video am Ende dieses Beitrags.

Schritt 1

Warum CSSHero? CSSHero ist ein premium -WordPress-Plugin. Die Basislizenz beginnt $29/site . Ich würde sagen – ob Sie Anfänger oder Profi sind, es ist einen Versuch wert. Es kommt mit 30 days Geld-zurück-Garantie.

Verwenden Sie den Code CRUNCHIFY , um 34% off Rabatt auf Starter- und Personal-Pläne und 40% off Rabatt auf Pro-Pläne zu erhalten.

Registrieren Sie Ihre Lizenz und laden Sie die neueste Version des CSSHero plugin von Ihrem Dashboard herunter: http://www.csshero.org/

Schritt 2

• Installieren Sie es über Ihr WordPress-Admin-Panel und aktivieren Sie es
• Bei der Aktivierung wird nach dem Key gefragt
• Klicken Sie einfach auf Get my Key Now! Schaltfläche und es öffnet sich eine Seite mit dem Lizenzschlüssel
• Klicken Sie auf Get License und schon sind Sie fertig

Punkt-1) Beginnen wir mit der Funktionalität

• Gehen Sie jetzt zu Ihrer Blog home page und Sie sehen die animierte CSSHero-Schaltfläche in der top right Ecke.
• Klicken Sie darauf und das Plugin lädt control panel , das mit Ihrem Thema funktioniert

Schauen Sie sich das folgende GIF mit allen CSSHero options an:

Punkt-2) CSSHero-Design-Editor-Option

Die Idee für den theme editor besteht darin, den gesamten theme's style mit einem einfachen visuellen Editor zu ändern. Mit Hilfe des CSSHero-Designeditors können Sie Änderungen vornehmen

• Überschrift
• Schriftart
• Rand
• Stile usw.

Gleiches gilt für

• Körperinhalt
• Eingangsposten
• Metawerte
• Header-Werte
• Fusszeile
• Seitenleiste usw. Schauen Sie sich das untenstehende GIF an.

Punkt-3) Praktische Optionen für das Gerätelayout mit einem Klick

Wie Sie im folgenden Bild sehen, gibt uns der Themeneditor die Möglichkeit, eine Reihe verschiedener Mobil-, iPhone- und iPad-Layouts Ihres Themas mit nur einem Mausklick und einem Mausklick Layouts .

Punkt-4) Wie können Sie Ihre letzten Änderungen rückgängig machen?

Benutzer haben die Möglichkeit, alle letzten Änderungen mit dem einfachen Change history rückgängig zu machen. Ich wette, keiner der Entwickler schafft es auf Anhieb richtig, nicht zumindest ich :). Das ist sehr praktisch für mich.

CSSHero bietet auch ein sehr praktisches Modul, das all of your save changes anzeigt. Sie können in der timeline zurückgehen und zur vorherigen Version zurückkehren. Ist das nicht ein praktisches Werkzeug? Ich habe dieses Tool bisher viele verschiedene Male verwendet und liebe es.

Punkt-5) Einstellungen und Tools-Optionen

Preset Settings und Tools Options .

Schauen Sie sich das detaillierte Video an, das wir aufgenommen haben und das alle Funktionen des CSSHero WordPress Custom CSS Editor-Plugins zeigt.

Ausführliches Youtube-Video:

Nachdem Sie nun alle Funktionen gesehen haben, ist es an der Zeit, die folgenden Fragen zu stellen :).

Punkt-6) Funktioniert dieses Plugin mit meinem Theme?

Gemäß Informationen von der offiziellen CSSHero-Website funktioniert das Plugin mit den folgenden WordPress-Theme-Frameworks.

• Genesis-Framework
• Presse erzeugen
• SchichtenWP
• Ultimate-Thema
• Gesamt
• Im Voraus
• WP-Bootstrap
• Thematisch
• Erforderlich + Fundament
• Omega
• Seitenlinien DMS

Wenn Ihr Design isn't compatible machen Sie sich no worries . Es zeigt Ihnen eine Option zum Aktivieren des Rocket mode .

Message : Native Unterstützung für dieses Thema ist nicht vorhanden. Möchten Sie die automatische Raketenmodus-Erkennung ausprobieren? enable it einfach und versuchen Sie CSS again und Sie sollten die gleichen Optionen sehen, die Sie im obigen Video gesehen haben.

Punkt-7) Wie sieht es mit Plugin-Support und Dokumentation aus?

Einige der beliebten WordPress-Plugins wie Gravity Forms, WooCommerce, Contact Form7, WP Pools und mehr sind mit dem CSSHero-Framework kompatibel.

Das heißt, theme customization funktioniert nicht nur mit der Designanpassung, sondern auch mit der plugin layout customization .

Zu guter Letzt gibt es auf der offiziellen Website eine Reihe detaillierter Artikel mit tips and tricks , die Sie lesen können.

Only Cons , die mir einfallen, sind, sich mit allen Funktionen vertraut zu machen. Es kann einige Zeit dauern, bis Sie loslegen und Profi werden. Sobald Sie mit CSSHero vertraut sind, bin ich sicher, dass es eine very handy solution für alle WordPress-Blogger sein wird.

Setzen Sie sich mit uns in Verbindung, wenn Sie ein Produkt, Plugin, Thema usw. haben, von dem Sie glauben, dass Sie es bewerben möchten.

Hier sind Crunchify-Exklusivangebote für CSSHero:

Hallo Crunchify-Leser –

Wir freuen uns, up-to 40% off Rabatt auf das Anpassungs-Plugin für das CSSHero-WordPress-Theme ankündigen zu können.

Bitte werfen Sie einen Blick auf die folgenden Schritte

Schritt 1

• Gehen Sie zur Website CSSHero: https://www.csshero.org/
• Klicken Sie auf den Link Pricing Plans

Schritt 2

• Klicken Sie auf die Schaltfläche I have a coupon code

Schritt 3

• Gutscheincode eingeben: CRUNCHIFY

Schritt 4

• Klicken Sie auf die Schaltfläche „Einlösen“, um 34% off auf den Starter- und den persönlichen Plan zu erhalten
• Erhalten Sie 40% off auf den Pro-Plan

Liste aller Deals: https://crunchify.com/deals/