Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Coppa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Come aggiungere pulsanti di invito all’azione in WordPress (senza codice)

L’aggiunta di pulsanti di invito all’azione alle pagine o ai post di WordPress può aumentare le conversioni. Questi pulsanti sono accattivanti e indirizzano gli utenti a compiere azioni specifiche.

Ad esempio, si possono usare per inviare i visitatori a una pagina di prezzi, di prodotti o di servizi. Possono anche promuovere offerte speciali, nuovi prodotti o link di affiliazione.

In questo articolo vi mostreremo come aggiungere bellissimi pulsanti di invito all’azione in WordPress. La parte migliore è che non dovrete scrivere alcun codice.

Scopriamo il modo più semplice per migliorare il vostro sito WordPress con questi pulsanti efficaci.

Adding Buttons in WordPress Step by Step

Nota: questo articolo riguarda l’aggiunta di pulsanti personalizzati di invito all’azione in WordPress. Se volete aggiungere pulsanti per i social media, consultate la nostra guida sull’add-on dei pulsanti di condivisione sociale in WordPress.

Aggiunta di pulsanti nei post e nelle pagine di WordPress (passo dopo passo)

WordPress rende super facile l’aggiunta di pulsanti con il blocco Button integrato. Si tratta di una funzionalità introdotta con l’editor di blocchi di WordPress Gutenberg.

Vi mostreremo diversi modi per aggiungere pulsanti di invito all’azione alle pagine e ai post dei blog WordPress. Potete scegliere la soluzione più adatta alle vostre esigenze.

Utilizzate pure l’indice sottostante per navigare facilmente in questo articolo:

Indice dei contenuti:

Video tutorial

Subscribe to WPBeginner

Se il video non vi piace o avete bisogno di ulteriori istruzioni, continuate a leggere.

Aggiunta di pulsanti nei post e nelle pagine di WordPress tramite l’editor predefinito

Secondo la nostra esperienza, questo metodo è facile e consigliato a tutti gli utenti. Utilizza il blocco “Pulsanti” integrato nell’editor a blocchi di WordPress. Se utilizzate ancora il vecchio Classic Editor, potete passare alla sezione successiva.

Per prima cosa, è necessario creare un nuovo post o modificarne uno esistente in cui si desidera aggiungere un pulsante.

Nella schermata di modifica del post, fare clic sull’icona ‘+’ e selezionare il blocco Pulsanti dalla sezione Elementi di layout.

Add button block

Successivamente, si dovrebbe vedere il blocco di pulsanti aggiunto all’editor di contenuti.

È sufficiente fare clic sull’area “Aggiungi testo…” e inserire il testo del pulsante.

Add button text

Successivamente, fare clic sul pulsante Link nella barra degli strumenti per aggiungere un link.

È possibile cercare un post o una pagina o semplicemente copiare e incollare un URL nel campo del link.

Add button link

Una volta fatto, premere “Invio” o l’icona “Applica” per salvare il link.

Se si desidera visualizzare il pulsante al centro, è possibile fare clic sull’icona ‘Giustifica’ e selezionare ‘Giustifica centro’. È inoltre possibile modificare l’allineamento verticale del pulsante dalla barra degli strumenti.

Change button alignment

Successivamente, è possibile personalizzare lo stile del pulsante e modificare i colori del testo e dello sfondo dal pannello delle impostazioni del blocco sul lato destro.

È sufficiente passare alla scheda “Stile” nelle impostazioni del blocco per regolare lo stile del pulsante.

Change button style

È possibile scegliere tra tre stili di pulsanti: predefinito, contorno e quadrato. È possibile provare ciascuno di essi facendo clic su di essi e scegliendo quello che sembra migliore.

La sezione Impostazioni colore comprende cinque varianti di colore sia per lo sfondo che per il testo del pulsante. Non solo, ma è anche possibile utilizzare un colore personalizzato a scelta facendo clic sull’opzione ‘Colore personalizzato’.

