{"id":74362,"date":"2016-08-08T10:17:27","date_gmt":"2016-08-08T14:17:27","guid":{"rendered":"http:\/\/www.templatemonster.com\/help\/?p=74362"},"modified":"2016-09-21T04:20:03","modified_gmt":"2016-09-21T08:20:03","slug":"js-animated-change-animated-page-loader","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/js-animated-change-animated-page-loader.html","title":{"rendered":"JS Animated. How to change animated page loader"},"content":{"rendered":"<p>This time we are going to learn how to change the default page loader in <a href=\"https:\/\/www.templatemonster.com\/web-templates.php\" title=\"Website Templates\">JS Animated templates<\/a>.<\/p>\r\n\r\n <div class=\"video-container\">\r\n\t<iframe src=\"https:\/\/www.youtube.com\/embed\/5Z2IgAaau1M\"><\/iframe>\r\n<\/div>\r\n<p>First of all we can make the one of our own and see the result right away by using <a href=\"http:\/\/spin.js.org\/\" target=\"_blank\" rel=\"nofollow\"> this url<\/a>.<\/p>\r\n\r\n<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader-300x222.jpg\" alt=\"JS Animated. How to change animated page loader\" width=\"300\" height=\"222\" class=\"alignnone size-medium wp-image-74363\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader-300x222.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader-150x111.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader.jpg 836w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n\r\n<p>After the result is achieved, you should follow the steps as mentioned below:<\/p>\r\n<ol>\r\n\t<li><p>Enter your file manager(it could be the cpanel\/ftp) and find your theme files.<\/p><\/li>\r\n\t<li><p>Open the <strong>&#8216;js&#8217; folder<\/strong>, then &#8211; <strong>script.js<\/strong> file.<\/p><\/li>\r\n\t<li><p>There you should locate the part of the code, mentioned below:\r\n\t<\/p>\r\n\t<p><code>loadersInit();<br \/>\r\n\tfunction loadersInit()<\/code><\/p>\r\n\t\r\n\t<a class=\"darkbox\" href=\"\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader1.jpg\"><img loading=\"lazy\" src=\"\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader1-300x289.jpg\" alt=\"JS Animated. How to change animated page loader1\" width=\"300\" height=\"289\" class=\"alignnone size-medium wp-image-74364\" srcset=\"https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader1-300x289.jpg 300w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader1-150x145.jpg 150w, https:\/\/www.templatemonster.com\/help\/wp-content\/uploads\/2016\/08\/JS-Animated.-How-to-change-animated-page-loader1.jpg 509w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a>\r\n<\/li>\r\n\t\r\n\t<li><p>You can apply the changes you need here.<\/p><\/li>\r\n<\/ol>    \r\n<p>After the changes were submitted, feel free to reload the page.<\/p>\r\n<p>Feel free to check the detailed video tutorial below:<\/p>\r\n<a href=\"http:\/\/www.youtube.com\/watch?v=5Z2IgAaau1M?width=1280&amp;height=720\" rel=\"prettyPhoto\">JS Animated. How to change animated page loader<\/a>","protected":false},"excerpt":{"rendered":"<p>This time we are going to learn how to change the default page loader in JS Animated templates.<\/p>\n","protected":false},"author":63,"featured_media":74365,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[1016],"tags":[537,2415,2399],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/74362"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/63"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=74362"}],"version-history":[{"count":0,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/74362\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/74365"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=74362"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=74362"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=74362"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}