Trascina e rilascia il layout di WordPress con Platform Pro

Costruire e anche modificare leggermente i temi WordPress può essere una vera seccatura. Potresti comprare un libro o guardare ore di video tutorial finché non sei un esperto di WordPress, ma non sarebbe bello se tu potessi saltare tutto questo e saltare a costruire il tuo tema oggi?

Oggi daremo un'occhiata a un prodotto straordinariamente innovativo che ti consente di utilizzare la semplicità di un'interfaccia drag-and-drop e moduli di base per personalizzare completamente un sito WordPress. Il prodotto si chiama Platform Pro e devi semplicemente vederlo?

Scopri la piattaforma Pro

Platform Pro è essenzialmente solo un tema WordPress, ma è probabilmente diverso da qualsiasi tema WordPress che tu abbia mai usato prima. Invece di fornire solo alcune opzioni o layout di colori diversi, Platform ti mette al posto di guida. Che tu sia uno sviluppatore web e ami codificare a mano o qualcuno che non sa nemmeno cosa sia il CSS, troverai che la piattaforma ha molto da offrirti.

Mi sono imbattuto per caso nel tema completamente per caso l'altro giorno e ho chiesto alla brava gente di PageLines di prepararmi una pagina di test. Si scopre che hanno già predisposto una pagina di test pubblica affinché chiunque possa provare gratuitamente. Dopo aver capito come funziona tutto qui, vai su quel link per provare il tema da solo.

Iniziare

