Deployment · Wooprex Docs

Which files to upload

Format	Build command	Upload
HTML	None	The template folder's contents. You can leave out `scss/` and `.map` files.
Next.js (static export)	`npm run build`	The contents of `out/`
Vue	`npm run build`	The contents of `dist/`

Other products, such as scripts and back ends, run on a server. See their category's setup guide, for example Scripts & Source Code.

Shared hosting

This works on hosts with a control panel, such as Hostinger or cPanel.

Build the site if your format needs it.
Open your host's File Manager, or connect with FTP.
Go to the web folder for your domain, usually public_html.
Upload the files so that index.html is directly inside that folder, not inside another folder.
Open your domain and click through the pages.

Zip them first, upload the ZIP, and extract it in the File Manager. It is much faster than uploading thousands of small files.

Vercel, Netlify and similar platforms

Connect your Git repository, or upload the build folder. Use these settings if you are asked:

Format	Build command	Output folder
Next.js	`npm run build`	`out`
Vue	`npm run build`	`dist`
HTML	Leave empty	The project root

Vue: make reloads work

Vue templates use clean addresses such as /about, which only exist inside the app. The server has to answer every address with index.html, or reloading a page shows a 404.

Apache or LiteSpeed

Add a .htaccess file next to index.html:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

Nginx

location / {
  try_files $uri $uri/ /index.html;
}

Netlify

Add a file named _redirects to public/:

/*  /index.html  200

Publishing in a subfolder

If your site lives at an address like example.com/shop/ rather than the domain root, tell the project before building:

Vue: set base: '/shop/' in vite.config.js, pass the same path to createWebHistory(), and change RewriteBase and the last rule in .htaccess to match.
Next.js: set basePath: '/shop' in next.config.ts.
HTML: nothing to do, because its paths are relative.

Forms need a back end

Website templates and landing pages come with designed forms, but a form in a browser can't send email on its own. Before you launch, connect each form in one of these ways:

A form service. Create a form with a service such as Formspree or Netlify Forms, and use the address it gives you as the form's action. This needs no server code.
Your own script. On PHP hosting, post the form to a PHP file that validates the input and sends the email.
Your own API. Send the form data with JavaScript to an API you run.

Whichever you choose, check the input on the server, add spam protection, and send a test message before going live.

Before you go live

Replace the demo logo, favicon, text and images
Set a page title and description for each page
Connect the forms and send a test message
Turn on HTTPS with your host's SSL option
Update the sitemap address. On Next.js, this is siteUrl in next-sitemap.config.js
Remove demo pages you don't use, and their links in the menu
Test on a phone, and click every link in the menu and footer