Archivi categoria: Aspetto

Impostazioni tema mobile

Nella bacheca del vostro blog, andando su MOBILE, cliccando su Mobile

mob

potrete personalizzare in toto il vostro tema mobile, ovvero come gli utenti vedono il vostro blog da smartphone. Vediamo nel dettaglio di cosa parliamo

Colori

mob1

Cliccando su seleziona colore potrete scegliere il colore della vostra testata, dello sfondo e dei link del vostro blog e scegliere tra migliaia di combinazioni di tonalità

Caratteri

mob2Cliccando sulla freccetta accanto al nome del carattere potrete personalizzare il font dei titoli e dei testi del vostro blog per il tema mobile. Sotto la barra di scelta potrete vedere un’anteprima del font.

Menù

mob5Spuntando “Attivi” potrete selezionare quale menù mostrare sul vostro tema mobile e se mostrare o no il pulsante “Ricerca”

Questi aspetti di personalizzazione sono comuni a tutti i temi. Ci sono poi delle caratteristiche presenti solo su alcuni temi

Slider (solo per alcuni temi)

mob3

Con questa impostazione potrete scegliere se avere o no lo slider attivo sul vostro tema, scegliere la categoria da inserire nello slider (tutte o una in particolare) e quanti articoli vedere scorrere

Immagine testata (solo per alcuni temi)

mob4

Potrete selezionare se avere o no attiva l’immagine di testata e caricarne una dal vostro pc

Dopo avere fatto tutte le vostre scelte di personalizzazione, cliccate in fondo su SALVA IMPOSTAZIONI. Potrete vedere un’anteprima del vostro tema nella maschera smartphone di lato.

I temi mobile per smartphone

Aumenta ogni giorno il numero di utenti che si approcciano al web tramite dispositivi mobili. Da qualche tempo, chi gestisce un blog Altervista, ha la possibilità di usare dei temi studiati appositamente per la visualizzazione da mobile. Temi che possono essere personalizzati per ottenere una grafica unica e originale. Grazie ai temi disegnati appositamente per questo scopo navigare il blog da smartphone è più facile e più divertente.

La visualizzazione del blog da dispositivi mobile è stata studiata per permettere di continuare a guadagnare, come accade nella versione desktop. Infatti nei temi per smartphone è possibile visualizzare i banner Altervista with Google Adsense. Valgono le stesse modalità di scelta sulla pubblicità: si può usare il pilota automatico, selezionare i banner e i circuiti o scegliere di non avere pubblicità.

Dal punto di vista tecnico la nuova versione mobile del blog WordPress su Altervista sostituisce e migliora la precedente installazione del plugin WpTouch, che ora è stato disabilitato.

Selezionare e attivare i temi per smpartphone

Dal menu della dashboard clicca su Mobile -> mobile

mobile

Clicca su Attiva mobile, per iniziare

mobile 2

Spostiamoci sulla seconda voce Mobile->Temi, dove potremmo scegliere il tema da utilizzare

I temi disponibili sono:

1) CMS

mobile 1

Utilizzando questo tema potrai personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole, impostare un’immagine di testata e selezionare il menu da visualizzare.

2) MAGAZINE

mobile 3

Utilizzando questo tema potrai personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, impostare un’immagine di testata e selezionare il menu da visualizzare.

3) BAUHAUS

mobile 4

Utilizzando questo tema potrai personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

4) CLASSIC REDUX

mobile 5

Utilizzando questo tema potrete personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

5) WIDE

mobile 6

Utilizzando questo tema potrai personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo e selezionare il menu da visualizzare.

6) MINIMAL

mobile 8

Utilizzando questo tema potrai personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, impostare un’immagine di testata e selezionare il menu da visualizzare.

7) SIMPLE

Utilizzando questo tema potrete personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

8) OCEAN

Utilizzando questo tema potrete personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

9) iCOOK

Utilizzando questo tema potrai personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, impostare un’immagine di testata e selezionare il menu da visualizzare.

