LEZIONI LIVE...(one to one) con il Docente tramite SKYPE e Software di controllo a distanza del Computer... CONTATTA Corsi di informatica online CLICCA QUI 

Creare un Tema WordPress con Bootstrap

bootstrap per wordpressUn saluto a tutti gli utenti del nostro portale. In questo breve tutorial vedremo come creare un tema grafico con WordPress partendo dalle librerie del Framework Bootstrap (Bootstrap per wordpress). Diciamo subito che Bootstrap è un ambiente di sviluppo che mette a disposizione una serie di strumenti (librerie) che ci aiutano a comporre facilmente Template per siti web sia per quanto riguarda i siti web statici in HTML che per i CMS più utilizzati come Drupal, Joomla e WordPress. Nella guida in questione analizzeremo il Framework applicato al CMS WordPress. Vedremo in seguito in un tutorial futuro, la stessa applicazione per Drupal.I vantaggi di Bootstrap sono sommariamente:

  • Facilità di utilizzo e personalizzazione.
  • Struttura leggera che incide sulla velocità di caricamento del sito web con immediati benefici in termini di SEO.
  • Struttura Responsive del Tema che ottimizza la visualizzazione su ogni dispositivo: Computer, Smartphone, Tablet.
  • User friendly dal punto di vista SEO e dunque appetibile ai motori di ricerca tra cui Google.

Bootstrap è stato creato da team del social network Twitter e si è deciso di rilasciare gratuitamente tutto il codice di sviluppo a disposizione della comunità di internet. Viene oggi utilizzato in gran parte dei temi distribuiti in rete e non ha nulla da invidiare (con elementi di indubbia superiorità) a temi grafici a pagamento.

Per il nostro lavoro utilizzeremo un tema grafico base messo a disposizione da team di Automattic, la società che ha realizzato WordPress. Il tema grafico di base si chiama “Underscores” definito anche con “_S“.

 

Scarichiamo il tema da:

http://underscores.me/

E’ un tema basico, estremamente povero di script, css etc e proprio per questo altamente configurabile in base alle nostre necessità.

La prima cosa da fare è assegnare un nome al nostro tema (è dunque possibile personalizzare anche questo importante aspetto che si rivela nel codice html della pagina web) e cliccare sul pulsante “Generate”, come mostrato nella Figura 1

Bootstrap per wordpress
Figura 1 – Assegnare un nome al Tema e cliccare sul pulsante “GENERATE”

Dopo aver attivato il tema si presenterà un tema basico, povero di css e altri elementi come mostrato nella Figura 2

Bootstrap per wordpress
Figura 2: tema base bootstrap

A questo punto scarichiamo il framework Bootstrap dal link:

http://getbootstrap.com/customize

E’ possibile da questa pagina già personalizzare la nostra installazione di bootstrap, includendo librerie jquery (di cui bootstrap è composto) o personalizzando elementi css come ad esempio il colore di sfondo o altri elementi del file css. Il programma online compilerà tutto e ci restituirà il framework bootstrap da istallare all’interno di wordpress.

Noi lasciamo tutte le impostazioni di default selezionate e procediamo al download in basso nella pagina.

Questo file compresso in formati .zip deve essere scompattato e caricato via FTP all’interno del tema base che abbiamo precedentemente installato in wordpress.

Ora ci sono vari modi per includere Bootstrap all’interno del nostro tema. E’ possibile utilizzare un metodo manuale operando nel codice della più importante funzione di WordPress “functions.php” oppure, un metodo più facile installando un plugin che ci semplificherà tale operazione (noi utilizziamo questo secondo metodo).

Dall’archivio dei plugin scarichiamo e installiamo:

WordPress Twitter Bootstrap CSS

Nelle impostazioni del plugin procediamo come nella Figura 3, attivando anche il supporto per l’inclusione librerie Javascript che si trova più in basso e non è visibile nell’immagine successiva:

bootstrap per wordpress
Impostazioni del Plugin

VUOI APPROFONDIRE L’ARGOMENTO?
CHIEDI  INFORMAZIONI SULLA VIDEO GUIDA IN MP4: COME CREARE UN TEMA PER WORDPRESS CON BOOTSTRAP

CON ASSISTENZA E ATTESTATO FINALE – (Guarda l’anteprima della video guida – Primi 2,07 minuti)

bootstrap per wordpress
Bootstrap per wordpress

Bootstrap per wordpress

TUTTE LE LEZIONI SONO DISPONIBILI PER IL DOWNLOAD DOPO L’ACQUISTO DELLA VIDEO GUIDA BOOTSTRAP PER WORDPRESS. La guida comprende anche l’eBook WordPress e l’eBook Firebug)

 

Se hai bisogno di ulteriori informazioni utilizza il form in basso. Oppure clicca sul pulsante di PayPal per procedere all’acquisto.

€ 30,00 (in PROMOZIONE PER POCHI GIORNI – Video Guida Bootstrap + eBook WordPress + eBook Firebug)

Pagamenti sicuri tramite la piattaforma PayPal

Effettua il pagamento con PayPal cliccando sul pulsante “Paga Adesso” ***IMPORTANTE*** Invieremo tutti i dati per accedere all’area riservata (e fruire delle lezioni o degli Ebook) all’indirizzo email indicato nel modulo PayPal – Successivamente al pagamento provvederemo a configurare l’area riservata. Riceverai una E-mail con tutte le istruzioni per l’accesso alla piattaforma e-Learning del portale. All’interno del modulo PayPal ricordati di specificare gli estremi per la fattura, se sei un privato metti il codice fiscale o una Partita Iva negli altri casi. Se vuoi indicarci un altro indirizzo email dove ricevere i dati, al termine della procedura di acquisto sarai reindirizzato in automatico alla pagina di ringraziamento dove potrai lasciare la tua email e altri dati anagrafici. In alternativa puoi inviare un messaggio tramite il Form contatti del sito.
Inviando il modulo ed effettuando il pagamento si autorizza al trattamento dei dati personali in base alla normativa sulla Privacy vigente. I dati possono essere utilizzati solo dallo Studio Progettimultimediali.com

 


Il tuo nome (richiesto)

La tua email (richiesto)

Il tuo messaggio (richiesto)

Inserisci il codice
captcha

Unisciti agli iscritti…Non riceverai spam! e i tuoi dati verranno trattati secondo la normativa sulla privacy vigente

Articolo letto (686) volte

Sono Daniele Venditti (Responsabile di Progettimultimediali.com e Corsi-online.it) mi occupo di formazione informatica dal 2001. Ho conseguito anni di specializzazione in sviluppo siti web con una serie di studi predisposti alle nuove tecnologie…. ho svolto dal 2001 ad oggi più di 8.000 ore di corsi tra preparazione al conseguimento della patente europea del computer (anche come esaminatore AICA) e corsi specifici di grafica web e corsi multimediali. Ho lavorato per grandi società del settore informatico come la Zucchetti Formazione (Milano – Perugia – Frosinone), Media e Services (Frosinone), Scuola di Formazione (Frosinone), e collaborato con scuole di formazione pubbliche nel settore della new ecomomy per la formazione finanziata da fondi regionali e comunitari. Ho dunque maturato una vasta esperienza nella realizzazione di siti web, produzioni multimediali come grafica e video on-line. Ritengo la Formazione online un aspetto essenziale per l'accrescimento professionale.

Comments

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>