Skip to main content

Command Palette

Search for a command to run...

How to Customize Your Hashnode Navbar

Learn how to add your social media and your blog series links to your Hashnode navbar.

Updated
โ€ข2 min read
How to Customize Your Hashnode Navbar
A

Hi, I'm Alex Kates ๐Ÿ‘‹ I'm a product engineer currently working at Croissant as a Founding Engineer. I'm addicted to writing about building, and building things worth writing about. Some extracurriculars include AWS Community Builder Instructor at MIT xPRO Bootcamp Volunteer at Tech for Campaigns

In this post, we are going to learn how to add external links and blog series links to the Hashnode navbar.

Adding custom navbar links to your blog's home page is a great way to direct your readers to all of your other work!

Let's take a look! ๐Ÿ‘‡

Hashnode Navbar with Social Links

Finding your Navbar Settings

To start, we will need to navigate to your Blog Dashboard.

There are actually two ways to get here ...

The first way is to go to your Blog Home e.g., https://alexkates.dev, and click the toolbox icon in the top-right of the page.

Hashnode Blog Dashboard Icon in Header

The second way is to click your logo in the bottom-left of the page and then click Blog Dashboard

Hashnode Blog Dashboard from Logo Menu

Now that we are in our Blog Dashboard we will need to navigate to the Navbar section.

Navbar Menu Item

Adding an External Link

Start by clicking Add an Item at the bottom of the page.

Add a New Navbar Link

For a new External Link, make sure the type dropdown is set to Link.

The label will be the text shown in your Navbar e.g., Twitter.

The value will be the actual URL e.g., https://twitter.com/thealexkates.

The priority is how you control the order of your links. The highest priority is always the left-most link.

New Navbar Link Options

Don't forget to click Save when you are finished.

Adding a Series Link

For a new Series Link, follow all of the steps from the External Link except for a couple of options.

The type dropdown will be Series instead of Link.

The value will be a dropdown with any series you've created in the past.

Blog Series Link

Wrapping up

I hope this post helps you re-think how you are using your Hashnode navbar! Please consider following me at https://alexkates.dev/

M

Great article again Alex. I am sure I will put a custom link into my navbar.

1

Tips for Creating Content on Hashnode

Part 1 of 3

A collection of tips and tricks I've learned while creating content on the Hashnode platform.

Up next

On The Topic of Creating Content

Reflections on a year of content creation.

More from this blog

Alex Kates's Blog

33 posts

I'm a product engineer currently working at Croissant as Director of Engineering.