I migliori plugin WordPress 2020 per l’editor live CSS

Personalizzare il design del tuo sito non è mai stato così semplice. Utilizzando un plug-in per editor live di WordPress CSS, ora puoi creare un sito unico che corrisponda alle tue specifiche di progettazione e rifletta l’immagine del tuo marchio.


Fino a poco tempo fa, l’utilizzo dei CSS per modificare l’aspetto del tuo sito è stato principalmente lasciato ai web designer. Tuttavia, ora è disponibile una gamma di plug-in dell’editor live di WordPress CSS che ti aiutano a personalizzare il tuo sito. Alcuni richiedono una piccola conoscenza della codifica, mentre altri non hanno bisogno di alcuna esperienza di codifica. E tutti ti permettono di lavorare sul front-end del tuo sito reale in tempo reale.

In questo articolo, vedremo cosa è esattamente un plug-in di editor live CSS, quali plug-in di editor live WordPress CSS sono disponibili e cosa cercare quando si sceglie uno.

Che cos’è un plug-in Editor live di WordPress CSS?

Un plug-in dell’editor live di WordPress CSS ti consente di personalizzare il design del tuo tema. Tuttavia, a differenza della modifica diretta dei file CSS o dell’utilizzo di un plug-in CSS standard bog, un plug-in dell’editor live di WordPress CSS ti consente di lavorare sul front-end del tuo sito. Ciò significa che puoi guardare le tue modifiche applicate in tempo reale in tempo reale, mentre le apporti.

Plugin dell'editor live di WordPress CSS

L’uso di un plug-in dell’editor live di WordPress CSS implica l’inserimento di codice o la regolazione dei controlli sul front-end. Ciò significa che è possibile guardare le modifiche apportate durante la digitazione. Non solo, lavorare sul lato del visitatore di un sito Web ti fa risparmiare tempo alternando le schede e premendo costantemente il pulsante di aggiornamento.

Pannello di controllo dei plugin per editor live di WordPress CSS

I plug-in dell’editor live di WordPress CSS che non richiedono la modifica del CSS visualizzano direttamente un pannello di controllo sul front-end del tuo sito che ti consente di apportare modifiche al design del tuo sito attraverso un’interfaccia visiva. Funziona in modo molto semplice semplicemente indicando e facendo clic su un elemento nella pagina, quindi selezionando una nuova impostazione tra le opzioni disponibili. La scelta di uno dei plug-in dell’editor live di WordPress CSS con questa funzione è l’ideale per chi desidera personalizzare il design del proprio sito ma non sa come scrivere CSS.

Qualunque sia il tipo di plugin dell’editor live di WordPress CSS che usi, i risultati finali sono essenzialmente gli stessi. Puoi creare un design originale e personale per il tuo sito web. Grazie al componente Live Editor, non solo risparmi tempo e fatica, ma potresti effettivamente goderti il ​​processo.

Cosa cercare in un plug-in Editor live di WordPress CSS

Quello che cerchi da un plugin per editor live CSS dipenderà molto dal tuo livello di conoscenza CSS o esperienza di codifica.

Se non sei un programmatore, non preoccuparti, alcuni plug-in di editor live CSS sono stati creati per essere utilizzati da tutti i principianti. Tuttavia, dovrai scegliere un plug-in editor live con un pannello di controllo, che ti consenta di puntare e fare clic per apportare modifiche. Tuttavia, vale la pena verificare esattamente quali elementi è possibile personalizzare, poiché ogni plug-in è diverso.

Gli sviluppatori più esperti potrebbero desiderare un plug-in che ti consenta di inserire o modificare tu stesso il codice. Una buona opzione è quella che ti darà una mano mentre digiti ed evidenzi eventuali errori. Altre funzionalità del plugin da cercare, qualunque sia la tua esperienza includono:

  • Funziona con tutti i temi e plugin di WordPress?
  • Offre disegni pre-realizzati?
  • Puoi lavorare in modalità bozza prima di pubblicare le modifiche?
  • Salva modifiche incrementali mentre procedi, quindi puoi annullare il tuo lavoro se necessario?
  • Fornisce documentazione approfondita, esercitazioni e supporto?

Quindi ora sai cosa considerare prima di fare una scelta, diamo un’occhiata ai diversi plug-in dell’editor live di WordPress CSS disponibili.

Disclaimer: WPExplorer è un affiliato per uno o più prodotti elencati di seguito. Se si fa clic su un collegamento e si completa un acquisto, è possibile effettuare una commissione.

1. CSS Hero

CSS Hero

Informazioni e download Visualizza la demo