10) FOODY

Utilizzando questo tema potrai personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, impostare un’immagine di testata e selezionare il menu da visualizzare.

11) SMART MAG

Utilizzando questo tema potrete personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

12) FASHION

Utilizzando questo tema potrete personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

13) EASY BLOG

Utilizzando questo tema potrete personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

14) Le buone ricette (Mobile e Desktop) SOLO PER BLOG GIALLOZAFFERANO

Sono due temi che ricalcano lo stile del sito di cucina più famoso d’Italia. Nel tema mobile  potrete personalizzare i colori di testata, sfondo e link, i caratteri di titoli e testo, usare uno slider scorrevole e selezionare il menu da visualizzare.

Dopo avere scelto il tema preferito e dopo averlo personalizzato, clicca su SALVA LE MODIFICHE.

Come avrai notato, sulla pagina di IMPOSTAZIONI MOBILE è possibile vedere un’anteprima di come viene visualizzato il blog su smartphone.

Il tema grafico

Un tema di WordPress è un raccolta di file che lavorano insieme per produrre l’interfaccia grafica, il design di un blog.
Attualmente AlterVista offre una scelta di oltre 200 temi, in una galleria in continua crescita. È molto semplice visualizzare un’anteprima, a grandezza reale, del tema e attivarlo sul proprio blog. Puoi cambiare tema tutte le volte che vuoi.

Ecco alcuni esempi di temi WordPress:

Gestione temi

Per gestire il tema del blog clicca su “Aspetto” nel pannello di controllo di WordPress:

altervista-aspetto-temi

Viene visualizzato il tema attivo, clicca su “dettagli del tema” per maggiori informazioni:

altervista-tema-wordpress-attivo

Nella descrizione del tema sono presenti le tag che lo caratterizzano, possono essere utili per cercare altri temi simili.

Navigazione e ricerca temi

Per visualizzare nuovi temi cliccare in alto nella pagina: “Aggiungi nuovo“:

altervista-tema-aggiungi

Così si arriva alla pagina dove sono presenti tutti i temi disponili.

Per navigare tra i temi puoi cliccare su “Tutti i temi” o “Nuovi“.

installa-temi-wordpress-altervista

Per cercare un nuovo tema clicca su “Cerca“:  puoi inserire delle chiavi di ricerca, per termine o per tag (vedi sopra, descrizione del tema).

installa-temi-altervista-cerca

Se stai cercando un tema con caratteristiche specifiche puoi filtrare la ricerca sulla base del colore o dell’impaginazione.

Cambiare/Attivare temi

Navigando tra i temi qualcuno ti colpirà più di altri e quando ti sembra di aver trovato quello che fa per te puoi installarlo immediatamente sul tuo blog: clicca su “Installa

altervista-installa-tema

Comparirà una pagina per confermare la tua scelta, clicca su “Attivaper proseguire.
In pochi istanti il tema viene attivato e puoi proseguire a personalizzarlo (vedi widget e plugin) o iniziare a scrivere e pubblicare.

Se vuoi vedere che effetto fa a grandezza naturale un tema prima di attivarlo clicca su “Anteprima“: comparirà una pagina con il tema navigabile che ti permette di farti un’idea più precisa del suo aspetto e delle sue funzioni.
Per attivare il tema clicca su “Installa“.
Per tornare alla galleria dei temi chiudi l’anteprima cliccando in alto a sinistra il pulsante “Chiudi“.

Puoi fare tutti i tentativi che vuoi. Per cambiare il tema in uso non è necessario disattivarlo, basta scegliere un altro tema e cliccare su “Installa“.

I temi che hai già “usato” sul tuo blog rimarranno nella galleria che si apre cliccando su “Aspetto” dalla dashboard di WordPress (la pagina di gestione temi).

Personalizzare la testata dei temi

Molti temi di WordPress permettono di personalizzare facilmente la testata del proprio blog caricando un’immagine dal proprio computer. Leggi qui per scoprire come fare.

