V4 upgrade - Disable / remove SUBSCRIBE button / memberships?

Developer help
1

So I’ve just done the upgrade to v4 - thankfully on a test blog. (I know - where have I been!).

Just wondering - is there any way to turn OFF the Subscribe button and associated Membership features? My users might want to take this up - but it was unexpectedly forced ON at upgrade from v3 to v4…

TIA
Jeff

2

P.S. - Yes, I have looked through the Settings

3

Apologies for answering my own question. Reading through recent forum threads, it seems there is already a feature request for this in the pipeline.

As I use the default Casper theme (which is pretty fab :slight_smile: ) , the simple fix is some temporary code-injection. This is what I ended up with so far:

<style type='text/css'>
    .footer-cta,
    .gh-head-actions,
    .site-footer a[href^="https://ghost.org"] { display: none; }
    .gh-head-inner { grid-template-columns: auto auto; }
    .gh-head-brand { max-width: 400px; }
    .gh-head-menu { justify-content: flex-end; }
</style>

Notes:

  1. This hides the action-menu completely, so may hide the Social buttons if you are using them.
  2. I increased the width of the home aka brand link, as that was wrapping badly for my users.
  3. I have right-aligned the navigation menu. Seems to work ok on mobile as well as desktop.
4

This works better if you need to keep the Social icons (e.g. Facebook etc.) in the Actions menu:

<style type='text/css'>
    .footer-cta,
    a.gh-head-button,
    .site-footer a[href^="https://ghost.org"] { display: none; }
    .gh-head-brand { max-width: 400px; }
</style>
1 Like
5

Or just only remove the subscribe button:

<style type='text/css'>
    a.gh-head-button { display: none; }
</style>
6

So after doing a dozen blog upgrades from Ghost v3 to Ghost v4/Casper v4, this worked best overall:

<style type='text/css'>

    /* Hide the Membership/Subscribe subsystem */
    a.gh-head-button,
    #ghost-portal-root,
    .footer-cta,
    .gh-head-actions,
    .site-footer a[href^="https://ghost.org"] { display: none; }
    .gh-head-inner { grid-template-columns: auto auto; }
    .gh-head-brand { max-width: 400px; }
    .site-footer-nav ul, .gh-head-menu { justify-content: flex-end; }

    /* make serif Article font match sans-serif index page font */
    /* Set font-family on body if you want to tweak it. */
    article.post p {
        font-family: inherit;
    }

</style>
7

For what it’s worth, according to comments on this (unfortunately-named) thread, there will be a graphical option to disable memberships and subscriptions out soon.

The potential issue with CSS fixes is that it only hides the signup form; someone who’s sufficiently motivated (or an automated bot) could still access the URL directly. The best workaround right now is to remove the code from the associated template if you can.

1 Like
8

Ghost 4.4 allows you to disable member subscriptions:

1 Like
9

I’ve just upgraded to 4.4.0, then went into Settings → Access and set to Nobody… but the Subscribe button is still visible, even though it doesn’t do anything. Theme is still Casper 4.0.4 - so I guess we have to wait for that to upgrade too before we drop the code-injection that is hiding the interface elements. :slight_smile:

2 Likes
10

It would good to see a function / feature that takes care of the public preview when the site is set to “Nobody”. As of now, if you have posts set to Members / paid members only and you have inserted the public preview, the post is still “locked” when changing the sign-up.

Point being this;
If and when you want to toggle the members function to be OFF, there’s no option for “fixing” the posts. And since there’s no option for bulk changing certain settings, we have to manually change each and every post - making it accessible.

11
12

It would be nice if we could turn it off for certain pages. I guess you could do that with a custom theme, but I was thinking it would be nice to be able have an array of pages that you could turn off or vice versa.

Would be straight forward I presume - edit the portal script to look for context and then pass in a context to check if you want to hide/show the button.

My use case was I embedded a store in the blog, and now I want to be able to hide that button for that page. Again, I guess I could just modify my shop.hbs - but adding it to the UI shouldn’t be terrible. I have a fork I might work it out and then submit a PR. I am lazy though.

13

This actually is effective to allow you to do something on a page or context. Use the code injection feature.

https://<your_domain>/shop/    

<script>
var el = document.createElement('a');
el.href = window.location.href

var page = el.pathname;
if (page == "/shop/") {
    // code goes here
}

</script>
14

Why not just?

if ( window.location.pathname == "/shop/" ) {
  // code goes here
}
1 Like
15

if you want to hide the pill type button that overlays then add this to the footer of code injection feature within settings:

<style>
#ghost-portal-root {
visibility:hidden;
  }
</style>