Managing Code, Devices, and Best Practices

List view

Getting started
Overview
Creating your first Notion website
Using a Bullet template
Managing content in Notion
Understanding notion structure
Managing images
Auto sync and Publish
Custom 404 page
Managing videos
Bullet AI
Bullet AI Overview
Selecting and Styling Elements
Design Mode
Managing Code, Devices, and Best Practices
Understanding Bullet dashboard
Navbar/Header customization
Footer customization
Logo, favicon, and social share image
Custom code
Add search functionality
Setting up a multilingual Site
Sidebar
Hosting
Adding a custom domain
Hosting in Root or Apex domain
Sub-directory hosting
Managing Page Redirects
Making both APEX and WWW work
Restrict Your Site to a Custom Domain Only
Membership/Content Gating
Overview
Password Protection
Email Confirmation access
Segment-Specific Restriction
Blog
How to set up your blog with Bullet
Understanding the Bullet blog structure in Notion
Post database properties
Authors database properties
Tags database properties
Blog Settings
Knowledge base
How to use the knowledge base plugin?
Category, sub-category and articles
Knowledge Base widget
SEO and metadata
SEO in Bullet
Sitemap and RSS Feeds
Liquid Syntax
What is Liquid syntax?
How do merge tags work?
Hiding blocks in Bullet
Conditionally rendering blocks
Embed HTML inside Notion
API Documentation
Overview
API Authentication
API Reference
Billing
Billing FAQs
How to's
How to unpublish an existing page
Add Buttons inside the Notion website
Show database views as Tabs
Prevent discovery of Notion Page
How to use different templates on the same website
How to add a custom search bar
How to embed forms in Notion and Bullet?
Embedding content in Notion and Bullet
Add a carousel to the bullet site
How to unhide an element or <H1> tag
How to Customize Mobile/Tablet Layout Without Affecting Desktop
How to exclude your own visits from Analytics
How to Set Up Subscription-Based Page Access
How to upload a custom file
Troubleshooting
Missing pages in Bullet, Links pointing to #
Troubleshooting Bullet Block Editor
Notion table instead of a webpage
Themes
Theme settings
Style Application Hierarchy
 

Managing Code, Devices, and Best Practices

All the code that you applied using AI or the editor will go to the CSS tab. You can open Code </> to see the code applied. If you are an advanced user, you can also edit the CSS when needed. At the moment Bullet AI works only for CSS. It doesn’t add Javascript or change the HTML layout of the Notion page.

Code and Changes

  • Click Code to see what styles AI applied.
      • notion image
  • Use the Code Editor (before Publish) to edit or remove styles.
      • notion image
  • Save as Global Code to apply changes across the whole site.

Responsive Styling

  • Styles default to desktop, and desktop changes apply globally across all devices.
  • Switch to tablet or mobile in the toolbar to preview and tweak device-specific changes.
  • If you want changes only for Desktop, you’ll need to add CSS manually.
      • notion image

Best Practices

  • Keep styles consistent for a clean look.
  • Use global styles for common blocks, local styles for one-offs.
  • Always preview before publishing.
  • Combine AI + Design Mode edits for best results.

Credits

  • Each site comes with 100 credits which can see under the Billing section.
      • notion image
  • Credits are used whenever you apply AI styles.
  • Block-level styling uses fewer credits, while page-level styling consumes more.
  • Rejecting or rolling back a style will not refund credits.

Quick Recap

  • Notion = structure
  • Bullet AI = style
  • Design Mode = quick fixes
  • CSS = full control
  • AI = inspiration and combos