Edita il CSS dei temi

Con WordPress installato su AlterVista non ci sono limiti di personalizzazione del CSS dei temi, non è necessario nessun upgrade del tuo account per editare liberamente il foglio di stile del tuo tema. Vai a edita il CSS.

Ricerca di un nuovo tema grafico

WordPress dispone di un sistema integrato di ricerca, selezione e installazione di nuovi temi. L’archivio di Altervista dispone di centinaia di temi di ogni genere e grafica per tutte le esigenze.

Installare un nuovo Tema

Vai in Aspetto > Temi, e clicca in alto “Aggiungi nuovo“.

altervista-tema-aggiungi
Clicca sulla voce di menù “Cerca” per visualizzare la pagina di ricerca.

altervista-cerca-tema-wordpress

Puoi cercare i temi in base ad alcuni criteri:

  • Ricerca termine – Inserisci un termine di ricerca: solitamente se conosci il nome del tema con questa modalità puoi capire subito se il tema richiesto è disponibile
  • Filtro funzionalità – Specifica un criterio fra quelli disponibili:
    Colori, Layout (numero di colonne e larghezza), Funzionalità e numero di posizioni pubblicitarie supportate dal tema

Quando sei deciso di installare un tema puoi vedere un’anteprima cliccando su “Anteprima“. Per installare il tema immediatamente  clicca su “Installa adesso“:

altervista-installa-tema-adesso

Nella pagina successiva di conferma installazione, clicca su “Attiva” per attivare il nuovo tema grafico sul tuo blog.
Se desideri installare il tema ma non attivarlo immediatamente clicca su “Ritorna all’installatore di temi”: il tema verrà installato ma non attivato.

Personalizzare la testata del tema grafico

Nella maggior parte dei temi puoi modificare la testata grafica del tuo blog.

Vai in Aspetto e controllare se nel menù è presente la voce “Testata”: se vedi la voce di menù “Testata” allora significa che il tema permette la modifica dell’immagine o di altri elementi in testata.

altervista-testata-tema

Nella sezione di configurazione dell’immagine in testata ci sono alcune funzionalità comuni a tutti i temi, vediamole brevemente

  • Carica una immagine – Con il bottone “Scegli file” puoi selezionare un’immagine caricandola dal tuo computer; leggi le note riportate nel tema perché dovrai rispettare le dimensioni indicate e richieste per ottenere un risultato grafica più preciso (utilizza immagini mediamente compresse e in formato JPG)
  • Seleziona un’immagine dalla libreria media – puoi selezionare una tra le immagini disponibili nella libreria media del tuo blog
  • Rimuovi immagine – cancella l’immagine caricata in precedenza
  • Azzera immagine – cancella la tua immagine e imposta quella predefinita del tema

altervista-immagine-testata-wordpress

Altre opzioni che potrebbero essere disponibili per il tema sono relative alla presenza o meno di un testo sopra l’immagine della testata e la possibilità di impostare un colore per il testo stesso:
altervista-opzioni-testata-wordpress

Il testo che verrà riprodotto sopra l’immagine è la descrizione del blog che hai configurato in Impostazioni -> Generale -> Motto

Clicca su “Salva le modifiche” per confermare e pubblicare le nuove impostazioni.

Modificare i CSS e il codice del tema grafico

Il WordPress installato su altervista.org permette una gestione completa dei temi e dei codici stili CSS dei temi installati.

Vai in Aspetto -> Editor; il primo caricamento dell’editor visualizza il file predefinito style.css, nella maggior parte dei temi questo file rappresenta il file più importante per la gestione degli stili del tema:

modifica-css-altervista-wordpress2

Dal menù a tendina (1) “Selezionare il tema da modificare:” puoi scegliere quale modificare fra tutti i temi installati.

Dal menù laterale (2) di destra puoi accedere a tutti i files presenti nel tema e che puoi selezionare e modificare.

