Come impostare lo sfondo dell'immagine su WordPress

Esistono altri modi per aggiungere immagini di sfondo in WordPress. Da base a più avanzato con modifica del codice del tema. Tuttavia, siamo lieti di presentare uno strumento di facile utilizzo ideale per gli amministratori di siti Web senza conoscenze di codifica e progettazione. plug-in Citadela Pro viene fornito con molte funzionalità e impostazioni per la personalizzazione del sito web.

Provate i potenti blocchi, le impostazioni e le funzionalità del plugin Citadela Pro. È possibile esplorare lo strumento perfetto che consente di aggiungere immagini di sfondo a pagine, post e tipi di post personalizzati di WordPress.

Il Cluster è un blocco di Gutenberg in WordPress che ti consente di aggiungere un'immagine di sfondo. L'elemento multifunzionale ti consente di cambiare lo sfondo di WordPress dal suo valore predefinito. Non solo puoi aggiungere un'immagine di sfondo, ma puoi anche combinarla con altri blocchi. Ottieni molte varianti e versatilità.

In combinazione con il Blocco del titolo della pagina, ottieni facilmente un sito Web dall'aspetto favoloso. Puoi aggiungere più blocchi Gutenberg e personalizzare l'immagine di sfondo in WordPress. Inoltre, puoi salvare una serie di blocchi come blocchi riutilizzabili e aggiungere un tema ovunque sul tuo sito web. Quindi puoi cambiare il sito Web di WordPress in background in una sola volta.

Come aggiungere un'immagine di sfondo in WordPress usando il blocco Gutenberg

Immagine di sfondo di WordPress tramite il blocco Cluster

Ti presentiamo il pratico blocco che abbiamo creato per il blocco Gutenberg di WordPress per l'immagine di sfondo: blocco cluster. Fa parte del nostro gruppo di blocchi. Il plugin Citadela Pro ha molte funzionalità per aiutarti a creare un bellissimo sito web. Tutti i blocchi personalizzati AitThemes sono disponibili in plug-in Citadela Pro.

Si prega di leggere Documentazione del blocco cluster per le impostazioni dettagliate.

Il blocco cluster consente di raggruppare più blocchi in uno solo. Puoi lavorare efficacemente con l'intero gruppo in cluster poiché era un blocco. La larghezza del cluster può essere impostata sulla larghezza della pagina intera, il che significa che hai uno spazio molto ampio per aggiungere vari blocchi.

Il cluster non si estenderà a tutta larghezza se:

• Hai una barra laterale attiva
• Se utilizzi colonne che limiteranno lo spazio per Cluster

Poiché alcuni dei blocchi principali di WordPress possono essere allineati solo alla larghezza del contenuto, il blocco Cluster offre una maggiore variabilità nella creazione del tuo sito web. Una grande caratteristica è anche che puoi impostare su WordPress un'immagine di sfondo, cambiarne il colore o impostare la sovrapposizione dell'immagine di sfondo. Lo sfondo può quindi essere configurato per il design del sito web.

In questo articolo ti mostreremo:

• Come aggiungere il blocco Cluster all'editor di WordPress
• Raggruppamento all'interno di Cluster
• Impostazioni di base nella barra degli strumenti
• Colore dell'intestazione e del separatore
• Come aggiungere un'immagine di sfondo sotto i blocchi raggruppati
• Cos'è la sovrapposizione di sfondo
• Qual è la differenza tra il blocco Group e il blocco Ait Cluster

Come aggiungere il blocco Cluster

Il blocco cluster è un blocco premium ed è disponibile solo se lo installi e lo attivi Plug-in Citadela Blocks. Dopo aver installato il plug-in, il blocco Cluster verrà automaticamente aggiunto all'editor di blocchi di WordPress e potrai iniziare immediatamente a lavorarci.

Il blocco cluster può essere aggiunto sia nei post che nelle pagine. Basta fare clic sul segno "+" nella barra in alto o in qualsiasi punto del desktop dell'editor. Dopodiché basta cercare il blocco Cluster.

La seconda opzione per aggiungere il blocco Cluster consiste nel digitare "/" seguito dal nome del blocco. Il blocco cluster è quindi pronto per l'uso.

Raggruppamento di blocchi utilizzando Cluster

La caratteristica principale del blocco Cluster è raggruppare più blocchi in uno solo. Diamo un'occhiata a come funziona. Se inserisci il blocco Cluster nella tua pagina, vedrai immediatamente un segnaposto "Inserisci più blocchi qui". Se fai clic su di esso, otterrai un elenco di tutti i blocchi disponibili. Puoi anche cercare il blocco richiesto utilizzando la barra di ricerca nella parte superiore dell'elenco.

Tutti i blocchi nidificati avranno tutte le opzioni e le impostazioni predefinite disponibili. Ad esempio, se inserisci il blocco Immagine, avrai la possibilità di caricare l'immagine o di selezionarla dalla Libreria multimediale.

Usando il blocco Cluster puoi ad esempio creare una sezione accattivante sul tuo sito web per presentare il tuo lavoro recente. Aggiungi immagini dal tuo portfolio e poi imposta l'immagine di sfondo sotto di essa. Hai appena creato un bel link al tuo portfolio.

