Removing Powered by Ghost

Using Ghost
24

This didn’t work for me. I’m not sure how it would either as the code injection doesn’t seem to apply to the content within the iframes.

The solution proposed by @GBJsolution above does work (though I see the Powered by Ghost flash up for a second) but it would be nicer if Ghost actually allowed a way to change the CSS in these injected iframes.

It would be nice for example to also be able to make the sign in/ sign up modals match the theme. I can’t see an easy way to do that right now.

Is there a reason that these modals don’t source the CSS files that are used by the rest of the site? That way it would be easy to hide “Powered by Ghost” as well as customise the look/ feel of the modals.

25

This hasn’t worked for me either.

26

You can remove it by deleting that tag directly from the theme you’re using.

27

No I don’t think that will work. The Portal is not part of the theme.

I did some more digging and found this thread:

Which has more useful detail but importantly, context. Seems like its a conscious decision on the part of the Ghost team.

I’ve taken the approach of downloading the portal JS file, making my changes and hosting it myself and then setting my config to use it.

I’ve changed to a dark theme doing this and removed the “Powered by” items also. Its pretty easy to do but just feels a bit “wrong”.

I can also no longer find an up to date repo for the portal. Is this no longer open sourced? The one linked to in the post above is not longer active and a major version behind what is current.

It’s a shame if the portal is no longer open sourced. Would be good to understand the Ghost teams reasoning behind this as it seems a bit at odds with the approach to everything else which allows you to customise/ self host etc.

28

The Portal code is in the big Ghost monorepo, here:

Looks like there was a release yesterday, so I’d call that still under development. :)

29

Ah brilliant. Thank you @Cathy_Sarisky

I was looking at this one:

which is referenced somewhere in the thread I linked to above.

31

  • To remove ‘Powered by Ghost’ from the homepage, you can try this

  • To remove it from the email newsletter, you can switch it off through Ghost settings. Check this for more details

  • To remove it from subscribe or sign in page, you can copy and paste the code in this article

4 Likes
32

Keep with pride powered by Ghost… If you were paying for Arc publishing or newspack would you remove It?

34

This selector works for me.

<style>
      .gh-footer-copyright {
              display: none; !important
      }
</style>
35

I’ve expanded upon @GBJsolution’s code and made it apply the styling instantly by using event listeners. I also demonstrate how to style the portal as well as the search bar ON TOP of removing the watermark.

See my public GitHub post about it here: ghost-portal-theme-guide/README.md at main · x032205/ghost-portal-theme-guide · GitHub

The code you’re looking for is:

<script>
  window.onload = function () {    
    // Inject Portal Styles
    const portal = document.getElementById("ghost-portal-root");
    if (!portal) return;

    const portal_observer = new MutationObserver((mutationsList) => {
      for (const mutation of mutationsList) {
        if (mutation.type === "childList") {
          const frame = portal.querySelector('[title="portal-popup"]');
          if (frame) {
            frame.addEventListener("load", () => {
              if (frame.contentDocument) {
                const styleElement = document.createElement("style");
                styleElement.innerHTML = `
                  .gh-portal-powered { display: none; }
                `;
                frame.contentDocument.head.appendChild(styleElement);
              }
            });
          }
        }
      }
    });

    portal_observer.observe(portal, { childList: true, subtree: true });
  };
</script>