Understanding Bullet dashboard

Setting up your website header

After creating your site, navigate to your “Navbar” Section from the Bullet’s sidebar.
Here you can start customizing brand details, navigation links and CTA buttons with their corresponding texts to your header.

Brand Details:

Customize the branding of your website:
1.00
  • Logo: You can add text or an image as your logo, which will be displayed on the top left corner of your header. You can adjust the width of this logo from the theme settings.
  • Site Search: You can enable a site-wide search functionality by enabling the “Site Search” option. This will allow users to easily search any page on your site with keywords.

Navigation Links:

Add navigation links to other pages from the navbar links section.
1.00
  1. Title: Type in the name of your navigation link.
  1. Type: Select the type of navigation link. You can select one of your website’s pages directly or paste the URL of a page. You can also choose a dropdown and categorize your navigation links.
  1. URL: Used to choose a page from your existing website pages or paste a URL directly.
Now, click the ‘add’ button to create a navigation link. After adding, you can choose whether that particular link can be opened in a new tab or not by enabling the checkbox.
Note: Don’t forget to save the progress before moving to the next section or publishing the changes you’ve made.

Call-to-Action

Configure your CTA buttons from the Call-to-Action section.
1.00
  • Adding your CTAs works the same way as adding navigation links, only the CTAs show up as buttons instead of links.
You can also customize the appearance of the navbar, like changing the background color, adjusting its size, adding a glass effect, and many more, using custom code that is all explained in a detailed manner here.
NOTE: Don’t forget to hit “Save” after every change and then “Publish” to see results on your live webpage.

Setting up your footer

  1. After creating your site, go to Site Settings
      2. 1.00
  1. Open the Footer section. By default, the footer will be empty.
      2. 1.00
  1. To add a footer, open the dropdown menu and choose either Single Row or Multi-Column.

Links:

Add navigation links to other pages in your Footer section.
1.00
  1. Title: Type in the name of your navigation link.
  1. Type: Select the type of navigation link. You can select one of your website’s pages directly or paste the URL of a page. You can also add a column and categorize your links.
  1. URL: Used to choose a page from your existing website pages or paste a URL directly.
  1. New Tab: Allows you to open your Footer links in a new tab for a seamless browsing experience.
  1. Action: Used to add new navigation links or remove the existing ones.
Hit “Add” after each entry.

Social icons:

Add social icons in your footer.
1.00
Icon: You can choose your social platform from the available dropdown. Bullet supports a total of 11 social platforms including Facebook, Instagram, LinkedIn, Twitter, Behance, Github and more.
URL: Copy/Paste your social URL here and hit add to add it to your footer

Copyright:

Add a copyright disclaimer to your website footer using this option. we add a default one using your site name.

Newsletter/CTA Embed

1.00
The last part of the Footer customization comes with an HTML box. You can add anything and everything here, right from your essential CTAs, newsletter signups, or comments widget for your blog.
NOTE: Don’t forget to hit “Save” after every change and then “Publish” to see results on your live webpage.

Adding your logo to your Notion site?

  1. Go to the navbar and scroll down to the brand section.
  1. Now, select "Logo" under Type and click "Upload".
      2. 1.00

Add a favicon and social share thumbnail

  1. Go to “Site Settings” → ”Favicon & OG Image” of your website.
      2. 1.00
  1. Upload the corresponding images using the buttons beside each option.
Note: If you don't upload the Favicon, Notion's page icon will be used by default.

Custom code

Bullet's advanced customization through custom code snippets allows for a powerful and efficient website design to meet the specific needs of your website.

Adding Custom Code in Bullet Dashboard

  1. Go to your Bullet dashboard and open the Site Dashboard.
      2. 1.00
  1. Click on Code Editor to enter your custom code.
      2. 1.00
You can add your custom code under three categories:
  1. Head adds the code at the end of <head> section (just before closing </head> tag)
  1. Body adds the code at the end of <body> section (just before closing </body> tag)
  1. CSS adds the styles at the end of the <head> tag wrapped with the <style> tag.
Legacy User

Setting up your footer

