Casper - insert banner on very top of site above nav bar

Hi, I am using Casper v5.7.4

On a give URL (not side wide) I want to be able to insert banner ads on the very very top of the site, above the navigation menu even.

Is there any easy way to do this? I am on the starter plan so don’t think can upload custom themes.

Willing to do whatever it takes to solve this though, even if it means changing theme entirely or upgrading my plan.

If solving this is complicated can potentially hire someone to implement it.

Thanks for the help

You can run javascript in code injection, and you can use that javascript to insert a new section containing your banner. If you want the banner on a page, then you could put that code injection just on the page’s code injection (in the footer, so the page will be there to modify). If you want it on an index page, you’ll have to detect the URL or some tag present only on that index page, and put the code in the site-wide footer.

If you’re handy with javascript, perhaps that’s enough of a nudge to get you started. :) If you want to hire someone, I’ve got an intern without enough work queued up for the end of the week. :slight_smile:

1 Like

thanks, this is helpful, appreciate the help!

1 Like

You can still use the Ghost announcement bar to insert an announcement, and use the following code to control the display of the announcement bar on the page:

Put this into the Ghost settings > code injection > site header

<!-- Hide announcement bar -->
<style>
  #announcement-bar-root {
    display: none;
  }
</style>

Replace the https link with your desired link and put this into the ‘site footer’:

<!-- Display announcement bar -->
<script>
  if (window.location.href === "https://ghosttest.rakihub.com/") {
    const style = document.createElement('style');
    document.head.appendChild(style);
    style.sheet.insertRule('#announcement-bar-root { display: block !important; }', 0);
  }
</script>
1 Like