Custom Code for <head> of singe page

Hi, there is an option to add custom code to all the pages, but If I just want it on one page in the is there a way?

HI @thefallenone

Since we are using SPA technology, it’s not possible to add custom code per page, but, what can you do, is run a JavaScript code per each page individually which can get’s you similar effect as you want.

Is that something that may benefit you?

Thanks, I am not sure now, but how would I achieve it? Using Embed?

@thefallenone

There are several options, embed is one of them, so you can use that one for now.

You can also create JS File inside builder and use onPageReady event, then do something like.

Edit:
Added new working script to check for a specific page based on route:

if(data.page.Get('route') === '/') // Example for homepage
{
// This code will be run only on Homepage
}

if(data.page.Get('route') === '/some-other-page') // set page route
{
// This code will be run only on page with route/url 'some-other-page'
}

And last and probably best way is (but this is coming out soon - probably tonight) is in Page Settings write code and that code will execute only on that page automatically.

1 Like

Thank I’ll wait for the new feature. You guys are awesome!!!

2 Likes

Hey guys, any update on this feature. This would be very useful for my use case.

Hey,

We didnt implement this yet. So far only solution is what Dejan suggested above, to wrap your code inside IF, to run code only on certain page

Edit:
Add new working script to check for a specific page based on route:

if(data.page.Get('route') === '/') // Example for homepage
{
// This code will be run only on Homepage
}

if(data.page.Get('route') === '/some-other-page') // set page route
{
// This code will be run only on page with route/url 'some-other-page'
}

I’ve tried both ways, the Embed and wrapped code on the specific page, not sure why it’s not working, below is the wrapped code I used for the “custompage”:

the “script” needs to be before “end of body” for it to deploy properly, but I’m not sure how the wrapped code is executed.

It works if i setup it like this on the “Custom Code” but for the whole site:

Not sure how to make it work for the one specific page?

@aizona

Have you tried adding Embed tag on end of page?

Yes, same thing, nothing happens.

@aizona

What’s the page URL where you are trying to add that snippet?

There’s supposed to be a chatbot bubble at the bottom right corner of this page:

@aizona

The iframe get’s loaded, also the AI chat bot, but for some reason it doesn’t work.

Have you tried removing script that you added from Admin panel custom code? Maybe it’s not possible to have both loaded at same time.

There is no script in the Admin, i removed moved that already.

That works, hvala Stefane :slight_smile:

1 Like

@aizona

We will make much easier way of loading scripts and custom code, it’s because of SPA so it’s bit complicated but there’s a ways how to simplify it for sure.

1 Like

Another question, if I want to load another chatbot on the homepage and other linked pages how do i do it? so the aizona.ai/divhuntai will have it’s own chatbot and the main website and it’s related pages will have another chatbot, with a unique tenantID. I tried to modify the code as below, including the new unique tenantID, but that didnt work. It overwrites the chatbot on the /divhuntai page.

You can try something like this

let routes = ['page1', 'page2', 'page3', 'page4'];
let currentRoute = data.page.Get('route');

if (routes.includes(currentRoute)) {
    // if current page is one of the ones routes array, this code will run
} 

Have you determined that it is too difficult with SPA technology to create the feature of adding custom code to the head of individual pages? I have multiple landing pages on one site and each page needs its own unique code in the head section so that clicks on links can be recorded in 3rd party tracking software. I watched the video you created for AIZ in Aug '23 and concluded that I can’t use that method because I don’t know JavaScript. Page builder Convertri has that feature as does Wordpress, but I love DivHunt and want to continue using it.

Here is the simple code required by the tracking software ClickMagick:
"

"

Can you provide the JavaScript required to make that code available on each landing page?