{"id":9133,"date":"2025-05-19T12:38:59","date_gmt":"2025-05-19T12:38:59","guid":{"rendered":"https:\/\/tableberg.com\/?post_type=docs&#038;p=9133"},"modified":"2025-05-19T12:38:59","modified_gmt":"2025-05-19T12:38:59","password":"","slug":"come-cambiare-il-colore-dei-pulsanti-in-tableberg","status":"publish","type":"docs","link":"https:\/\/tableberg.com\/it\/docs\/how-to-change-the-button-color-in-tableberg\/","title":{"rendered":"Come cambiare il colore dei pulsanti in Tableberg"},"content":{"rendered":"<p>I pulsanti di una tabella devono essere visivamente distinti e interattivi. Un colore di sfondo ben scelto far\u00e0 in modo che catturino l'attenzione dell'utente, mentre un effetto hover fluido confermer\u00e0 che sono cliccabili. Senza questi accorgimenti, i pulsanti rischiano di sembrare fuori posto o, peggio, di passare inosservati.<\/p>\n\n\n\n<p>In questa guida imparerete a personalizzare i colori dei pulsanti e gli effetti hover direttamente nell'editor, in modo che le vostre tabelle rimangano pulite, funzionali e professionali. <\/p>\n\n\n<div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_de354889-d231-4233-b599-58df50161b16\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 30%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 1px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\"><strong>Passo 1: fare clic sul pulsante all'interno della tabella<\/strong><\/h2>\n\n\n\n<p>Individuare il pulsante aggiunto all'interno di una cella di tabella. Fare clic direttamente sul pulsante per selezionare il blocco Pulsante.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"423\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/1-1-1024x423.png\" alt=\"Fare clic sul pulsante all&#039;interno della tabella\" class=\"wp-image-9136\" style=\"border-width:1px;border-radius:2px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/1-1-1024x423.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/1-1-300x124.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/1-1-768x318.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/1-1-1536x635.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/1-1-18x7.png 18w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/1-1.png 1681w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n<div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_1794c61d-002a-4b23-a861-be11f8859853\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 30%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 1px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\"><strong>Passo 2: aprire la barra laterale delle impostazioni del blocco<\/strong><\/h2>\n\n\n\n<p>Una volta selezionato il pulsante, guardare la barra laterale di destra. Se la barra laterale non \u00e8 visibile, fare clic sull'icona Impostazioni nell'angolo superiore destro dell'editor per aprirla. <\/p>\n\n\n\n<figure class=\"wp-block-image size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"405\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/2-6-1024x405.png\" alt=\"Aprire la barra laterale delle impostazioni del blocco\" class=\"wp-image-9137\" style=\"border-width:1px;border-radius:2px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/2-6-1024x405.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/2-6-300x119.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/2-6-768x304.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/2-6-1536x607.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/2-6-18x7.png 18w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/2-6.png 1842w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n<div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_5dfe5a61-84e6-418e-b37f-7ddaf2caf6ff\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 30%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 1px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\"><strong>Passo 3: passare alla scheda Stili<\/strong><\/h2>\n\n\n\n<p>Nella barra laterale, spostarsi nella scheda Stili. Qui si trovano tutte le impostazioni relative all'aspetto del blocco Pulsante.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"417\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/3-4-1024x417.png\" alt=\"Passare alla scheda Stili\" class=\"wp-image-9138\" style=\"border-width:1px;border-radius:2px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/3-4-1024x417.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/3-4-300x122.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/3-4-768x313.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/3-4-1536x626.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/3-4-18x7.png 18w, https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/3-4.png 1850w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n<div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_4f2c6d2e-23cf-4f7e-a2c6-9c977724a01a\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 30%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 1px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\"><strong>Passo 4: Scegliere un nuovo colore per il pulsante<\/strong><\/h2>\n\n\n\n<p>Scorrere verso il basso per trovare la sezione Colore. Si vedranno le opzioni per impostare il colore del testo, il colore del testo in primo piano, il colore dello sfondo e il colore dello sfondo in secondo piano per il pulsante.&nbsp;<\/p>\n\n\n\n<p>Fare clic sulla tavolozza dei colori e scegliere il colore desiderato, oppure inserire un codice HEX\/RGB se si desidera un controllo preciso.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"353\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/05\/4-1.gif\" alt=\"Scegliete un nuovo colore per i pulsanti\" class=\"wp-image-9140\" style=\"border-width:1px;border-radius:2px\"\/><\/figure>\n\n\n<div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_f653a6de-4d7a-4b29-a562-f406c608d7a3\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 30%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 1px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div>\n\n\n<p><strong>Conclusione<\/strong><\/p>\n\n\n\n<p>Un buon design dei pulsanti nelle tabelle Tableberg si basa su due elementi essenziali. In primo luogo, il colore del pulsante deve contrastare chiaramente con lo sfondo della tabella, in modo da risaltare a colpo d'occhio. In secondo luogo, uno stato definito di hover fornisce agli utenti un feedback immediato e conferma che il pulsante \u00e8 interattivo.<\/p>\n\n\n\n<p>Ora che sapete come impostarli entrambi, i vostri pulsanti avranno l'aspetto giusto e si comporteranno come gli utenti si aspettano.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<p class=\"has-text-align-left\"><a href=\"https:\/\/tableberg.com\/it\/come-progettare-pulsanti-eleganti-in-wordpress\/\">Come progettare pulsanti eleganti in WordPress<\/a><\/p>","protected":false},"excerpt":{"rendered":"<p>Buttons in a table should be visually distinct and interactive. A well-chosen background color will ensure they catch the user\u2019s eye, while a smooth hover effect will confirm they\u2019re clickable. Without these, buttons risk looking out of place or worse, going unnoticed. In this guide, you\u2019ll learn how to customize button colors and hover effects [&hellip;]<\/p>\n","protected":false},"author":9,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_eb_attr":"","footnotes":""},"doc_category":[127],"doc_tag":[],"class_list":["post-9133","docs","type-docs","status-publish","hentry","doc_category-styling-customization"],"year_month":"2026-04","word_count":290,"total_views":0,"reactions":{"happy":0,"normal":0,"sad":0},"author_info":{"name":"Moinul Islam","author_nicename":"marufmoinul27","author_url":"https:\/\/tableberg.com\/it\/author\/marufmoinul27\/"},"doc_category_info":[{"term_name":"Styling &amp; Customization","term_url":"https:\/\/tableberg.com\/it\/docs-category\/styling-customization\/"}],"doc_tag_info":[],"_links":{"self":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/docs\/9133","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/comments?post=9133"}],"version-history":[{"count":8,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/docs\/9133\/revisions"}],"predecessor-version":[{"id":9240,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/docs\/9133\/revisions\/9240"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/media?parent=9133"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/doc_category?post=9133"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/tableberg.com\/it\/wp-json\/wp\/v2\/doc_tag?post=9133"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}