CSS Hero è un plug-in per l’editor di temi WordPress dal vivo di alta qualità, che ti consente di personalizzare quasi ogni aspetto del design del tuo tema. Lo fa usando un’interfaccia intuitiva punta e clicca che funziona sul front-end del sito, senza che tu debba inserire una linea di CSS se lo desideri. Pertanto, anche se non hai alcuna conoscenza di codifica, puoi comunque utilizzare questo plugin per modificare il design del tuo sito.

CSS Hero ha alcune caratteristiche particolarmente notevoli. In primo luogo, salva tutte le modifiche, in modo da poter annullare qualsiasi lavoro svolto o tornare a un determinato punto del flusso di lavoro. Non devi più temere di fare un errore e rompere il tuo sito.

In secondo luogo, CSS Hero fornisce “Stili preconfezionati” e “Skin tematiche”. Questo ti dà centinaia di design e 29 layout pre-realizzati, da scegliere come punti di partenza per il tuo sito. Quindi anche quelli di noi senza ispirazione o visione di design possono creare un sito di cui essere orgogliosi.

CSS Hero è uno dei plugin per editor live di WordPress CSS più impressionanti, progettato per permetterti di personalizzare facilmente il design del tuo sito sia che tu sia un principiante della programmazione o uno sviluppatore web. Prima di acquistare CSS Hero per soli $ 19 vale la pena verificare se questo plugin funzionerà con il tuo tema. CSS Hero funziona su una serie di temi pronti per Hero e ti fornisce una descrizione, una percentuale di compatibilità (i punteggi totali fyi con il punteggio più alto del 99% – molto più alto rispetto ad altri temi premium più venduti) e un sito di test live per ciascuno. Puoi anche provare CSSHero RocketMode per renderlo accessibile al tuo tema attuale.

Saldi estivi CSSHero

In questo momento puoi risparmiare fino al 50% su CSSHero durante le loro saldi estive! Nessun codice necessario, al momento del checkout verrà applicato lo sconto. L’offerta scade il 9 agosto 2016.

Risparmia fino al 50% su CSSHero

2. Matita gialla

Matita Gialla

Informazioni e download Visualizza la demo

Yellow Pencil è un editor di stile CSS visivo di WordPress e un altro plug-in che non richiede codifica. Detto questo, c’è un editor CSS integrato per coloro che amano modificare i loro fogli di stile a mano. Questo plugin funziona al 100% sul front-end, permettendoti di vedere e lavorare sul tuo sito in tempo reale. È stato creato per consentirti di personalizzare qualsiasi elemento su qualsiasi tema o plug-in e ti consente di modificare il tema in pochi minuti o riprogettare l’intero design del tuo sito Web se lo desideri.

Yellow Pencil ti consente di evidenziare facilmente i singoli selettori CSS, rendendo l’alterazione del tema rapida e indolore. Questo plug-in vanta oltre 300 sfondi, oltre 600 famiglie di caratteri e oltre 50 animazioni tra cui scegliere, che consente di personalizzare il tema in base all’immagine del marchio. Le Pagine Gialle includono inoltre un’ampia documentazione e supporto per coloro che non hanno mai utilizzato plugin di editor CSS live di WordPress.

Yellow Pencil ti riporterà $ 23 ed è compatibile con tutti i temi e plugin di WordPress. Ancora una volta, un’ottima opzione sia per i principianti che per i web designer esperti.

3. CSS personalizzato TJ

Plugin CSS personalizzato TJ

TJ Custom CSS di Theme Junkie è un plugin gratuito per WordPress che ti permetterà di personalizzare il tuo sito attraverso un’interfaccia front-end. Questo plug-in è stato progettato pensando ai programmatori e non è un plug-in da consigliare a coloro che non sono sicuri con i CSS.

Come molti di questi plugin, TJ Custom CSS utilizza un gestore CSS per aggiungere il CSS personalizzato al tuo sito, sovrascrivendo qualsiasi tema o stile predefinito. È possibile accedervi e lavorarci dalla dashboard.

Tuttavia, TJ Custom CSS ti consente anche di visualizzare in anteprima le modifiche in tempo reale. Utilizzando Live Customizer è possibile visualizzare l’effetto delle modifiche mentre si aggiunge il CSS personalizzato. Ciò può farti risparmiare molto tempo, poiché non dovrai continuare a salvare il tuo lavoro, cambiare scheda del browser e aggiornare le pagine.

TJ Custom è un plugin molto semplice che ti aiuterà a creare un sito unico esattamente secondo le tue esigenze. Se ti piace armeggiare con il codice e hai esperienza nella personalizzazione del tuo tema usando i CSS, questo potrebbe essere il plug-in perfetto per te.

4. CSS di SiteOrigin

SiteOrigin CSS Editor

SiteOrigin CSS è un plug-in per editor live WordPress CSS avanzato gratuito di SiteOrigin. Secondo quanto riferito compatibile con tutti i temi di WordPress, questo plug-in ricco di funzionalità offre una selezione di strumenti per soddisfare le esigenze di tutti i suoi utenti, qualunque sia la loro esperienza di programmazione.

