BG issue

yariplus

Put something like this in your header.tpl or custom header, to clear the background when a new page is about to load.

$(window).on('action:ajaxify.start', function (ev, data) {
  if (data.url !== 'login' && data.url !== 'register') document.body.background = "";
});

Actually, I suggest you put your whole script in the header. It makes it only load once, and easier to add on to later.

<script>
$(function(){
  function changeIt(){ ... }

  //  Initial load.
  if (app.template === 'login' || app.template === 'register') changeIt();

  // New page loading.
  $(window).on('action:ajaxify.start', function (ev, data) {
    if (data.url === 'login' || data.url === 'register') {
      changeIt();
    } else {
      document.body.background = "";
    }
  });
});
</script>

Gaurav Grv Robinson

@yariplus I am a noob and I am confused. What goes in the header and what part is to be called ?

Putting the entire following thing does not work.

// Initial load.
if (app.template === 'login' || app.template === 'register') ChangeIt();

// New page loading.
$(window).on('action:ajaxify.start', function (ev, data) {
if (data.url === 'login' || data.url === 'register') {
ChangeIt();
} else {
document.body.background = "#f0f0f0";
}
});
});
</script>

yariplus

@Gaurav-Grv-Robinson

document.body.background is actually a url. If you want a color, try changing it to document.body.style.background

Gaurav Grv Robinson

@yariplus said in BG issue:

document.body.style.background

Duly noted. Btw the entire above mentioned code has to go in the header, right ?

yariplus

I put it in the Custom Header section in the acp.

It should work the same if you put it in header.tpl, near the useCustomJS tag

Gaurav Grv Robinson

@yariplus put the entire code in the custom header section, still does not work.

// Initial load.
if (app.template === 'login' || app.template === 'register') ChangeIt();

// New page loading.
$(window).on('action:ajaxify.start', function (ev, data) {
if (data.url === 'login' || data.url === 'register') {
ChangeIt();
} else {
document.body.style.background = "#f0f0f0";
}
});
});
</script>

Gaurav Grv Robinson

@yariplus corrected a stupid mistake and it seems to work now. But there is yet another issue, if any other page is opened first except the login/register page and if from that page the login/register pages are accessed, they get the same bg i.e the one without an image.