Build Svelte Kit Frontend for your Wordpress Project
Free download and open source code svelte kit frontend project for your backend wordpress cms.

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 !!

Thank You by using Svelte kit frontend for Wordpress CMS project

We hope with this source code you can build modern frontend website for your wordpress project.