Considera che il 99% della grafica di un qualsiasi tema è completamente controllabile e personalizzabile tramite la modifica del file CSS principale (style.css).
Nonostante questo puoi accedere agli altri file con estensione php se hai la necessità di apportare correzioni particolari e avanzate.

Alcuni riferimenti per approfondire la conoscenza dei linguaggi HTML e CSS:

Guida HTML Base
Guida CSS Base

Aggiungere e rimuovere un Widget dal tema grafico

I Widget sono uno strumento per ampliare e arricchire le Sidebar (barre laterali) del tuo blog. Le aree Widget disponibili possono trovarsi anche nel Footer (piè di pagina) o nel Header (testata del blog)

Con i Widget puoi aggiungere,  configurare o rimuovere del contenuto dalla barra laterale e nelle altre sezioni che compongono il tema del tuo blog. Permette di organizzare i contenuti e di rendere facile la navigazione ai tuoi utenti fra i tag, le categorie e gli archivi del blog.

Puoi accedere alla pagina di gestione dei Widget dal menù  “Aspetto > Widget“:

altervista-widget-wordpress

Aggiungere un Widget

Aggiungere un widget è un processo estremamente semplice:
basta cliccare sul titolo del Widget presente nell’area “Widget disponibili” a sinistra, scegliere la sidebar di destinazione (se ne è presente più di una) e poi cliccare sul pulsante “Aggiungi” (ricorda che la disponibilità o meno delle sidebar dipende dalla struttura del tema che stai utilizzando):

aggiungi-widget-altervista

 

Un altro modo per aggiungere un widget è quello di cliccare (senza rilasciare) su uno dei widget disponibili e trascinare con il mouse il widget selezionato all’interno dell’area di una delle sidebar disponibili:

trascina-widget-wordpress

Configurare un Widget

Nella maggior parte dei casi ogni widget richiede la configurazione di alcuni dati che variano in base alle sue funzionalità, mentre altri non necessitano di nessun parametro.

Appena posizionato all’ interno della sidebar il widget apre automaticamente la finestra di configurazione dove potrai inserire i valori richiesti; nel caso in cui dovessi modificare questi dati successivamente ti basterà cliccare sulla freccia posta a destra del widget per aprirla nuovamente.

configura-widget

Rimuovere un Widget

Se vuoi rimuovere un widget basta cliccare su “Cancella” e il widget come per magia scomparirà dalla sidebar:

cancella-widget

Widget non supportati

Alcuni temi  non supportano le sidebar dinamiche e questo purtroppo non permette l’inserimento dei widget, in questo caso comparirà un messaggio di questo tipo:

altervista-no-widget

Creare un menu personalizzato e a tendina

I menu personalizzati permettono di creare un elenco di voci da visualizzare come menu di navigazione nella testata o in una sidebar (barra laterale) del blog.

Per creare un menu vai in Aspetto > Menu e clicca su “Crea un nuovo menu”.
Nel caso esista già un menu predefinito, possiamo modificare le voci esistenti e aggiungerne nuove.

crea-menu1

Inserisci il nome del menu nel campo “Nome menu” e clicca il bottone “Creazione menu”:

crea-menu2b

I menu possono contenere link a pagine e categorie presenti nel blog, o link personalizzati.

Dopo aver creato il menu, ti basterà aggiungere una degli elementi presenti nella barra di sinistra e cliccare su “Aggiungi al menu”, così da popolarlo con tutti gli elmenti di cui hai bisogno:

crea-menu3

Se hai molte categorie e pagine puoi fare una ricerca cliccando sull tab “Cerca”, oppure ordinarle per elementi più recenti e più utilizzati.

Puoi inserire direttemente un link personalizzato a una pagina, cliccando sul box “Link” e inserendo URL o indirizzo della pagina:

crea-menu4

Aggiungere e modificare le voci di menu

Per aggiungere o modificare delle voci già inserite basta cliccare sulla freccia a destra dell’elemento,  così potrai accedere all’impostazione della voce e modificarla ulteriormente oppure rimuoverla cliccando su “Rimuovi”:

