Per molti appassionati di WordPress, la possibilità di aggiungere un pulsante sopra un'immagine è essenziale per rendere i contenuti più interattivi e attraenti. Le motivazioni possono derivare dal desiderio di arricchire le interazioni con gli utenti, di sfruttare le capacità di WordPress o di risolvere i limiti dei temi o dei plugin. Sia che si tratti di migliorare la navigazione degli utenti, di superare le sfide del layout o semplicemente di abbracciare le moderne tendenze del web design, questa funzione potrebbe aiutare gli utenti ad affrontare le sfide del layout o ad adottare le moderne tendenze del design senza richiedere competenze avanzate.
Fortunatamente, il blocco Cover integrato di WordPress rende il processo semplice e accessibile. In questa guida vi mostreremo come realizzarlo passo dopo passo.
Passo 1: Aggiungere un blocco di copertura
Per iniziare, aprire la pagina o il post in cui si desidera inserire l'immagine preferita con il pulsante. Nell'editor di WordPress, fare clic sul pulsante "+" per aggiungere un blocco e cercare "Cover". Una volta trovato, selezionare il blocco Cover.
Passo 2: Inserire un'immagine
Una volta aggiunto il blocco, occorre caricare l'immagine scelta o sceglierne una dalla Biblioteca multimediale. Questa immagine servirà ora da sfondo per il vostro progetto.
Passo 3: Aggiungere un titolo all'immagine (facoltativo)
Una volta posizionato il blocco di copertina, si noterà un testo segnaposto che dice "Scrivi titolo..." all'interno dell'immagine. Fare clic su questo testo e digitare il titolo o l'intestazione che si desidera visualizzare sull'immagine.
Passo 4: Aggiungere un pulsante sopra l'immagine
Una volta che il blocco di copertina è pronto, fare clic sull'immagine e apparirà l'inseritore di blocchi. A questo punto, fare clic sul segno '+', cercare "Pulsanti" e aggiungere il blocco.
Passo 5: personalizzare il design
Per mettere a punto ogni dettaglio, abbiamo separato questa sezione in 3 parti. Inizieremo con il titolo, poi con i pulsanti e termineremo con il blocco complessivo della copertina per ottenere un aspetto professionale.
5.1 Personalizzazione del testo del titolo
Fare clic sul testo inserito come titolo nel blocco Copertina per selezionarlo. Utilizzare la barra degli strumenti del blocco per regolare lo stile del testo: grassetto, corsivo o allineamento. Se si desidera un'ulteriore personalizzazione, andare alle impostazioni del blocco nella barra laterale di destra per modificare la dimensione del carattere, il colore e la tipografia.
5.2 Personalizzazione del pulsante
Selezionare il blocco pulsante, digitare il testo che si desidera visualizzare e collegarlo alla pagina o all'URL pertinente facendo clic sull'icona della catena. (1) nella barra degli strumenti. Utilizzare la barra degli strumenti del blocco per allineare il pulsante e regolarne lo stile.
A questo punto, passare al pannello delle impostazioni del blocco sul lato destro. Il pannello Scheda Generale (1) consente di regolare la larghezza del pulsante rispetto al suo contenitore, mentre l'opzione Scheda Stili (3) consente di personalizzare gli stili, i colori, la tipografia, le dimensioni e il bordo del pulsante.
5.3 Personalizzazione del blocco di copertura complessivo
Fare clic sul blocco Cover per accedere alle sue impostazioni nella sezione Scheda Generale. Da qui, regolare il Impostazioni di layout per vincolare i blocchi nidificati, attivare l'opzione Sfondo fisso per mantenere lo sfondo fermo durante lo scorrimento o il tasto Sfondo ripetuto se l'immagine è più piccola del blocco e deve essere affiancata per riempire lo spazio, e impostare il parametro Punto focale per mantenere visibili le aree importanti dell'immagine.
Successivamente, passare alla sezione Scheda Stili. Da qui è possibile regolare il colore generale, l'opacità, la tipografia, la dimensione, il rapporto d'aspetto, il bordo e altro ancora.
Fase 6: Anteprima e pubblicazione
Esaminare nuovamente l'intera pagina per assicurarsi che sia il pulsante che l'immagine appaiano come previsto. Quando tutto sembra a posto, pubblicare o aggiornare il contenuto per renderlo attivo.
Conclusione
La possibilità di aggiungere un pulsante a un'immagine in WordPress apre possibilità creative per rendere i contenuti più interattivi e visivamente convincenti. Il blocco Cover di WordPress consente di sovrapporre pulsanti alle immagini e di creare design interattivi e visivamente accattivanti senza bisogno di strumenti o codici aggiuntivi. Offre una flessibilità completa per la personalizzazione di titoli, pulsanti e dettagli del layout, per rendere più facile l'allineamento dei contenuti alle moderne tendenze del design. Seguendo questa guida, è possibile ottenere un risultato professionale che migliora sia il design che la funzionalità del sito web. Seguendo questa guida, il design del vostro sito potrà risaltare con una navigazione migliore e una finitura raffinata.
