{"id":105956,"date":"2023-04-07T17:48:07","date_gmt":"2023-04-07T12:18:07","guid":{"rendered":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/?post_type=documents&amp;p=105956"},"modified":"2023-04-07T17:48:07","modified_gmt":"2023-04-07T12:18:07","slug":"multiple-preloaders-animations-in-elementor","status":"publish","type":"documents","link":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/docs\/multiple-preloaders-animations-in-elementor\/","title":{"rendered":"How to Combine Multiple Preloaders Animations on a Page in Elementor?"},"content":{"rendered":"\n<p>Do you want to add Multiple Preloaders together to create more engaging loading animation in your Elementor website? Preloader animations can make your website more interactive and engaging, and using multiple preloaders can create a more complex and dynamic animation. By combining multiple preloader animations, you can create a unique loading animation that matches your website&#8217;s theme and style.<\/p>\n\n\n\n<p>With the Preloader widget from The Plus Addons for Elementor you can easily add multiple preloaders to create a unique page loading animation.<\/p>\n\n\n\n<p><em>To check the complete feature overview documentation of The Plus Addons for Elementor Preloader widget, <a href=\"\/docs\/preloader-elementor-widget-settings-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\">click here<\/a>.<\/em><\/p>\n\n\n\n<p><strong><em>Requirement&nbsp; &#8211; This widget is a part of The Plus Addons for Elementor, make sure it&#8217;s installed &amp; activated to enjoy all its powers.<\/em><\/strong><\/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\/pre-loader?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>To do this, add the Preloader widget on the page or template, in the <strong>Content<\/strong> tab, you\u2019ll find an item under <strong>Preloader<\/strong>.<\/p>\n\n\n\n<p>Open the item and select your preferred option from the <strong>Select<\/strong> dropdown.<\/p>\n\n\n\n<p>Then adjust the settings and style accordingly.<\/p>\n\n\n\n<p>Now click on the <strong>+ADD ITEM<\/strong> button to add an additional preloader.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img fetchpriority=\"high\" decoding=\"async\" width=\"332\" height=\"707\" src=\"https:\/\/etemplates.wdesignkit.com\/wp-content\/uploads\/sites\/55\/2023\/04\/preloader-add-item.png\" alt=\"preloader add item\" class=\"wp-image-105957\" srcset=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/04\/preloader-add-item.png 332w, https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-content\/uploads\/sites\/55\/2023\/04\/preloader-add-item-141x300.png 141w\" sizes=\"(max-width: 332px) 100vw, 332px\" \/><\/figure>\n\n\n\n<p>Just repeat the above mentioned steps to add the loader.<\/p>\n\n\n\n<p>This is how you can add multiple loaders on a page.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1920\" height=\"747\" src=\"https:\/\/etemplates.wdesignkit.com\/wp-content\/uploads\/sites\/55\/2023\/04\/preloader-multiple-loader-demo.gif\" alt=\"preloader multiple loader demo\" class=\"wp-image-105958\"\/><\/figure>\n\n\n\n<p>Also, check <a href=\"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/docs\/page-loading-transition-effects-in-elementor\/\" target=\"_blank\" rel=\"noreferrer noopener\">How to Add Page Loading Transition Effects in Elementor<\/a>.<\/p>\n","protected":false},"author":16,"featured_media":105959,"parent":0,"comment_status":"open","ping_status":"open","template":"","format":"standard","docs":[527,559],"class_list":["post-105956","documents","type-documents","status-publish","format-standard","has-post-thumbnail","hentry","docs-plus-widgets","docs-preloader"],"acf":[],"_links":{"self":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/105956","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\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/comments?post=105956"}],"version-history":[{"count":0,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/documents\/105956\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media\/105959"}],"wp:attachment":[{"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/media?parent=105956"}],"wp:term":[{"taxonomy":"docs","embeddable":true,"href":"https:\/\/etemplates.wdesignkit.com\/theplusaddons\/wp-json\/wp\/v2\/docs?post=105956"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}