{"id":103221,"date":"2023-01-25T17:20:29","date_gmt":"2023-01-25T11:50:29","guid":{"rendered":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/?post_type=documents&#038;p=103221"},"modified":"2023-01-25T17:20:33","modified_gmt":"2023-01-25T11:50:33","slug":"carousel-widgets-remotesync-elementor","status":"publish","type":"documents","link":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/docs\/carousel-widgets-remotesync-elementor\/","title":{"rendered":"How to connect a Slider, Tabs with an Accordion with Carousel ID in Elementor?"},"content":{"rendered":"\n<p>One of the USP of using The Plus Addons for Elementor widgets, is that you can interconnect them with each other to toggle content change. Using this feature, you can create unique layouts for your website to keep yourself apart from the competition.<\/p>\n\n\n\n<p>Here we will see how to connect your Accordion with the Carousel Anything Slider widget.<\/p>\n\n\n\n<p><em>To check the complete feature overview documentation of The Plus Addons for Elementor Accordion widget, <a href=\"\/docs\/elementor-accordion-widget-settings-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\">click here<\/a>.<\/em><\/p>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-a89b3969 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button has-custom-width wp-block-button__width-75 is-style-fill\"><a class=\"wp-block-button__link has-nxt-global-color-8-color has-nxt-global-color-1-background-color has-text-color has-background wp-element-button\" href=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/widgets\/accordion?utm_source=tpae&amp;utm_medium=docs&amp;utm_campaign=text\" style=\"border-radius:5px\" target=\"_blank\" rel=\"noreferrer noopener\">LIVE WIDGET LINK<\/a><\/div>\n<\/div>\n\n\n\n<p><\/p>\n\n\n\n<p>For this process, first drag and drop the Carousel Anything widget with the Accordion widget,&nbsp; and then follow the below steps:<\/p>\n\n\n\n<p>1. Add content to the Carousel Anything widget from Elementor template or shortcode.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img fetchpriority=\"high\" decoding=\"async\" width=\"282\" height=\"455\" src=\"https:\/\/etemplates.wdesignkit.com\/wp-content\/uploads\/sites\/55\/2023\/01\/carousel-anything-content-type.png\" alt=\"carousel anything content type\" class=\"wp-image-103222\" srcset=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/01\/carousel-anything-content-type.png 282w, https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/01\/carousel-anything-content-type-186x300.png 186w\" sizes=\"(max-width: 282px) 100vw, 282px\" \/><\/figure>\n\n\n\n<p>2. Make sure the number of slides in your slider and the number of items in your accordion are the same.<\/p>\n\n\n\n<p>3. Add a Unique Carousel ID in the Carousel Anything widget, this can be any combination of letters and numbers.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"287\" height=\"521\" src=\"https:\/\/etemplates.wdesignkit.com\/wp-content\/uploads\/sites\/55\/2023\/01\/carousel-anything-unique-id.png\" alt=\"carousel anything unique id\" class=\"wp-image-103226\" srcset=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/01\/carousel-anything-unique-id.png 287w, https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/01\/carousel-anything-unique-id-165x300.png 165w\" sizes=\"(max-width: 287px) 100vw, 287px\" \/><\/figure>\n\n\n\n<p>4. Now, to make the connection add the same ID in the Carousel Connection ID field of the accordion widget.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"270\" height=\"983\" src=\"https:\/\/etemplates.wdesignkit.com\/wp-content\/uploads\/sites\/55\/2023\/01\/accordion-carousel-connection-id.png\" alt=\"accordion carousel connection id\" class=\"wp-image-103227\" srcset=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/01\/accordion-carousel-connection-id.png 270w, https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/01\/accordion-carousel-connection-id-82x300.png 82w\" sizes=\"(max-width: 270px) 100vw, 270px\" \/><\/figure>\n\n\n\n<p>And now your Accordion widget is connected with the Carousel Anything widget. Now as you change your Accordion item, your carousel anything slider will change as well. Amazing isnt it?<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1178\" height=\"436\" src=\"https:\/\/etemplates.wdesignkit.com\/wp-content\/uploads\/sites\/55\/2023\/01\/anything-carousel-accordion-demo.gif\" alt=\"anything carousel and accordion demo\" class=\"wp-image-103228\"\/><\/figure>\n","protected":false},"author":25,"featured_media":104387,"parent":0,"comment_status":"open","ping_status":"open","template":"","format":"standard","docs":[529,527],"class_list":["post-103221","documents","type-documents","status-publish","format-standard","has-post-thumbnail","hentry","docs-accordion","docs-plus-widgets"],"acf":[],"_links":{"self":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/103221","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents"}],"about":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/types\/documents"}],"author":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/users\/25"}],"replies":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/comments?post=103221"}],"version-history":[{"count":0,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/103221\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media\/104387"}],"wp:attachment":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media?parent=103221"}],"wp:term":[{"taxonomy":"docs","embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/docs?post=103221"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}