Button style settings

Una volta soddisfatti del design del pulsante, è possibile salvare il post o pubblicarlo per vedere un’anteprima dal vivo.

Ecco come appariva sul nostro sito web dimostrativo.

Call to action button preview

Bonus: se volete vedere le prestazioni dei vostri pulsanti, dovreste usare MonsterInsights. Ha un monitoraggio integrato degli eventi per i link di affiliazione, i link in uscita e gli eventi personalizzati, in modo da poter vedere il rendimento dei vostri pulsanti. Per maggiori dettagli, consultate le importanti metriche di marketing che dovete monitorare in WordPress.

Creare un pulsante di WordPress nell’editor classico

L’editor a blocchi predefinito di WordPress è moderno, più veloce e più facile. Alcuni utenti utilizzano ancora il vecchio Classic Editor di WordPress.

Non consigliamo di utilizzare il classico editor di WordPress. È obsoleto e non ha abbastanza caratteristiche per permettere agli utenti di creare contenuti fantastici. Se lo utilizzate ancora, vi consigliamo di disattivarlo e di iniziare a utilizzare l’editor a blocchi.

D’altra parte, alcuni utenti potrebbero ancora volerlo utilizzare. In questo caso, avrete bisogno di una soluzione alternativa per aggiungere pulsanti sul vostro sito WordPress.

Sono disponibili tre opzioni per aggiungere pulsanti nell’Editor classico di WordPress:

  1. Aggiungere un pulsante in WordPress con il codice HTML/CSS.
  2. Aggiungere pulsanti con il plugin WordPress button shortcode.
  3. Aggiungere un pulsante in WordPress senza utilizzare gli shortcode.

Delle tre opzioni, la prima è il metodo di codifica. Dovrete scrivere il codice HTML/CSS e aggiungerlo al vostro sito web ovunque abbiate bisogno di un pulsante. Non è un metodo adatto ai principianti.

La seconda opzione è il metodo più comunemente utilizzato. Questo perché la maggior parte dei plugin per pulsanti di WordPress fornisce shortcode per l’aggiunta di pulsanti.

La terza opzione è la migliore perché consente di aggiungere facilmente pulsanti ai post e alle pagine senza dover ricordare lo shortcode.

Vediamo come aggiungere pulsanti in WordPress senza utilizzare gli shortcode.

La prima cosa da fare è installare e attivare il plugin Forget About Shortcode Buttons. Per maggiori dettagli, consultate la nostra guida passo-passo su come installare un plugin di WordPress.

Una volta attivato il plugin, creare una nuova pubblicazione o modificarne una esistente. Nell’editor, si vedrà un nuovo pulsante etichettato “Inserisci pulsante” nell’editor visuale.

Insert Button Icon in Classic WordPress Editor

Per inserire un nuovo pulsante nel post, è necessario fare clic sull’icona “Inserisci pulsante”.

Si aprirà una finestra popup in cui sarà possibile progettare il nuovo pulsante.

Enter Button Text and URL in Classic Editor

Per prima cosa, è necessario aggiungere il testo e l’URL del pulsante. Mentre si aggiunge il testo del pulsante, si può vedere un’anteprima dal vivo nel riquadro sottostante.

Successivamente, è possibile aggiungere un tag nofollow al proprio link e aprire il link in una nuova scheda facendo clic sulle opzioni della casella di controllo sottostante.

Successivamente, è possibile selezionare un’icona per il pulsante. Facendo clic sulla scheda ‘Icone’, si potranno vedere le icone che si possono aggiungere prima o dopo il testo dei pulsanti.

Add Icon to your Button in Classic Editor

Queste icone sono in realtà font di icone (imparate a usare i font di icone nell’editor dei post di WordPress).

Successivamente, è possibile scegliere il colore del testo e dello sfondo del pulsante facendo clic sull’icona della casella Colore.

Change Button Background Color in WordPress Classic Editor

Successivamente, fare clic sul menu a discesa per scegliere lo stile del pulsante.

