themestemplate website themes website template blog themes blog template wordpress svelte svelte kit frontend backend headless cms cms template blog sveltethemes wordpressthemes freethemes

Build Svelte Kit Frontend for your Wordpress Project Content Docs

Documentation # .

How to install and work with Svelte Kit Frontend for your Wordpress Project project.

Note: Make sure you have run WordPress project, before use this source code project, if you need to SEO Wordpress Themes template , so you can download our worpdress template. Download wordpress themes →

Before we start, we need to configure your WordPress Project.

Setup Wordpress Backend Headless CMS # .

Login on wordpress admin ourweb/wp-admin
Activate API plugins

Next we ready to develope svelte kit as frontend for your wordpress project.

Local Installation # .

Need to download Node JS →
Install Node on your local devices
Download Source Code Svelte Kit Frontend Project
Create new project on desktop , name it with sveltewp
Extract and move all source code project to desktop/sveltewp
Need to setup URL API backend website, so you can open your project sveltewp on desktop . and open src/routes folder.
Change API URL on blog.svelte , page.svelte , index.svelte - Change URL API with your Backend WordPress URL and save it.
Now we need to access your svelte project by using terminal, open terminal and run this command cd C:\Users\pcname\Desktop\sveltewp change pcname with your pc name
Now you can run this project with terminal, run this command npm install && npm run dev
Open localhost:3000
Congratulations , you have run your frontend sveltekit website project in your local device.

Make your frontend website online # .

After you have change and configure your svelte kit frontend project, now you can deploy your website . You need to follow this step for deploy your project and make your frontend website live.

Push On Git Repo on Github , Gitlab or Bitbucket
Integration with modern static hosting
Run Deploy Production Mode
Finish

Push on Git Repo # .

Create account on github / gitlab or bitbucket.
Create new repo on github and name it with your project , for example sveltewp.
Back on local devices, Access your project with terminal , run this command cd C:\Users\pcname\Desktop\sveltewp change pcname with your pc name.
Next step we can push this local project in to github /gitlab /bibucket repo. Run this command git init && git add . && git commit -m "my first commit" && git remote add origin https://github.com/username/myrepo git push -u origin main need to change username with your github username , and myrepo with your repo project name , and main with your github repo default branch for example main or master - check on your github repo.
Check your gi repo
Congratulations you successfully for Push from local devices project in to your git repo.
Next step integration with modern static hosting.

Deploy on Modern Static Hosting # .

You can use neltify , vercel , cloudflare pages for deploy your svelte kit frontend project .
Create account with your github account on vercel ,netlify , cloudflare ,then create new project on vercel / netlify , for cloudflare you can create new cloudflare pages.
After you have create new project now you can integration your github repo, select your repo project, and select svelte framework on build production - or you can insert npm run build , then click deploy.
Congratulations your svelte kit frontend website blog is live now !!