Per i principianti, SiteOrigin CSS fornisce un Visual Editor. È costituito da un semplice set di controlli che ti consentono di scegliere facilmente stili, colori e altre impostazioni. Non necessitando affatto di competenze di codifica, puoi apportare modifiche al design del tuo sito con pochi clic.

Per coloro che hanno qualche esperienza di modifica CSS manuale e hanno bisogno di fare di più, SiteOrigin viene fornito con un ispettore dinamico. Questo ti aiuta a trovare il selettore corretto da utilizzare per indirizzare un elemento specifico che desideri personalizzare. Questa può essere spesso la parte più difficile della modifica dei CSS esistenti, quindi è di grande aiuto per coloro che stanno ancora imparando.

Per i programmatori più avanzati, il potente editor CSS del plug-in SiteOrigin ha il completamento automatico sia per i selettori che per gli attributi CSS. Ti aiuterà anche a trovare problemi nel tuo CSS prima di pubblicarlo.

Qualunque sia la funzionalità di questo plug-in che utilizzi per personalizzare il tuo sito WordPress, tutto il lavoro si svolge sul front-end del tuo sito in tempo reale, così puoi guardare le tue modifiche mentre le apporti.

5. Microthemer

Microtherma

Informazioni e download Visualizza la demo

Microthemer è un plug-in editor di WordPress CSS front end intuitivo e potente. Può personalizzare l’aspetto di qualsiasi tema o plugin di WordPress ed è abbastanza leggero da evitare di rallentare il tuo sito.

Microthemer offre opzioni per principianti e professionisti. I non programmatori possono modificare elementi come colori, caratteri, immagini di sfondo e layout del sito, per citarne alcuni. Gli sviluppatori possono lavorare a mano nella modalità di anteprima live, codificando in CSS, SCSS e JavaScript.

Una caratteristica chiave di Microthemer è che ti consente di lavorare in modalità Bozza. Puoi provare un nuovo design per il tuo sito o passare il tempo a provare varie opzioni di stile senza che ciò influisca sull’esperienza del pubblico sul tuo sito. Puoi quindi pubblicare tutte le modifiche in una volta sola quando sei soddisfatto della bozza finale.

Microthemer viene fornito con tutorial, documentazione e forum di supporto estremamente completi, che ti aiutano a ottenere il massimo da questo plugin. Puoi acquistare Microthemer con una commissione una tantum di $ 45, che include aggiornamenti gratuiti a vita.

Bonus: Ultimate Tweaker

Ultimate Tweaker per WordPress

Informazioni e download Visualizza la demo

Forse vuoi modificare non solo l’aspetto front-end del tuo sito Web, ma alcuni dei ruoli utente, della pagina di accesso o di altre funzionalità di WordPress. È qui che Ultimate Tweaker per WordPress può tornare utile. Il plug-in è compatibile con le versioni correnti di WordPress. La maggior parte dei browser abilitati per JavaScript li farà funzionare senza problemi.

Ultimate Tweaker contiene oltre 260 vari hack e modifiche che consentono agli utenti (senza php o conoscenze di programmazione) di configurare e personalizzare WordPress. Nonostante il gran numero di funzionalità, il plug-in è molto veloce e ottimizzato per caricare solo le modifiche utilizzate (caricamento lazy senza utilizzo della memoria).

Il plug-in supporta anche la maggior parte dei temi, loghi e icone e protegge il contenuto (nessun menu di scelta rapida, nessuna selezione e nessun trascinamento). La funzione HTML Minifier aiuta gli utenti a rimuovere commenti, minimizzare HTML e creare URL relativi.

Tra le caratteristiche degne di nota di questo plug-in vi sono un’interfaccia di amministrazione leggera con salvataggio automatico, minificatore HTML e generatore di collegamenti relativi, opzione per nascondere Meta Box su tipi di pagina personalizzati, Gestione ruoli, Modalità impostazione indipendente dal ruolo, Caricamento 2 volte più veloce / Lazing, Nascondersi e ruolo di amministratore “Ultimate Tweaker”.


Pensieri finali

Tutti i plugin di editor live di WordPress CSS menzionati qui sono opzioni impressionanti per aiutarti a personalizzare il design del tuo sito. Qualunque sia il plug-in che scegli, assicurati di leggere la documentazione fornita in modo da poter ottenere il meglio da esso. Più capisci come utilizzare un editor live, migliori saranno i progetti che produrrai.

Usi un plug-in per editor live CSS e, in tal caso, quale? Lo consiglieresti? Si prega di condividere eventuali suggerimenti o osservazioni a portata di mano nei commenti.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me