Sono disponibili otto diversi stili di pulsanti pronti all’uso.

Choose a Button Style in Classic WordPress Editor

Allo stesso modo, è possibile scegliere la dimensione del pulsante, da extra small a extra large.

Una volta soddisfatti dell’aspetto, è sufficiente fare clic sul pulsante “Aggiorna”.

Potrete vedere il vostro pulsante come appare nel vostro post, proprio all’interno dell’editor del post.

È inoltre possibile impostare l’allineamento dei pulsanti selezionando semplicemente il testo del pulsante e utilizzando i pulsanti della barra degli strumenti nell’editor classico.

Center Align Your Button in Classic Editor

Facendo doppio clic sul pulsante si aprirà la finestra a comparsa Inserisci pulsante e, se lo si desidera, si potrà modificare nuovamente il pulsante.

Una volta soddisfatti del design, è possibile pubblicare o aggiornare il post e vederlo in azione. Ecco come è apparso il pulsante di fantasia sul nostro sito WordPress demo.

Button Preview - Built in Classic Editor

Aggiunta di un pulsante per chiamare in WordPress

Oltre ai soliti pulsanti di chiamata all’azione, potete aggiungere al vostro sito web dei pulsanti di chiamata per aumentare i contatti e le conversioni.

Un pulsante “click-to-call” è un tipo specifico di pulsante call-to-action che consente agli utenti di effettuare una telefonata al vostro team con un semplice tocco.

Utilizzando i pulsanti “tap-to-call”, i visitatori del sito possono immediatamente parlare di persona con il vostro team e ottenere le informazioni di cui hanno bisogno. Sia che si tratti di una richiesta di preventivo, di informazioni pre-vendita o di un problema di assistenza, le telefonate sono rapide.

Poiché il numero di utenti di smartphone è in crescita, l’aggiunta di pulsanti di chiamata ora è ancora più importante al giorno d’oggi.

Se non si dispone di un telefono aziendale, si può pensare di ottenere un numero telefonico aziendale virtuale.

Detto questo, vediamo come aggiungere pulsanti “click-to-call” in WordPress passo dopo passo.

La prima cosa da fare è installare e attivare il plugin WP Call Button. Per istruzioni dettagliate, potete consultare la nostra guida passo-passo su come installare un plugin di WordPress.

Dopo l’attivazione, è necessario visitare la pagina Impostazioni ” WP Call Button per configurare le impostazioni del plugin e progettare il pulsante “click-to-call”.

Sticky Call Button Settings in WordPress

Per prima cosa, si vedranno le impostazioni del pulsante di chiamata in evidenza. Il pulsante di chiamata in evidenza è una caratteristica ottimizzata per la conversione che sposta il pulsante di chiamata insieme agli utenti durante la navigazione del sito.

È possibile iniziare attivando lo stato del pulsante Chiama ora. È sufficiente fare clic sulla levetta dell’interruttore per attivarlo.

Dopodiché, è necessario inserire il numero di telefono. WP Call Button dispone di un campo per il numero di telefono con il codice del paese. È sufficiente selezionare il paese e inserire il numero di telefono aziendale.

Se non avete un numero aziendale, potete ottenerne uno da Nextiva. Si tratta di un fornitore VoIP aziendale di fiducia.

Successivamente, è possibile modificare il testo del pulsante di chiamata e scegliere la posizione e il colore del pulsante.

Inoltre, è possibile selezionare dove mostrare il pulsante di chiamata appiccicoso sul sito web. Per impostazione predefinita, il pulsante di chiamata viene mostrato su tutte le pagine e su tutti i dispositivi. È possibile mostrare o nascondere il pulsante su determinate pagine e mostrarlo solo sui dispositivi mobili.

Una volta esaminate tutte le opzioni, è possibile fare clic sul pulsante “Salva modifiche” in basso. Dopodiché, potrete visitare il vostro sito web e vedere il pulsante “Chiama ora” in azione.

