Hey Forem Creators!
Now that your own Forem is up and running, this quick tutorial will show you how to customize your site’s navigation with your most important links. . Luckily, adding navigation links is quick and simple.
You can read more about our Navigation Links on our Admin Documentation - Let's dive in!
Do you prefer watching video tutorials? Click the image below to watch!
Getting Started
First, sign in to your admin account. Then, head to the admin navigation links page, /admin/customization/navigation_links
Creating a new navigation link
Click the "Add Navigation Link" button towards the top of the page.
You'll be greeted with a modal that's going to request some information from you.
Let's take a quick look at the fields here:
Name - The name of the navigation link
URL - The URL of the navigation link
Icon - The icon, we recommend a 36x36 SVG or an SVG from the Twemoji library
Section - This lets you choose whether you want the link to be in the "Default" column or "Other" column
Position - This is the hierarchy in which the link will sit on the navigation bar. If left blank, the link will sit at the bottom of the list.
Display only when signed in - This ensures that the link is only displayed to users who've signed in.
Fields marked above with italics are not required
Finding SVGs
We recommend the Twemoji project for SVGs.
- Find the SVG you'd like to use here (right click and save the image to get the file name)
- Use the file name to find the SVG file in the proper folder
- Once you've found the SVG, copy the code
- Enter the copied code into the Icon text box.
After filling out the required fields, click the "Add Link" button and navigate back to your home page.
You'll see your newly added link there!
Top comments (1)
I liked this post enough already, but that GIF just sealed the deal. 😎