Code injection - remove post date and reading time

  • What version of Ghost are you using? Last version of Ghost with Casper theme, selfhosted with docker on a Synology NAS (and the domain is behind SWAG reverse proxy running on a raspberry pi, if it matters ;-)

Hi, I’m new to Ghost, but have already use some code injection to hide the author (I’m the only one on this website) and the Subscribe button on the header, using this injected code :

<style>
    a.gh-head-button {
        display: none;
    }
</style>
<style>
.author-list,
.author-name,
.post-card-byline-content span:first-of-type {
    display: none;
}
.post-card-byline-content {
    margin-left: 0;
}
</style>

Is there a similar way to also hide the post date, and the reading time text (everywhere on the website, home, post, pages…).

Thanks for your help.

Hi, no one to give me a tip ?
I’ve looked in the doc, without success…
I’ve tried .post-time, .publishedAt, .post-meta time etc. and every sort of keyword I’ve seen in the source code or elsewhere. I’me sure I just have to found the right “label”, but as I’m not a developper, I don’t know where to look (I’ve past a few hours looking in the github source file, but same failure).

Please, a nice guy/girl to help me ? :slight_smile: Best regards.

Below CSS works for me.
I have not updated Casper for a long time, so if the classes changed recently, this CSS may not catch those sections you are looking to hide

<style>
.post-card-byline-date{
    display:  none;
 }
.byline-meta-content {
	display:  none;
}
</style>
1 Like

Hi kose_mark,
Thank you, it works perfectly.
Best regards, Eric

This also works for Edge theme:

<style>
.post-caption-meta-date {
        display: none;
}
</style>
1 Like

This works for Basho:

<style>
.post-meta-content{
    display:  none;
 }
.post-item-author {
	display:  none;
}
</style>

Basically, if you ‘inspect’ the elements you want to hide, you can grab the ‘meta’ and the ‘author’ parts from there - then just swap out as needed

1 Like

Thanks for explaining how you found the CSS class to hide, because that method will work for any theme.

1 Like

Just to add a couple of things I found useful;

If you only want to hide things on individual pages or posts, then paste your code into the “header” on the admin panel (where you set your url, meta data etc) for that page/post

If you want to do sitewide, paste the code on the global code injection (main admin panel)

Also…you can add additional items to the code…just repeat the same format. I found this really useful, as it saves messing about with .hbs files and way less potential to break stuff.

Also, if you decide later on you want to reinstate the “original” setup, all you need to do is remove the code you pasted into the header / code injection