Archived topic
Javascript in Hook element not working when I log out
7 replies · Started by Dawei on June 6, 2022
Hi team,
I created an HTML table on my page https://www.davidzhang.work/cryptopartners/
I added a javascript as a hook element in the GP theme to make the table sortable. I chose "wp_footer" in the setting, and the display rule is "entire site". However, this javascript works only when I log in to WordPress, not when I log out.
I tried to clear the cache but still did not solve the problem.
Can you please help out?
Thanks,
David
Hi Dawei,
May we know what the code is?
We’ll try to check if it appears from our end.
Moreover, to clarify, do you have something set in Users for the Display Rules?
Kindly let us know.
Hi Fernando,
Please see the code below:
<script charset="utf-8">var TGSort=window.TGSort||function(n){"use strict";function r(n){return n?n.length:0}function t(n,t,e,o=0){for(e=r(n);o<e;++o)t(n[o],o)}function e(n){return n.split("").reverse().join("")}function o(n){var e=n[0];return t(n,function(n){for(;!n.startsWith(e);)e=e.substring(0,r(e)-1)}),r(e)}function u(n,r,e=[]){return t(n,function(n){r(n)&&e.push(n)}),e}var a=parseFloat;function i(n,r){return function(t){var e="";return t.replace(n,function(n,t,o){return e=t.replace(r,"")+"."+(o||"").substring(1)}),a(e)}}var s=i(/^(?:\s*)([+-]?(?:\d+)(?:,\d{3})*)(\.\d*)?$/g,/,/g),c=i(/^(?:\s*)([+-]?(?:\d+)(?:\.\d{3})*)(,\d*)?$/g,/\./g);function f(n){var t=a(n);return!isNaN(t)&&r(""+t)+1>=r(n)?t:NaN}function d(n){var e=[],o=n;return t([f,s,c],function(u){var a=[],i=[];t(n,function(n,r){r=u(n),a.push(r),r||i.push(n)}),r(i)<r(o)&&(o=i,e=a)}),r(u(o,function(n){return n==o[0]}))==r(o)?e:[]}function v(n){if("TABLE"==n.nodeName){for(var a=function(r){var e,o,u=[],a=[];return function n(r,e){e(r),t(r.childNodes,function(r){n(r,e)})}(n,function(n){"TR"==(o=n.nodeName)?(e=[],u.push(e),a.push(n)):"TD"!=o&&"TH"!=o||e.push(n)}),[u,a]}(),i=a[0],s=a[1],c=r(i),f=c>1&&r(i[0])<r(i[1])?1:0,v=f+1,p=i[f],h=r(p),l=[],g=[],N=[],m=v;m<c;++m){for(var T=0;T<h;++T){r(g)<h&&g.push([]);var C=i[m][T],L=C.textContent||C.innerText||"";g[T].push(L.trim())}N.push(m-v)}t(p,function(n,t){l[t]=0;var a=n.classList;a.add("tg-sort-header"),n.addEventListener("click",function(){var n=l[t];!function(){for(var n=0;n<h;++n){var r=p[n].classList;r.remove("tg-sort-asc"),r.remove("tg-sort-desc"),l[n]=0}}(),(n=1==n?-1:+!n)&&a.add(n>0?"tg-sort-asc":"tg-sort-desc"),l[t]=n;var i,f=g[t],m=function(r,t){return n*f[r].localeCompare(f[t])||n*(r-t)},T=function(n){var t=d(n);if(!r(t)){var u=o(n),a=o(n.map(e));t=d(n.map(function(n){return n.substring(u,r(n)-a)}))}return t}(f);(r(T)||r(T=r(u(i=f.map(Date.parse),isNaN))?[]:i))&&(m=function(r,t){var e=T[r],o=T[t],u=isNaN(e),a=isNaN(o);return u&&a?0:u?-n:a?n:e>o?n:e<o?-n:n*(r-t)});var C,L=N.slice();L.sort(m);for(var E=v;E<c;++E)(C=s[E].parentNode).removeChild(s[E]);for(E=v;E<c;++E)C.appendChild(s[v+L[E-v]])})})}}n.addEventListener("DOMContentLoaded",function(){for(var t=n.getElementsByClassName("tg"),e=0;e<r(t);++e)try{v(t[e])}catch(n){}})}(document)</script>
I left the Users part in blank in the Display Rules setting.
Hi there,
if you view the page whilst you're logged out, Right Click > Inspect that page to open the developers tools. You will see in the Console tab a red error:
Uncaught SyntaxError: Invalid or unexpected token
If trace the error it relates to the && in your script some of which has been escaped like so:
var TGSort=window.TGSort||function(n){"use strict";function r(n){return n?n.length:0}function t(n,t,e,o=0){for(e=r(n);o<e;++o)t(n[o],o)}function e(n){return n.split("").reverse().join("")}function o(n){var e=n[0];return t(n,function(n){for(;!n.startsWith(e);)e=e.substring(0,r(e)-1)}),r(e)}function u(n,r,e=[]){return t(n,function(n){r(n)&&
somewhere the && has been escaped to &&
And the obvious culprit is the SG Optimizer. Try disabling that and clear the browser caches and check if the error has cleared.
Hi David,
I disabled the SG Optimizer plugin and the problem got resolved right away. Thanks for your help.
One question, do I need the SG Optimizer plugin? It has some settings around caching and speed optimization.
Thanks,
Hi Dawei,
SG Optimizer is a caching/optimizations plugin. In general, caching and optimization plugins are added to websites to allow the website to perform better.
Optimization/Caching plugins have different functionalities to make the website perform better like caching, removing unused CSS, combination of JS/CSS files etc.
However, sometimes, some of the functions offered by these plugins break a website.
Often culprits are removing unused CSS and Combination/merging of css/js.
You can test the performance of your site through a site like https://pagespeed.web.dev/ and see the difference if you have a caching/optimization plugin vs without.
An example of a configuration for caching/optimization plugins is this one suggested for autoptimize: https://docs.generatepress.com/article/configuring-autoptimize/
In essence, using a caching/optimization plugin can speed up your website, but you’ll need to be wary of the functionalities it offers and which one to use.
Hope this clarifies!
Thanks again, very helpful.
I am closing this one as resolved.
You’re welcome Dawei!