Skip to main content

Update Docusar Version

When we release a new version of Docusar, it usually contains bug fixes, design improvements, or new features. You may want to update your project to get the latest version.

The good news: you do not need to touch your content files when updating. This guide explains where to put your content, so updating is easy and safe.

What You Edit vs What We Update​

Before updating, it helps to understand which files are "yours" and which files are "ours."

Your Files (Content) - Safe to Keep​

These are the files you edit every day. When you update Docusar, you keep these files exactly as they are.

  • data/ - All JSON files that control the homepage, about, product, and other page content
  • docs/ - All your documentation articles in Markdown
  • blog/ - All your blog posts in Markdown
  • src/pages/*.md - Markdown-based static pages like basic.md, standard.md, pro.md
  • static/img/ - Your uploaded images, logos, and favicons

Our Files (Theme and Code) - Replaced on Update​

These are the files that we improve or fix in each new version. When you update, these files get replaced with the newer ones.

  • src/components/ - All React components that build the homepage sections (Header, Intro, Plan, Section, Product List, Contact List)
  • src/css/custom.css - Global theme CSS
  • src/pages/*.js - React page files like index.js, about.js, product.js, contact.js, order.js, cms.js, webdev.js
  • docusaurus.config.js - Main site config (unless you have heavily customized it)
  • sidebars.js - Sidebar structure for docs (unless you have customized it)

The safest way to update is to replace only the "our files" and keep your "your files" untouched.

Step 1: Backup Your Project​

Before doing anything, make a copy of your whole project folder. Rename it to something like docusar-backup-2026-06. This way, if anything goes wrong, you can always go back.

Step 2: Download the New Docusar Version​

Download the latest ZIP from the same place you bought Docusar (Gumroad). Extract it to a new folder, for example docusar-new.

Step 3: Copy "Our Files" into Your Project​

Open both folders side by side:

  • Old project: docusar (your current site)
  • New version: docusar-new

From docusar-new, copy the following folders and files into your existing docusar project, overwriting what is there:

  • src/components/ (the whole folder)
  • src/css/custom.css
  • src/pages/*.js (only the .js files, NOT the .md files)
  • docusaurus.config.js (only if you have not customized it much - see note below)
  • sidebars.js (only if you have not customized it)

Important: Do NOT copy the data/, docs/, blog/, src/pages/*.md, or static/img/ folders. Those are your content and must stay exactly as they are.

Step 4: Check docusaurus.config.js and sidebars.js​

These two files are special because you may have customized them (title, navbar, footer, sidebar order, etc). If you have:

  1. Compare the new docusaurus.config.js from docusar-new with your current one
  2. Look for any new configuration or updates we made
  3. Manually merge the changes into your current file - keep your custom title, URL, navbar, footer as they are, but add any new settings we introduced

If you have not customized them at all, you can safely overwrite them with the new version.

Step 5: Install Any New Dependencies​

Sometimes a new version adds a new package. In your terminal, inside your project folder, run:

npm install

This will download any new package we added.

Step 6: Run and Test​

Start your project:

npm run start

Open http://localhost:3000 and check:

  • Homepage looks correct
  • About, Product, Contact pages look correct
  • Docs and blog pages still work
  • Your content is unchanged

If everything looks good, you have successfully updated Docusar.

Quick Reference Table​

Folder / FileYours or Ours?On Update
data/YoursKeep as is
docs/YoursKeep as is
blog/YoursKeep as is
src/pages/*.mdYoursKeep as is
static/img/YoursKeep as is
src/components/OursReplace with new
src/css/custom.cssOursReplace with new
src/pages/*.jsOursReplace with new
docusaurus.config.jsSharedMerge manually
sidebars.jsSharedMerge manually

Notes​

  • Always back up before updating. It takes one minute and saves hours.
  • If you have heavily customized the React components in src/components/, updating will overwrite your changes. In that case, review the differences carefully before replacing.
  • If you only use Docusar for content (docs, blog, and JSON data), updates are extremely easy - you only replace the theme files and keep your content untouched.

Summary​

Docusar is designed so that your content lives separately from the theme code. That means you can update the theme without ever touching your docs, blog, or JSON data. Just remember: backup first, replace only "our files," and keep "your files."