{"id":6692,"date":"2021-08-18T11:07:31","date_gmt":"2021-08-18T09:07:31","guid":{"rendered":"https:\/\/lacolmenatecnologica.com\/widget-unfold-di-jettricks-pulsante-per-mostrare-piu-contenuti\/"},"modified":"2026-09-02T22:40:17","modified_gmt":"2026-09-02T20:40:17","slug":"widget-unfold-di-jettricks-pulsante-per-mostrare-piu-contenuti","status":"publish","type":"post","link":"https:\/\/lacolmenatecnologica.com\/it\/widget-unfold-di-jettricks-pulsante-per-mostrare-piu-contenuti\/","title":{"rendered":"Widget Unfold di JetTricks: pulsante per mostrare pi\u00f9 contenuti"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Video passo dopo passo<\/h2>\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Widget Unfold de JetTricks de Crocoblock JetPlugins: Bot\u00f3n para mostrar m\u00e1s contenido\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/HQ5UfkdDl6o?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n<h2 class=\"wp-block-heading\">Introduzione<\/h2>\n\n<p class=\"wp-block-paragraph\">Questo tutorial presenta il widget <strong>Unfold<\/strong> del plugin <strong><a href=\"https:\/\/crocoblock.com\/plugins\/jettricks\/\">JetTricks<\/a><\/strong> incluso nel sito di <a href=\"https:\/\/crocoblock.com\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Crocoblock<\/strong><\/a>. Avrai la possibilit\u00e0 di nascondere parte di un testo o di un template e mostrare il resto quando l\u2019utente fa clic su un pulsante. <\/p>\n\n<p class=\"wp-block-paragraph\">Questo widget <strong>pu\u00f2 aiutarti a risparmiare spazio<\/strong> e a organizzare meglio l\u2019aspetto della pagina nascondendo contenuti aggiuntivi. A differenza del widget <strong>Leggi di pi\u00f9<\/strong>, non pu\u00f2 nascondere una o pi\u00f9 sezioni. Tuttavia, il widget Unfold <strong>pu\u00f2 essere aperto e poi richiuso<\/strong>. Inoltre, include molte opzioni di personalizzazione che possono aiutarti a sfruttarlo al massimo. Per esempio, puoi progettarlo in modo diverso nelle modalit\u00e0 piegata e aperta. A proposito, se vuoi maggiori informazioni sul widget <strong>Leggi di pi\u00f9<\/strong>, lo aggiunger\u00f2 presto a <a href=\"https:\/\/lacolmenatecnologica.com\/elementor-academy\/\" target=\"_blank\" rel=\"noreferrer noopener\">Elementor Academy<\/a>.     <\/p>\n\n<p class=\"wp-block-paragraph\">Un\u2019altra caratteristica di questo widget \u00e8 che non pu\u00f2 essere usato solo per mostrare\/nascondere testo, ma puoi anche usare un template che hai creato in precedenza.<\/p>\n\n<p class=\"wp-block-paragraph\">Vediamo come funziona il <strong>widget Unfold<\/strong>.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"paso1\">1. Aggiungi il widget Unfold<\/h2>\n\n<p class=\"wp-block-paragraph\">Apri nel builder di Elementor la <strong>pagina<\/strong> o l\u2019<strong>articolo<\/strong> a cui devi aggiungere un widget <strong>Unfold<\/strong>. Cerca il <strong>widget Unfold<\/strong> nel pannello Elementi e trascinalo nella sezione in cui vuoi posizionarlo. <\/p>\n<div class=\"wp-block-image\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9a9c8dc708b&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9a9c8dc708b\" class=\"aligncenter size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"359\" height=\"272\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/unfold-1.jpg\" alt=\"Unfold di JetTricks\" class=\"wp-image-4951\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n<h2 class=\"wp-block-heading\" id=\"paso2\">2. Definisci le impostazioni<\/h2>\n\n<p class=\"wp-block-paragraph\">Nella barra laterale sinistra vedrai il blocco <strong>Impostazioni<\/strong>. Qui puoi definire le impostazioni di chiusura e apertura. <\/p>\n<div class=\"wp-block-image\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9a9c8dc77f5&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9a9c8dc77f5\" class=\"aligncenter size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"359\" height=\"778\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/unfold-2.jpg\" alt=\"Unfold di JetTricks - Impostazioni\" class=\"wp-image-4952\" srcset=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/unfold-2.jpg 359w, https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/unfold-2-231x500.jpg 231w\" sizes=\"auto, (max-width: 359px) 100vw, 359px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n<ul class=\"wp-block-list\">\n<li><strong>Fold<\/strong> (Chiudi): se non attivi questa opzione, il blocco di contenuto verr\u00e0 mostrato aperto per impostazione predefinita. In caso contrario, verr\u00e0 mostrato chiuso. <\/li>\n\n\n\n<li><strong>Scroll to Top After Hiding Content<\/strong> (torna all\u2019inizio dopo aver nascosto il contenuto): se attivi questa opzione, lo schermo scorrer\u00e0 verso l\u2019alto quando nascondi il contenuto di un blocco; pu\u00f2 essere molto utile quando il contenuto \u00e8 lungo, cos\u00ec l\u2019utente non perde il punto di riferimento.<\/li>\n\n\n\n<li><strong>Closed Height<\/strong> (Altezza da chiuso): questa opzione ti consente di definire l\u2019altezza del blocco di contenuto quando \u00e8 chiuso. Puoi farlo spostando il cursore o semplicemente inserendo il valore necessario nella barra; <\/li>\n\n\n\n<li><strong>Separator height<\/strong> (Altezza del separatore): definisce l\u2019altezza della fascia separatrice colorata che parte dal fondo del blocco aperto e va verso l\u2019alto. Puoi schiarire il colore con la trasparenza nella scheda <strong>Stile<\/strong>. \u00c8 anche possibile trasformarlo in una sfumatura.  <\/li>\n\n\n\n<li><strong>Duration<\/strong> (Durata): qui puoi scegliere la velocit\u00e0 con cui il blocco di contenuto si chiuder\u00e0 e si aprir\u00e0. Pi\u00f9 alto \u00e8 il valore, pi\u00f9 lento sar\u00e0 il movimento. <\/li>\n\n\n\n<li><strong>Easing<\/strong> (Easing): qui ci sono 9 tipi di animazione di chiusura e apertura tra cui puoi scegliere.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"paso3\">3. Scegli il contenuto<\/h2>\n\n<p class=\"wp-block-paragraph\">Nel blocco <strong>Contenuto<\/strong> puoi aggiungere contenuti statici (come testo, immagini, video o altri media) oppure recuperarli dinamicamente dal metacampo. Inoltre, puoi aggiungere uno qualsiasi dei template disponibili nel blocco di contenuto nascosto. <\/p>\n<div class=\"wp-block-image\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9a9c8dc7fb5&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9a9c8dc7fb5\" class=\"aligncenter size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"944\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/unfold-jettricks-content.gif\" alt=\"Contenuto Unfold JetTricks\" class=\"wp-image-4954\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n<p class=\"wp-block-paragraph\">Per aggiungere il template gi\u00e0 pronto al blocco nascosto, devi premere il pulsante <strong>Template<\/strong> (Template) nella riga <strong>Content Type<\/strong> (Tipo di contenuto), che \u00e8 il pulsante con l\u2019icona a forma di foglio. Scegli il template dal menu a tendina e verr\u00e0 aggiunto automaticamente al blocco di contenuto nascosto. <\/p>\n\n<h2 class=\"wp-block-heading\" id=\"paso4\">4. Personalizza il pulsante<\/h2>\n\n<p class=\"wp-block-paragraph\">Puoi personalizzare il pulsante che chiude e apre il blocco di contenuto nascosto nella sezione <strong>Button<\/strong> (pulsante).<\/p>\n\n<ul class=\"wp-block-list\">\n<li><strong>Alignment<\/strong> (Allineamento): ti permette di scegliere dove verr\u00e0 posizionato il pulsante.<\/li>\n\n\n\n<li><strong>Fold Icon<\/strong> (Icona di chiusura): puoi scegliere l\u2019icona per i pulsanti di chiusura e apertura nella libreria di icone o caricare il tuo file SVG.<\/li>\n\n\n\n<li><strong>Fold Text<\/strong> (Testo di chiusura): inserisci qui i testi dei pulsanti di chiusura e apertura.<\/li>\n<\/ul>\n<div class=\"wp-block-image\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;6a9a9c8dc8719&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"6a9a9c8dc8719\" class=\"aligncenter size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"268\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2025\/12\/unfold-boton.gif\" alt=\"Unfold - Pulsante\" class=\"wp-image-4953\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\tdata-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.thisImage.buttonRight\"\n\t\t\tdata-wp-style--top=\"state.thisImage.buttonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n<h2 class=\"wp-block-heading\" id=\"paso5\">5. Personalizza a tuo gusto<\/h2>\n\n<p class=\"wp-block-paragraph\">Ci sono molte impostazioni di design per ogni elemento nella scheda <strong>Stile<\/strong>. Ecco alcuni esempi di ci\u00f2 che potresti creare con l\u2019aiuto del widget Unfold: <\/p>\n\n<figure class=\"wp-block-video\"><video autoplay=\"\" loop=\"\" muted=\"\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2019\/02\/unfold_cases.mp4\" playsinline=\"\"><\/video><\/figure>\n\n<p class=\"wp-block-paragraph\">Quindi, questi semplici passaggi sono tutto ci\u00f2 che devi fare per ottenere un impressionante blocco di apertura nella pagina del tuo sito web.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Video passo dopo passo Introduzione Questo tutorial presenta il widget Unfold del plugin JetTricks incluso nel sito di Crocoblock. Avrai la possibilit\u00e0 di nascondere parte di un testo o di un template e mostrare il resto quando l\u2019utente fa clic su un pulsante. Questo widget pu\u00f2 aiutarti a risparmiare spazio e a organizzare meglio l\u2019aspetto [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":6693,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_seopress_titles_title":"Widget Unfold di JetTricks: mostra pi\u00f9 contenuti","_seopress_titles_desc":"Questo tutorial presenta il widget Unfold del plugin JetTricks incluso nel sito di Crocoblock. Avrai la possibilit\u00e0 di nascondere parte di un testo o\u2026","_seopress_robots_index":"","_seopress_robots_follow":"","_seopress_robots_imageindex":"","_seopress_robots_snippet":"","_seopress_robots_primary_cat":"none","_seopress_robots_breadcrumbs":"","_seopress_robots_freeze_modified_date":"","_seopress_robots_custom_modified_date":"","_seopress_robots_canonical":"","_seopress_social_fb_title":"","_seopress_social_fb_desc":"","_seopress_social_fb_img":"","_seopress_social_fb_img_attachment_id":0,"_seopress_social_fb_img_width":0,"_seopress_social_fb_img_height":0,"_seopress_social_twitter_title":"","_seopress_social_twitter_desc":"","_seopress_social_twitter_img":"","_seopress_social_twitter_img_attachment_id":0,"_seopress_social_twitter_img_width":0,"_seopress_social_twitter_img_height":0,"_seopress_redirections_value":"","_seopress_redirections_enabled":"","_seopress_redirections_enabled_regex":"","_seopress_redirections_logged_status":"entrambi","_seopress_redirections_param":"","_seopress_redirections_type":301,"_seopress_analysis_target_kw":"","_seopress_news_disabled":"","_seopress_video_disabled":"","_seopress_video":[],"_seopress_pro_schemas_manual":[],"_seopress_pro_rich_snippets_disable_all":"","_seopress_pro_rich_snippets_disable":[],"_seopress_pro_schemas":[],"footnotes":"","_bricks_page_content_2":[],"_bricks_page_header_2":[],"_bricks_page_footer_2":[]},"categories":[438],"tags":[406,407],"class_list":["post-6692","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-crocoblock","tag-contenuto-dinamico","tag-web-design"],"_links":{"self":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts\/6692","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/comments?post=6692"}],"version-history":[{"count":1,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts\/6692\/revisions"}],"predecessor-version":[{"id":6694,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/posts\/6692\/revisions\/6694"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/media\/6693"}],"wp:attachment":[{"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/media?parent=6692"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/categories?post=6692"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/it\/wp-json\/wp\/v2\/tags?post=6692"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}