WebTuyo Installation Guide — Part 2
Step 1 — Create a Cloudflare Pages Application
- Go to your Cloudflare dashboard, under Workers and Pages.
- Click “Create Application.”
- Select Pages, under Import and Existing Git Repository, click “Get Started.”
- Click “Connect to GitHub.”
- Choose your organization.
- Under permissions, select “Only selected repositories.”
- Choose the repository that ends with
_wt_public. - Click “Install and Authorize.”
- Once authorized, select the
wt_publicrepository again. - In Build Settings, open Root directory (advanced).
- In the path field, type
public. - Click “Save and Deploy.”
Wait for the deployment process to finish,
then click “Continue to Project.”
Step 2 — Configure Build and Branch Settings
- Go to Settings.
- Under Branch Control, uncheck “Enable automatic production branch deployment.”
- In Preview Branch, select “None.”
- Click “Save.”
Step 3 — Create a Deploy Hook
- Go to Deploy Hooks.
- Click “+” to create a new hook.
- Give the webhook a name.
- Select
mainin Branch to build. - Click “Save.”
- Click the copy button to copy the webhook URL.
- Go to your Worker settings (from Installation Part 1).
- Edit the variable
CLOUDFLARE_PAGE_DEPLOY_HOOK_URL. - Paste the URL into the Value field.
- Click Deploy.
Step 4 — Set Up a Custom Subdomain
Before continuing, make sure your domain is already added to your Cloudflare account.
- Go to Workers & Pages, select the project you just created.
- Open Custom Domains, then click “Set up a custom domain.”
- In the field, type
static.followed by your domain. - Click “Continue.”
- Click “Activate Domain.”
- Wait for the process to complete (usually within 15 minutes).
Once done:
- Go back to your Worker settings from Installation Part 1.
- Edit the variable
CLOUDFLARE_PAGES_URL. - Set the value to your subdomain — starting with
https://and with no spaces. - Click Deploy.
Step 5 — Import a New Repository
- Go to github.com/new/import.
- Copy this repository URL : https://github.com/webtuyo/webtuyo-worker-view.git and paste it into the source repository URL.
- Give your repository a name.
- Set visibility to Private.
- Click “Begin Import.”
- Wait for the import to complete.
Then:
- Go to your Cloudflare dashboard.
- Copy your Account ID (from the browser’s address bar).
- Return to your new GitHub repository.
- Go to Settings → Secrets and variables → Actions.
- Click “New repository secret.”
- Set Name:
CLOUDFLARE_ACCOUNT_ID. - Paste your Account ID into the Secret field.
- Click “Add Secret.”
Step 6 — Create a Cloudflare API Token
- In your Cloudflare dashboard, go to Manage account → Account API Tokens.
- Click “Create Token.”
- Choose “Custom Token.”
- Click “Get Started.”
- Give your token a name.
Under Permissions:
- Account → D1 → Edit
- Click “Add More”
- Account → Workers KV Storage → Edit
- Click “Add More”
- Account → Workers Scripts → Edit
Set an expiration date (recommended).
Click “Continue to Summary,” then “Create Token.”
Copy the token.
Then, go back to your GitHub repository secrets and add:
- Name:
CLOUDFLARE_API_TOKEN - Secret: paste the token
Click “Add Secret.”
Step 7 — Deploy the New Cloudflare Worker
- Go to Actions in your GitHub repository.
- Select “Deploy Cloudflare Worker.”
- Click “Run Workflow.”
- Choose a unique name for your new worker (different from Installation Part 1).
- Enter your domain, starting with
https://. - Click “Run Workflow.”
- Wait for the workflow to complete.
Once done:
- Go to your Cloudflare dashboard.
- You’ll see the new worker installed.
- Open the worker, click “Add Binding.”
- Select KV Namespace.
- For variable name, write
WEBTUYOKV(all caps, no spaces). - Under KV Namespace, select the one created in Installation Part 1.
- Click “Add Binding.”
Now go to Settings → Domains & Routes, click “Add.”
- Zone: select your domain
- Route:
static.[YOUR DOMAIN]/site.json - Failure Mode: select Fail Open
Click “Add Route.”
Step 8 — Buy and Install the WebTuyo Renderer
- Purchase a WebTuyo Renderer license.
- Enter your email and follow the link you receive.
- Enter your domain (make sure it’s registered).
- Click Next.
- Confirm your domain and click “Proceed to Checkout.”
- Complete the form using the same email address.
- Click “Complete Order.”
- Follow the activation link in your email or go to webtuyo.com/activate.
- Confirm your domain again, read the Terms and Conditions,
then click “Activate and Download.”
In the popup, enter your Site Data URL: https://static.[YOUR DOMAIN]/site.json
Click “Download.”
This will download the WebTuyo Renderer software and its license.
Step 9 — Host the Renderer for Free Using Cloudflare Pages
- Go to your Cloudflare dashboard → Workers & Pages → Pages.
- Under “Drag and drop your files,” click “Get Started.”
- Enter a project name (any name you prefer — we suggest using your website name for consistency.).
- Click “Create Project.”
- Under Upload your project assets, click “Select from your computer.”
- Choose “Upload ZIP.”
- Select the ZIP file you downloaded earlier.
- Click “Deploy Site.”
- When the deployment completes, click “Continue to Project.”
- Go to Custom Domains, enter your domain, and click “Continue.”
- Click “Activate Domain.”
Deployment may take up to 48 hours but usually finishes within 15 minutes.
Step 10 — Publish Your Website
- Go back to your Web Builder.
- Update your project.
- Publish your website.
When you visit your domain, your site will be live and updated with your latest changes.
You’re all set! 🎉