WordPress Click to Call Button

Oltre ai pulsanti di chiamata adesivi, con questo plugin è possibile aggiungere pulsanti di chiamata statici alle pagine, ai post e alle barre laterali di WordPress.

Se utilizzate l’editor di blocchi di WordPress, potete aggiungere facilmente il pulsante Chiama ora alle vostre pagine utilizzando il blocco Pulsante di chiamata WP.

Creare una nuova pagina o modificare una pagina esistente e aggiungere il blocco WP Call Button utilizzando l’editor di pagina.

Adding WP Call Button Block in WordPress

Successivamente, è possibile personalizzare il testo del pulsante, il colore del pulsante, il colore del testo, la dimensione del carattere e mostrare o nascondere l’icona del telefono.

Una volta soddisfatti del design, è possibile pubblicare o aggiornare la pagina.

Customizing Call Button in WordPress Page Editor

Se si utilizza il classico editor di WordPress, è necessario utilizzare il generatore di pulsanti di chiamata statici per ottenere uno shortcode.

Andate su Impostazioni ” Pulsante di chiamata WP e fate clic sul menu “Pulsante di chiamata statico” in alto.

Static Call Buttons in WordPress Settings

È sufficiente personalizzare le opzioni del pulsante e poi copiare lo shortcode. Dopodiché, è possibile utilizzare lo shortcode in qualsiasi post o pagina del proprio sito web.

Il plugin WP Call Button consente inoltre di aggiungere il pulsante di chiamata alla barra laterale di WordPress e ad altre aree predisposte per i widget.

Basta andare su Aspetto ” Widget e trascinare il widget WP Call Button in un’area predisposta per i widget in cui si desidera visualizzare il pulsante di chiamata.

WordPress Call Button Sidebar Widget

Ora è possibile aggiungere un titolo, una descrizione e personalizzare il pulsante di chiamata dalla sezione Impostazioni avanzate. Una volta terminato, salvare il widget.

Tutto qui! Se volete vedere un tutorial più dettagliato, potete consultare la nostra guida passo-passo su come aggiungere un pulsante “click-to-call” in WordPress.

Suggerimento per l’aggiunta di pulsanti personalizzati in WordPress

La sola aggiunta di un pulsante di invito all’azione non è sempre sufficiente. È possibile che si voglia anche personalizzare la pagina o il post con un’immagine eroe, dei menu e un layout personalizzato.

In questo caso, si consiglia di utilizzare un plugin per la creazione di pagine WordPress drag-and-drop come SeedProd o Thrive Architect.

SeedProd add button

Questi page builder vi aiuteranno a creare landing page personalizzate con fantasiosi pulsanti call-to-action esattamente come volete voi.

Qualunque cosa facciate, è importante che teniate traccia dell’andamento dei vostri pulsanti, perché tirare a indovinare non è la migliore strategia di crescita aziendale.

Consigliamo di utilizzare MonsterInsights. Ha un monitoraggio integrato degli eventi per i link affiliati, i link in uscita e gli eventi personalizzati, in modo da poter vedere le prestazioni dei vostri pulsanti. Per maggiori dettagli, consultate le importanti metriche di marketing che dovete monitorare in WordPress.

Speriamo che questo articolo vi abbia aiutato a imparare come aggiungere facilmente pulsanti in WordPress. Potreste anche voler consultare la nostra guida completa sul monitoraggio delle conversioni su WordPress o il nostro elenco dei migliori plugin WordPress per far crescere il vostro sito web.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.

Divulgazione: I nostri contenuti sono sostenuti dai lettori. Ciò significa che se cliccate su alcuni dei nostri link, potremmo guadagnare una commissione. Vedi come WPBeginner è finanziato , perché è importante e come puoi sostenerci. Ecco il nostro processo editoriale .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Il kit di strumenti WordPress definitivo

Ottenete l'accesso gratuito al nostro kit di strumenti - una raccolta di prodotti e risorse relative a WordPress che ogni professionista dovrebbe avere!

