My english is not the best, and my question is not quite simple to aks (for me), so plese forgive me if this will be a little bit foggy... so! I have both of your plugin, one with the WP, and one with the jquery stand alone. My idea is to create silders with the integrated builder in WP, witch is amazing, easy to use and simplifies the whole procedure, add a lots of themplates, and more and more. But, here is the twist. I want to use this sliders outside of WP on a different site, where I using your stand alone jquery plugin. So the question is:
How can I get or generate somehow a source code from the WP builder, witch I can use in my other site?
I hope there is a way, because this is the only way to use your epic product in the future!
At the moment there is no built-in option to import/export the sliders between the two versions but in case you are familiar with HTML, the two plugins are using the same HTML markup, so you can copy the generated source code from the WordPress release and use it with the standalone jQuery version.
I'm familiar with HTML, but the generated source code is not the same with the original source. For example this is how one of my layersilder source code starts:
so, it's not very similar. If I just tried to copy&paste the source code from the WP site to my other site, the result is nothing, just messed up html.
Is there any way, to copy the source code correctly, and use it as a working slider? Maybe I need different js declaration, or js sources?
As I can see you are using the DOM currently, but this is not correct. You will need to check the original page source instead. To access it right click anywhere on the page and choose the View Page Source option.
Hello!
My english is not the best, and my question is not quite simple to aks (for me), so plese forgive me if this will be a little bit foggy... so! I have both of your plugin, one with the WP, and one with the jquery stand alone. My idea is to create silders with the integrated builder in WP, witch is amazing, easy to use and simplifies the whole procedure, add a lots of themplates, and more and more. But, here is the twist. I want to use this sliders outside of WP on a different site, where I using your stand alone jquery plugin. So the question is:
How can I get or generate somehow a source code from the WP builder, witch I can use in my other site?
I hope there is a way, because this is the only way to use your epic product in the future!
Thanks for your answer!
Greg
Hey Greg,
At the moment there is no built-in option to import/export the sliders between the two versions but in case you are familiar with HTML, the two plugins are using the same HTML markup, so you can copy the generated source code from the WordPress release and use it with the standalone jQuery version.
Hey Attila,
I'm familiar with HTML, but the generated source code is not the same with the original source. For example this is how one of my layersilder source code starts:
and this is how this code looks when I inspect the page:
<div id="layerslider" style="width: 1227px; height: 421.781px; visibility: visible;" class="ls-container ls-borderlesslight"> <div class="ls-inner" style="background-color: transparent; width: 1227px; height: 422px;"> <div class="ls-lt-container ls-overflow-hidden" style="width: 1227px; height: 422px;"> </div> <div class="ls-slide ls-active" data-ls="slidedelay:18000; transition2d: 93;" onclick="document.location.href='/vezetek_nelkuli_megoldasok/music-cast'" style="cursor: pointer; width: 1227px; height: 422px; visibility: visible; display: none; left: auto; right: 0px; top: 0px; bottom: auto;"> <img class="ls-tn ls-preloaded" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/tn.jpg?v=1487580340" style="width: 0px; height: 0px; padding: 0px; border-width: 0px; left: 0px; top: 0px;"> <img class="ls-bg ls-preloaded" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/bg.jpg?v=1487580340" style="padding: 0px; border-width: 0px; width: 1227px; height: 421.781px; margin-left: 0px; margin-top: 0.109375px; visibility: visible;"><div class="ls-gpuhack" style="width: auto; height: auto; padding: 0px; border-width: 0px; left: 0px; top: 0px;"></div> <img class="ls-l ls-preloaded" data-ls="delayin:0; showuntil:1000; durationin:2000; durationout:2000; offsetxin:0; offsetxout:0; offsetyin:0; offsetyout:0; fadein:true; fadeout:true;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/haz-sm.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 0, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:500; durationin:1000; offsetxin:left; offsetxout:left; offsetyin:0; offsetyout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/telefon-sm.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 0, 0, 1); opacity: 1; visibility: visible;"> <img class="ls-l ls-preloaded" data-ls="delayin:750; durationin:1000; offsetxin:left; offsetxout:left; offsetyin:0; offsetyout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/musiccast-logo.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 0, 0, 1); opacity: 1; visibility: visible;"> <img class="ls-l ls-preloaded" data-ls="delayin:1000; showuntil:13000; offsetxin:left; offsetxout:left; offsetyin:0; offsetyout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/title.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, -1327, 0, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:4000; durationin:1000; showuntil:2000; offsetxin:right; offsetxout:right; offsetyin:0; offsetyout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/erosito-2016.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 1327, 0, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:7000; durationin:1000; showuntil:2000; offsetxin:right; offsetxout:right; offsetyin:0; offsetyout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/hangszoro-2016.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 1327, 0, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:10000; durationin:1000; showuntil:2000; offsetxin:right; offsetxout:right; offsetyin:0; offsetyout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/hangprojektor-2016.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 1327, 0, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:13000; durationin:1000; showuntil:5100; offsetyin:bottom; offsetyout:bottom; offsetxin:0; offsetxout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/erosito-sm.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 522, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:13500; durationin:1000; showuntil:4800; offsetyin:bottom; offsetyout:bottom; offsetxin:0; offsetxout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/hangszoro-sm-2016.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 522, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:14000; durationin:1000; showuntil:4500; offsetyin:bottom; offsetyout:bottom; offsetxin:0; offsetxout:0;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/hangprojektor-sm.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 522, 0, 1); opacity: 1; visibility: hidden;"> <img class="ls-l ls-preloaded" data-ls="delayin:15000; durationin:1000; offsetxin:0; offsetxout:left; offsetyin:0; offsetyout:0; fadein:true; fadeout:true;" src="https://extreme.cdn4.shoprenter.hu/custom/extreme/image/data/fobanner/musiccast/ismerdmeg-text.png?v=1487580340" style="top: 0px; left: 0px; width: 1227px; height: 421.781px; padding: 0px; border-width: 0px; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 0, 0, 1); opacity: 1; visibility: visible;"> <a class="ls-l" data-ls="delayin:16000; fadein:true; fadeout:true; offsetxin:0; offsetyin:0;" href="/vezetek_nelkuli_megoldasok/music-cast" id="ls-button" style="top: 204.5px; left: 262.016px; display: block; margin-left: 0px; margin-top: 0px; transform-origin: 50% 50% 0px; transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.002, 0, 0, 0, 1); opacity: 1; visibility: visible;"> RÉSZLETEK > </a> </div> </div> </div>and ofc there is more generated code for navigation and preview:
so, it's not very similar. If I just tried to copy&paste the source code from the WP site to my other site, the result is nothing, just messed up html.
Is there any way, to copy the source code correctly, and use it as a working slider? Maybe I need different js declaration, or js sources?
Thanks,
Greg
As I can see you are using the DOM currently, but this is not correct. You will need to check the original page source instead. To access it right click anywhere on the page and choose the View Page Source option.