Bullet's advanced customization through custom code snippets allows for a powerful and efficient website design to meet the specific needs of your website.
You can add your custom code under three categories from the Bullet dashboard:
1.00
  1. Head adds the code at the end of <head> section (just before closing </head> tag)
  1. Body adds the code at the end of <body> section (just before closing </body> tag)
  1. CSS adds the styles at the end of the <head> tag wrapped with the <style> tag.
You can also add custom code separately for individual pages within your website from the Bullet dashboard.

How to add a site search functionality in Bullet?

You can add a site-search functionality on your website for better navigation by enabling a simple toggle in the Bullet dashboard:
  1. Go to the Navbar settings of your site and scroll down to the brand section.
  1. Now, enable the toggle beside the site search option as shown in the figure below.
      2. 1.00

Multiple languages for your Website

The Multilingual Sites feature in Bullet lets you build websites in multiple languages. You can assign language tags to specific parts of your site, making it easy for visitors to navigate in their preferred language.
1.00
To set up multilingual content for your site, follow these steps:

1. Enabling the Multilingual Feature

  • Go to your Bullet dashboard and open the Site Dashboard.
      • 1.00
  • Navigate to Settings > General of your site.
      • 1.00
  • Toggle the “This is a multi-lingual site” option to enable the feature.
      • 1.00

2. Adding Languages & Assigning Paths

Once the multilingual feature is activated:
  • Click “Add Language” and select the languages you want to support.
  • Assign language tags to specific pages by defining a path in the language settings.
Understanding Path Property & Labels
  • Language Label: This is the name displayed in the language switcher. For example, adding "Español" (Spanish) as a label will show it in the language switcher menu.
  • Path Property: This determines which section of your site appears in a specific language.
      • Example: If you set /es as a path for Spanish,
    • The language switcher menu will point to /es when clicked on that Language.
    • All the pages under /es (like /es/blog, /es/about) will have the HTML lang=“es” tag set, so that Google understands this part of the website is in Spanish.

3. Adding Multilingual Pages in Notion

  • Create a new page, add content in the target language, and set the path accordingly — for example, /es/home for Spanish or /ko/home for Korean
1.00

4. Customizing Navigation & Footer for Each Language

Each language can have its own custom navbar and footer.
  • Once you add a new language as mentioned above, navigate to your Navbar options, and you will see the option to configure a language-specific navbar.
  • Example:
    • For English, your navbar may have: Home | Blog | Contact
    • For Spanish, you can customize it as: Inicio | Blog | Contacto
Preview of Multilingual Navbar & Language Switcher:
1.00

5. Saving & Publishing Changes

  • Click Save after setting up languages, paths, and navigation.
  • Click Publish to apply the changes to your live site.
Once published, a globe icon will appear in the top-right corner of your site. Visitors can click it to switch between available languages, displaying only the content assigned to their selected language.
1.00
For a detailed, step-by-step guide on creating a multilingual site, check out our blog.

Setting up the Sidebar for your site

A vertical menu on the side of a webpage for additional navigation or information.
Bullet user can now enable a native sidebar to their site, which will be the advanced level of navigation.
notion image
Follow these simple steps to activate it:
  • Navigate to the Sidebar in the Bullet Dashboard.
  • Toggle the switch for "Enable Sidebar" to activate the native sidebar for your site.
  • After you enable this feature, you'll be presented with a list of customizable options to tailor your sidebar:
    • Icon
    • Title
    • Type (URL, page, heading, or dropdown). See the next section for the definition.
    • Link (based on the chosen type)
  • Once you've configured the desired options, be sure to click "Add".

Types

There are four types of elements that you can add to the sidebar:
  • Heading: Used to add headings in the sidebar to categorize a set of links.
  • Dropdown: Used to show an accordion or dropdown menu and group links in the sidebar.
  • Page: Used to add a link to one of the pages inside the website.
  • URL: Used to add an external URL.
You can combine and mix these types to create the desired structure in the sidebar.
That's it! Your native sidebar is now live on your website, providing enhanced navigation for your visitors.
NOTE: Don't forget to hit "Publish" to see results on your live webpage.