Il blocco cluster può essere utilizzato anche per creare un'attraente presentazione del prodotto. Puoi impostare l'immagine del prodotto come sfondo della sezione e sceglierne il colore. Blocco servizi può anche essere annidato all'interno del blocco Cluster.

Più blocchi in uno solo

Se desideri aggiungere più blocchi nidificati in Cluster, puoi utilizzare il blocco Colonne. Usando Blocco colonne puoi aggiungere più blocchi affiancati. Ogni colonna può avere un tipo di contenuto diverso, come immagine, paragrafo, elenchi o pulsante.

Un tipico esempio di più colonne in combinazione con il blocco Cluster è un sito Web di una pagina.

Impostazioni di base nella barra degli strumenti: opzioni di allineamento del contenuto

Per impostazione predefinita, la larghezza del blocco del cluster è impostata sulla dimensione del contenuto. È possibile modificare questo comportamento nella barra degli strumenti. Sono disponibili le seguenti opzioni:

• Dimensione contenuto: opzione predefinita, il blocco Cluster ha la stessa larghezza del contenuto.
• Dimensione ampia: il contenuto all'interno del cluster è più largo della larghezza del contenuto.
• Dimensione a larghezza intera: in questo caso la larghezza del cluster è da un lato all'altro della finestra del browser.

È importante notare che questa impostazione avrà effetto solo sul contenuto del cluster se il tema attualmente attivo lo supporta. Tutti i blocchi nidificati possono essere configurati in base alla disponibilità delle loro opzioni.

Impostazioni colore intestazione e separatore

Cambio di colore dell'intestazione

Dal WP 5.3 puoi cambiare il colore della tua intestazione attraverso il blocco di intestazione. Questa è una funzione molto utile, specialmente se hai un layout e una combinazione di colori scuri, è meglio cambiare il colore del testo predefinito (che è nero) con un colore più chiaro.

Non è stato possibile cambiare il colore dell'intestazione fino alla nuova versione, ciò ha causato problemi con la sua visibilità su una base scura. Pertanto è capitato spesso che l'intestazione si fondesse con l'immagine o la foto di sfondo di WordPress che hai aggiunto. Ora puoi scegliere il colore dell'intestazione giusto per far risplendere il tuo sito.

Nuovo colore per Separator utilizzato sul tuo sito web

Quando aggiungi al tuo WP un'immagine di sfondo o qualsiasi altro tipo di contenuto, a volte potrebbe essere necessario separarlo dal resto del sito web. A tale scopo è possibile utilizzare un blocco speciale chiamato Separatore. Inserendo Separator puoi:

• Separare blocchi specifici
• Dividi l'intero testo in sezioni più piccole
• Evidenzia le parti importanti
• Garantire una migliore leggibilità dei contenuti
• Semplifica la navigazione sul tuo sito web

Inoltre ora puoi cambiare il colore della linea di separazione con il WordPress aggiornato. Separatore colorato è perfetto per completare la combinazione di colori del tuo sito web.

Come aggiungere un'immagine di sfondo sotto i blocchi raggruppati

Il vero potere del blocco Cluster è che puoi aggiungere un'immagine di sfondo e impostare il colore di sfondo sotto i blocchi raggruppati. Tutto può essere configurato facilmente all'interno dell'ispettore di WordPress. Diamo un'occhiata a come farlo.

1. Fare clic su Immagine di sfondo e attivare la funzione "Mostra immagine di sfondo".
2. Fare clic su "Seleziona immagine". Si aprirà la Libreria multimediale. Puoi selezionare un'immagine esistente o caricare una nuova immagine nella tua libreria.
3. L'immagine di sfondo può anche essere impostata su fissa. Significa che se scorri la pagina, lo sfondo non si sposterà con il contenuto e la sua posizione verrà fissata.
4. Puoi anche scegliere quale parte dell'immagine di sfondo deve essere mostrata usando "Selettore punto focale". È anche possibile scegliere una parte dell'immagine utilizzando la percentuale.

Sovrapposizione di sfondo

Una delle opzioni avanzate in Cluster è Sovrapposizione immagine di sfondo. Puoi scegliere uno dei colori predefiniti o selezionare un colore personalizzato utilizzando il selettore di colori. È anche possibile impostare l'opacità del colore. Queste impostazioni del blocco cluster ti aiutano a creare una presentazione del sito Web davvero attraente.

Nuovo blocco di gruppo disponibile nel core

Qual è la differenza tra il blocco Group e il blocco AitThemes Cluster?

Il nostro blocco Cluster personalizzato è stato rilasciato prima del blocco Group e fornisce una soluzione più complessa. È possibile utilizzare il blocco di gruppo per raggruppare più blocchi, ma ha ancora funzioni limitate. Ad esempio, non sei in grado di impostare la sovrapposizione di colori nel blocco: puoi solo scegliere il colore di sfondo di base che sarà intorno all'immagine, non sopra di essa.

La modifica delle immagini di sfondo è un gioco da ragazzi nel nostro blocco Cluster.

Puoi caricare l'immagine di sfondo di WordPress, impostare il colore di sfondo e anche la sovrapposizione del colore di sfondo (e personalizzare anche l'opacità della sovrapposizione!). Ci vogliono solo pochi minuti.