Di seguito è più o meno la pagina con cui inizieremo oggi (ho tagliato un po 'quindi non è troppo grande). Come puoi vedere, è eccellente per una lavagna vuota. La tipografia e il layout sono abbastanza buoni, ma abbastanza generici che non ci preoccuperemo di scavare e cambiarlo tutto intorno.

Ancora una volta, questo è vicino a ciò che si ottiene immediatamente senza lavoro fino ad ora:

Nell'immagine qui sopra possiamo vedere un'intestazione e un'area di navigazione, alcune anteprime dei post, una barra laterale, un piè di pagina, ecc. Ognuno di questi ha un numero di opzioni per la personalizzazione, quindi se non ti piace qualcosa a questo punto, non preoccupati, puoi cambiarlo!

Il pannello delle impostazioni

All'interno del tipico pannello di amministrazione di WordPress, troverai un modulo per Platform Pro. Qui è dove gestirai la maggior parte, ma non tutte, delle modifiche al tuo tema WordPress. C'è un sacco di cose qui, quindi all'inizio potresti sentirti un po 'sopraffatto, ma onestamente, praticamente ogni impostazione che troverai è semplice e facile da capire.

Sicuramente non avremo il tempo di passare a tutte le impostazioni qui, ma daremo un calcio alle gomme abbastanza a sufficienza da farti capire cosa è possibile.

Modifica del layout

Come designer, la prima cosa che voglio sapere è come posso giocare con il layout. Facendo clic sulla scheda Editor di layout del pannello delle impostazioni verrà visualizzato un numero di opzioni tra cui scegliere, sia di base che avanzate.

La prima scelta è scegliere tra uno dei sei layout di base. Ognuna di queste è una combinazione di un'area del contenuto e zero, una o due opzioni della barra laterale.

Odio quella barra laterale vista nell'anteprima del sito iniziale qui sopra? Scaricalo selezionando l'icona con solo una sezione del contenuto principale. Quindi applica le tue impostazioni e dai un'occhiata alla tua pagina per vedere le modifiche.

Non riesci ad avere abbastanza sidebar e widget? Scegli un'opzione con due barre laterali e ottieni il layout visto nell'immagine qui sotto.

Andare avanti

Se vuoi avere ancora più controllo sul layout, scorri verso il basso per trovare il pannello mostrato di seguito. Qui puoi trascinare i divisori e utilizzare i campi per determinare la larghezza della pagina e di ogni colonna.

Quindi diciamo che penso che la mia barra laterale sia troppo ampia. Tutto quello che devo fare per risolvere il problema è far scorrere il piccolo divisore verso destra finché le mie dimensioni sono 700 px per la colonna principale e 260 px per la barra laterale.

Una volta salvate queste impostazioni di layout e dare un'occhiata alla mia pagina, ecco il risultato:

Cambiando la tipografia

La piattaforma ti dà molta libertà sul testo della tua pagina. Passa alla scheda della tipografia e vedrai le opzioni per cambiare i caratteri per il carattere principale, il carattere secondario, le intestazioni e anche le aree di input.

Una cosa che mi ha davvero sorpreso è l'enorme selezione di caratteri che puoi scegliere con questo tema. Le linee di pagamento hanno incluso diversi tipi di carattere web standard e persino una buona parte della Libreria di caratteri di Google per spingere al massimo la libertà creativa (ci sono anche opzioni Cufon personalizzate).

Quando assegni un font ad un'area specifica, puoi scegliere tra una serie di opzioni di stile standard che normalmente dovresti scrivere per manipolare un gruppo di CSS. Se vuoi includere il tuo CSS, basta fare clic su? Avanzate? pulsante.

Alla fine ho deciso di andare con un tocco moderno quindi ho scelto un paio di bei caratteri sans-serif per la pagina: Lato per le intestazioni e Droid Sans per il corpo.

Sfondo e colori

Nella scheda Controllo del design troverai ancora più opzioni di personalizzazione. Nella parte superiore di questa scheda sono disponibili opzioni di layout più interessanti che influiscono sul modo in cui viene applicata un'immagine di sfondo. Ad esempio, puoi fare in modo che un'immagine di sfondo inonda l'intero sito, o solo influire su una "tela"? area al di fuori del contenuto. Ho scelto quest'ultimo per mantenere le cose pulite, vedrai come funziona dopo.

Per aggiungere un'immagine di sfondo, scorri verso il basso fino alla sezione di seguito e carica un JPG. Hai piena libertà su come viene applicata l'immagine. Puoi affiancarla o posizionarla in un punto specifico usando le percentuali.

Ho caricato una sottile trama grigio scuro per aggiungere contrasto alla mia pagina. Ancora una volta, questo potrebbe aver allagato l'intero background, ma ho scelto di farlo affiancare al contenuto.

Cambiando i colori

Nella stessa scheda delle impostazioni precedenti puoi visualizzare e modificare le impostazioni del colore per ogni elemento del tuo sito. Questo è facile come trovare l'elemento in una lista e cambiare i valori dei colori.

Ad esempio, la modifica del colore di sfondo primario influisce sull'elemento del piè di pagina.Basta scegliere un colore in Photoshop, copiare i valori e premere Salva per vedere le modifiche.

Aggiungere sezioni

Fino a questo punto abbiamo appena apportato piccole modifiche al sito. È ancora abbastanza vicino a quello che abbiamo iniziato e non è così eccitante. Cambiamo questo aggiungendo alcune nuove sezioni.

Sotto la scheda Impostazione modello troverai un controllo che ti consente di trascinare nuove sezioni sul tuo sito. Il lato sinistro contiene le sezioni attualmente attive e le sezioni sul lato destro che è possibile aggiungere.

Cambiamo il nostro setup aggiungendo un fantastico? In primo piano? cursore nella parte superiore della pagina. Per fare ciò, è sufficiente trascinare le caratteristiche PageLines? scatola sotto la? navigazione? scatola nell'intestazione.

Con questa rapida aggiunta, improvvisamente il nostro sito sembra molto meglio di quando abbiamo iniziato. Ora abbiamo uno slider di immagini super fantasioso in alto con diversi spot completamente personalizzabili per immagini, testo e persino video. Tutto senza una sola riga di codice!

Ci sono diverse fantastiche sezioni predefinite con cui puoi davvero aumentare il fattore fantastico del tuo sito. Di seguito ho inserito un carosello di immagini Flickr nella parte inferiore della pagina. Altre sezioni ti permettono di aggiungere box, banner, link, navigazione breadcrumb e altro ancora.

Finendo

Con un po 'più di tweaking, il nostro originale blog noioso si trasforma in un sito elegante e moderno con molte funzionalità avanzate. Il risultato qui sotto ti porterà probabilmente a circa trenta minuti di lavoro una volta che ti sei abituato a come funziona il sistema e più come dieci o quindici minuti, una volta che sapevi come orientarti.

Pensieri di chiusura: dovresti provare Platform Pro?

Anche dopo questo drammatico cambiamento, ho comunque appena scalfito la superficie di ciò che Platform Pro può fare. Non abbiamo nemmeno discusso le opzioni HTML personalizzate, le miniature dei post, l'integrazione con i social media, i plug-in preconfigurati o tutta una serie di altre cose che non ho ancora scoperto!

Onestamente, sono stupefatto da questo prodotto e penso che potrebbe davvero togliere il dolore dalla personalizzazione di WordPress per molte persone. Sia che tu sia un designer alla ricerca di un sistema flessibile flessibile per impostare i tuoi clienti o solo un piccolo imprenditore che vuole ottenere di più da WordPress, Platform Pro è un affare per $ 95,00 (leggi la versione gratuita qui). Ci sono tonnellate di $ 50 e $ 30 sul mercato, ma non offrono un quinto della libertà che otterrete con Platform.

Per saperne di più, visita il sito Web Pagelines dove puoi vedere un elenco completo di funzionalità e persino un video del tema in azione. Lascia un commento qui sotto e facci sapere se hai provato Platform e cosa ne pensi. Assicurati inoltre di lasciare un link a prodotti simili che hai trovato per rendere WordPress più user friendly!