Reader Interactions

69 commentiLascia una risposta

  1. Carolyn R Cox

    What about a button that performs an action on the page. For example executes a query, reloading the page with the query data (without replacing the page, in other words: no urls.) Is there a simple way to accomplish this without loading a different page? Thanks.

    • WPBeginner Support

      That would be something that heavily depends on your specific use case and would likely require developer assistance.

      Admin

  2. Roger Meachem

    Finally, a clear instruction that works! Thank you. I’ve spent hours trying all manner of things and failing – perhaps they were out-of-date posts but this solved my problem and did so in minutes. It was perfect. I now have buttons that work on the Wordpress site.

    • WPBeginner Support

      Glad our guide was able to help :)

      Admin

  3. Meha Jain

    Hi,
    Any idea how I can add read more button on the theme modules?
    The theme which i am using is not giving me the option to read more button in the modules on the home page.
    How I can add read more button there?

    Regards
    Meha
    (I am a non-technical person.)

    • WPBeginner Support

      You would want to first reach out to your theme’s support and they may have a recommended method for adding that to your theme.

      Admin

  4. Dreamlife

    Thanks for the post. How can I create download button with wordpress premium?

    • WPBeginner Support

      Sadly, for WordPress.com you would need to check with their support for what is currently allowed

      Admin

  5. Rick Hoffarth

    I need to add code to a button in order for the button to take the user to a merchant services portal to make secure payments. So far, the button creators want a URL, not code. How can I connect a button to another site that requires code in order to do it?

  6. Daniel

    Ok, so I know how to make a download button now, but how do I actually make that download happen ?
    Thank you!

  7. Mark Bologna

    This was just what I needed. Read the article, downloaded the plugin, and had a working button all within ten minutes. Thanks!

  8. Debbie

    Super quick – just what I needed! Thank you so much. I had mucked around with some that were so hard to setup… I needed a button and this got the job done quick and easy!

  9. Nina

    Not great… styling is very limited

  10. Utkarsh Agarwal

    How to create links to sections on the same page? For example, I need to create a button after the completion of my post which points to the Comments section down below.

  11. Jen Lewis

    Can this plugin be installed on a site that’s on a free plan? In general, do you have to be on one of the paid plans to install additional plugins to your Wordpress site?

  12. Daniel

    It works on sidebar as well? I need to know, thanks!

  13. Mike Ritter

    This plugin has been pulled from the library.

    • Jolynn Powers

      Mike dose that mean that we can no longer add buttons this way and if so where do we look for other information on how to add buttons?? I need to add three buttons to my work website for a listing of dinning locations, entertainment locations and hotel locations and want to put them on a page rather than a post so that they are always on the site at the same location.

  14. Furquan

    I am searching for button , I have found your post at top in Google but the plugin you have mentioned is no more on Wordpress. Could you please help me

  15. Aachal

    Hey.. I want a button “Apply” instead of the page “Apply” on the homepage of my website.
    How can that be done. Any lead on this?

  16. bill

    can i add buttons and then deactivate and delete the url and the buttons are still there ???

    or is there a way to put in the css codes to function so i have them without a plugin ???

  17. Bridget

    Hi!

    Can I link this to plugin contact form 7? If so, how?

    Thanks!

  18. Alysha

    Thanks for this! Looks great, but is there anyway to use this plugin to add a button to the header on the homepage?

  19. Toni

    This is a really great plugin! It allows for a lot more customization than the standard shortcakes without having to write your own css!

    One question though – why doesn’t it work in the visual text editor of the widgets? This would be so helpful it if also worked in widgets!

    Thanks,
    Toni

  20. Wolf

    Thank you!! Spent ages looking for something simple like this. Should have known to come here first :-)

  21. mohamed

    thanks for your article…i install it and worked well except for the url. for example : when i write in the url (www.example.com) and publish my post and go to press the button , i found the button rfere to (www.example.net/www.example.com). how to solve this problem?

  22. Altaf

    Thank You Bhai i am Done Now and Solve my Wordpress issue :)

  23. John

    Thank you. This is exactly what I was looking for!

  24. Alec

    Hi! – is it possible to place several buttons side by side in a row? (with different items) – and how does the reference work?

  25. Eric

    I want to allow users to upload any image using Insert Image button. Will this work in that case?

  26. Yonatan

    Will this work on a sidebar as well ?

  27. Jenny

    Hello there!

    This is very useful, but is there any way to use a custom image as a button rather than the options that come with the plugin? I have button images that I’ve downloaded from, and I’d like to use those instead because the logo is familiar to my site visitors.

    Warmly,
    Jenny

  28. Karan Bhagat

    Hey, I have been using this plugin for more than 2 of my sites and installed it on one more, it was working fine till yesterday, but suddenly now it has stopped working, it is showing any button in the toolbar to add these buttons to post. I deleted and reinstalled it, still facing the issue. Help please

  29. Blake

    How can i add things to the dropdown menu in the editor? i want things like Font size, buttons, or what ever else i chose to put there without using a plugin, is there anyway to do this?

  30. Nancy

    Thank you! Again! I was searching all over the internet for help with button shortcodes. Couldn’t get them to work. As always, you have the simple answer. I can stop looking any place else for WordPress help!

  31. bryan midgett

    How do I get the buttons on one line instead of vertical? I tried putting between buttons, but the tag prints. When I put my buttons side by side, they run together. Help!

  32. Sacha

    Thanks for the helpful information!

  33. Prasad Saxena

    I want a button to be displayed with each post on the main page of the website, which says go to the website. It should be just beside read more. I did get the button, but i dont know how to configure it so that each post has a different linking url.
    Also the url can be inserted from the post itself. I mean while writing it. Just a box below, a text box where you can put the link to the button.
    Please help….

  34. WPBeginner Staff

    Please make sure you are writing your post in the Visual Editor mode. The button does not appear in the text editor.

  35. CEA

    I installed the plugin and activated it, but am not seeing any change to my editor. I am using WP 4.0. What am I missing? Please help!

  36. Bal Chandra Dhawan

    I added this button today but URL didn’t work.
    I added to page xyz.com/policies and add URL xyz.com/registration,
    on clicking it says page not found and in address bar I see. xyz.com/policies/xyz.com/registration. Its adding existing page URL ?
    Don’t know why?

  37. Bill Gibson

    One problem: I guess it is a link underline that is going through the button text (almost like a strikeout). I have tried smallest and largest button sizes and the line is always through the text. I even tried to add “no decoration” to the style manually and that was ignored. Could this be theme specific? Thanks.

  38. Seo service

    I just installed this plugin and I adore it! I
    already am putting it to good use on my blog. Thanks so much for the heads-up
    on this.

  39. Prishan Latchman

    Is there a button that will allow me to add a specific amount of money to it so that when it is clicked it will increase the current value by that set amount?

    E.G. The button is set to an amount for R20.00 and the item (a pair of shoes) for R100.00 and every time someone clicks on the button the price for the shoes goes up by R20.00 to R120.00

  40. bucur

    very good this plugin, I like it 5 stars

  41. Brenda Malone

    Thanks for the heads-up on this excellent plugin! I have installed on my sites AND donated to the author.

  42. Henderson Daniel

    Thanks for the information. very helpful.

  43. Ross

    Thanks for covering our plugin! :)

  44. Carolann

    I just installed this plugin and I adore it! I already am putting it to good use on my blog. Thanks so much for the heads-up on this. I adore your website too!

Lascia una risposta

Grazie per aver scelto di lasciare un commento. Tenga presente che tutti i commenti sono moderati in base alle nostre politica dei commenti e il suo indirizzo e-mail NON sarà pubblicato. Si prega di NON utilizzare parole chiave nel campo del nome. Avremo una conversazione personale e significativa.