crea-menu5b

Cambiare l’ordine delle voci dei menu

Puoi modificare la gerarchia delle singole voci presenti nei menu.
Ricorda che i menu personalizzati possono essere utilizzati oltre che come widget anche come elementi del menu principale del tuo blog, in questo caso devi assicurarti che il tema supporti questa funzionalità.

Per modificare la struttura ad albero delle voci basta cliccare senza rilasciare il mouse e trascinare la voce di menu nella posizione desiderata:

crea-menu6

Alcuni temi supportano più di un menu nel layout:  nelle “Impostazioni del menu“, puoi scegliere la posizione del tema e quale menu impostare come navigazione principale:

crea-menu7

Creare un menù a tendina

Sui blog è possibile creare menù a tendina, ovvero voci di menù sulle quali, passando il mouse o cliccandoci su, si aprono delle tendine con altre voci. Creare menù a tendina è semplicissimo: una volta che avrete posizionato sul vostro menù le varie voci, come è spiegato nei passaggi precedenti, non dovrete fare altro che spostare le voci della “tendina” trascinandole di qualche centimetro verso destra col mouse, fino a che non si formeranno dei rettangoli tratteggiati: a quel punto rilasciate. Fate questa operazione per tutte le voci che vorrete inserire nella tendina (potete inserire tutte le voci che volete). A fine operazione salvate

menù

VIDEO TUTORIAL

Rimuovere i Widget di partenza

Puoi gestire i widget del tuo blog cliccando “Aspetto > Widget” della dashboard (pannello di controllo) di WordPress:

menu-widget

Rimuovere i widget di partenza

Anche se non hai ancora aggiunto nessun widget, alcuni temi  prevedono dei widget già attivi in partenza (di default). I widget di partenza più comuni sono il widget “Archivi”,  “Articoli Recenti” e “Meta”.

I widget di partenza sono presenti nel codice del tema e non sono visibili nell’area di gestione dei widget, che risulterà vuota.
Per rimuoverli basta trascinare e aggiungere un widget a nostra scelta nella sidebar o in un’altra area widget disponibile, che andrà a sostituire i widget di partenza del tema:

aggiungi-widget

Per sapere come aggiungere, configurare e rimuovere un widget leggi questo articolo:
Aggiungere e rimuovere un Widget dal tema grafico

Se invece vogliamo rimuovere i widget di partenza e lasciare vuota un’area widget, possiamo inserire solo il widget “Testo” nella sezione che desideriamo svuotare e  salvare lasciando vuoto il campo di testo: quella sezione comparirà vuota nella visualizzazione del blog.

Un’altra possibilità è modificare il codice sorgete del tema (solitamente i widget attivi di partenza sono presenti nel template sidebar.php): per effettuare operazioni del genere è consigliabile avere dimestichezza ed esperienza di programmazione o web design. Senza questa confidenza è consigliabile utilizzare l’interfaccia drag and drop (trascina e rilascia) come descritto sopra.

Il Widget Link

Il widget Link è un box che raccoglie una lista dei tuoi link di siti web e blog preferiti. Comunemente questo tipo di widget viene anche chiamato “blogroll”:

altervista-link1

Creare un widget link

Per creare un widget di link da inserire nella tua sidebar vai in Aspetto -> Widget.
Trascina il widget nella sidebar
o in un’area widget disponibile nel tema, e configura queste opzioni:

altervista-link2

  • Tutti i link – Scegli se visualizzare nel box tutti i link oppure solo una categoria specifica di link
  • Mostra immagine link – Mostra il link sotto forma di immagine (appositamente configurata dalla gestione dei link, vedi: Guida Creazione link)
  • Mostra nome link – Mostra il link sotto forma di testo
  • Mostra descrizione link – Mostra la descrizione del link inserita dalla gestione dei link
  • Mostra valutazione link – Mostra la valutazione del link
  • Numero di link – scegli quanti link visualizzare