Hide "Powered by Obsidian Publish" in Obsidian Published Site

In the Obsidian Discord, I've seen a few people ask:

How can I hid the "Powered By Obsidian Publish" banner?

You'll learn:

• Obsidian Publish - making change in publish.css and publishing

What you'll need:

• Chrome (Safari is similar, but different) -VS Code (or some other editor you're comfortable with)

Loom

Updating Obsidian Publish

Now that you know the element selector you want to use (.site-footer), you need to open your Obsidian vault with your editor.

Info

The Obsidian app only supports markdown and image extensions, which is why it doesn't show up in your File Explorer (and can't be opened there).

Once you've opened your vault, check if you have a publish.css in the root of the folder in the Explorer. If it doesn't, you'll need to create one.

Once you have publish.css, click to open it and scroll to the bottom of the file.

For this example, we want to style the .site-footer as hidden:

.site-footer {
	display: none;
}

Once you've added this, save the file and open your Obsidian vault.

Click the Publish changes button (at time of writing it's a paper airplane). When the modal opens, you should see publish.css marked as changed.

Click Publish and go to your Obsidian Published site, refresh the page and the site footer should be hidden!

Info

If you don't see the change immediately, do a hard refresh in the browser so that the files are loaded from the network rather than your browser's local cache.