Search…

X3 Photo Gallery Support Forums

Search…

Page with dynamic content via JS6 posts

Post Reply
 
hyc
Experienced
Topic Author
Posts: 29
Joined: 24 Jul 2021, 06:09

Page with dynamic content via JS

22 Mar 2023, 04:51

Hi all,

In line with that post : viewtopic.php?f=52&t=10565

I am having similar question, however, I can't seem to make it work..

I have one page with following content in "Page_name>Settings>Content" area : 
Code 
<div id="testid"></div>

<div>
<script data-cfasync="false" type="text/javascript" src="https://externaljs.com/example" charset="utf-8"></script>
<script type="text/javascript"> xSpecialFunction(param(50));</script>
</div>
When reaching the page by itself (direct link), it works great.
When reaching the page from any other page of the website, the content doesn't load.
Now I understand the reason, but I am not sure how to fix it.

I tried by having this code in "Page_name>Settings>Page>Advanced>Page Javascript"
Code 
function x3_load_page(){
  xSpecialFunction(param(50));
}
and changing this in the "Page_name>Settings>Content" but it didn't work
Code 
<div id="testid"></div>

<div>
<script data-cfasync="false" type="text/javascript" src="https://externaljs.com/example" charset="utf-8"></script>
</div>
thanks for the help
Top
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13997
Joined: 30 Sep 2006, 03:37

Re: Page with dynamic content via JS

22 Mar 2023, 05:56

Really difficult to diagnose without a link, because I don't know what this Javascript does or how and when it triggers. Normally, if you include it in the "content", it will load (and perhaps trigger after loaded). If it does not trigger automatically, you would have to run a function for the javascript. Also, are you using Cloudflare? What is data-cfasync for? You should never use rocketloader in X3 for example, because it can mess up the order of how javascript is loaded and triggered.
Top
 
hyc
Experienced
Topic Author
Posts: 29
Joined: 24 Jul 2021, 06:09

Re: Page with dynamic content via JS

22 Mar 2023, 08:09

Got your point

This is content of code in "content" :
Code 
<div id="my-store-85914820"></div>
<div>
<script data-cfasync="false" type="text/javascript" src="https://app.ecwid.com/script.js?85914820&data_platform=code&data_date=2023-03-17" charset="utf-8"></script><script type="text/javascript"> xProductBrowser("categoriesPerRow=3","views=grid(20,3) list(60) table(60)","categoryView=grid","searchView=list","id=my-store-85914820");</script>
</div>
It is an ecommerce/shop from Ecwid

Does that help ? 
Top
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13997
Joined: 30 Sep 2006, 03:37

Re: Page with dynamic content via JS

22 Mar 2023, 10:20

I tried the script locally, and it's like you say ... works on first load, but not when navigating to the page. Where is the docs for this? I can't see that this is prepared for SPA websites that load pages dynamically like X3. The main javascript does something by itself when it's loaded, and even refused to be placed in the <head> (it complained <body> was not available), and then it clearly also requires running the xProductBrowser().

Surely they support triggering the shop on the element manually? This script doesn't seem to be prepared at all for dynamic pages.
Top
 
hyc
Experienced
Topic Author
Posts: 29
Joined: 24 Jul 2021, 06:09

Re: Page with dynamic content via JS

22 Mar 2023, 12:53

Some info here https://support.ecwid.com/hc/en-us/arti ... 5004678945

I will reach out to them directly through my account to ask for info on dynamic loading, but there is no way to have the main js in the body of all pages ? 
Top
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13997
Joined: 30 Sep 2006, 03:37

Re: Page with dynamic content via JS

22 Mar 2023, 22:45

hyc wrote:I will reach out to them directly through my account to ask for info on dynamic loading, but there is no way to have the main js in the body of all pages ? 
There is, by adding the <script> to X3's Settings > Footer, which is basically at the end inside the <body> tag. I already tried this, but it doesn't work ... This script/code seems to only want to trigger once, as it thinks it's on a single page and has no reason to trigger again.
There is no info here about re-triggering the script. It just mentions what you have already done, in which case it triggers correctly, but there is no means (at least by documentation) to re-trigger the script.

Basically I would ask "How to trigger this script for a SPA (single-page application) website? The xProductBrowser() function does nothing when triggered after the first time. I have tried to add the <script> to header (causes an error in the script), once in <body> and also tried to reload it before triggering xProductBrowser()."

This script doesn't really look that well planned to me.
Top
Post Reply