Publish a Profile Site with Cloudflare

Publish a profile site from GitHub and verify ownership in Search Console.

Introduction

30 Second Summary

People often meet your work through a link before they ever meet you. That first page needs to feel intentional and trustworthy.

In this project, you will use Safari to publish a one-page profile site from GitHub to Cloudflare Pages. You will then prove ownership of its public address with Google Search Console.

What You'll Build

Share your public *.pages.dev address to show a polished profile page that you can update through GitHub.

By the end of this project, you'll have:

  • Shared a polished HTML profile page that visitors can open from a public web address.
  • Committed an update through GitHub and watched continuous deployment publish the new version automatically.
  • Shown that Google Search Console recognizes you as the verified owner of the exact URL-prefix property.
  • Secret Mission: Expanded the profile into a two-page site with working navigation between the home page and an About page.

Are there any prerequisites?

No prior web development experience is required. Account setup for GitHub, Cloudflare, and Google is included.

Before We Start

Before you publish anything, take a moment to define what your profile site represents. Choosing its public purpose, audience, and personal value gives every later content decision a clear direction.

Set Up Your Accounts and Repository

Your profile site already has a clear purpose. Its publishing path starts with a GitHub repository.

Cloudflare Pages needs its own account session in Safari. Google Search Console later relies on your Google account.

Confirming these three connections now keeps authentication from interrupting deployment.

In this step, get ready to:
  • Prepare three authenticated browser tabs.
  • Create the public GitHub repository.
  • Record the repository's default branch for deployment.
Open Safari and confirm account access

Signing in touches your credentials, which can feel like the risky part. Your passwords stay on the official service pages.

A new account can trigger an email or device verification screen. The service guides you through that check before sign-in completes.

  • Press Cmd+Space on your Mac to open Spotlight.
  • Type Safari and press Enter to open it.
  • Use the first Safari tab to visit the official GitHub site.
  • Create a GitHub account if you do not already have one.
  • Sign in to GitHub.
  • Open a second Safari tab with the new tab button in the tab bar.
  • Visit the Cloudflare dashboard in the second tab.

Why keep separate tabs?

Each browser tab holds one authenticated service session. This makes the deployment handoffs easier to follow.

  • Create a Cloudflare account if you do not already have one.
  • Sign in to Cloudflare.
  • Open a third Safari tab with the new tab button in the tab bar.
  • Visit the official Google account site in the third tab.
  • Create a Google account if you do not already have one.
  • Sign in to Google.

That clears the account hurdle: each required service is ready in its own tab.

Stuck at a sign-in screen?

  • Complete any email or device verification requested by the service.
  • Use the service's account recovery option if your password is rejected.
  • Return to the same Safari tab after completing the account check.

Help me troubleshoot my account access.

Create the public GitHub repository

A GitHub repository stores the files that Cloudflare Pages publishes. Initializing it with a README gives the repository its first file.

Protect public information

Anyone can read a public repository. Only profile details you are comfortable publishing belong here.

Passwords and API keys stay out of every commit.

  • Return to the GitHub tab in Safari.
  • Select New repository.
  • Enter search-ready-profile as the repository name.
  • Select Public as the repository visibility.
  • Enable the option that initializes the repository with a README.
  • Select Create repository.

You have cleared the source setup: your profile site now has a public repository.

Repository page did not load?

  • Check that Safari is still signed in to the GitHub account where you created the repository.
  • Return to New repository if the creation form is still open.
  • Confirm that the repository name is exactly search-ready-profile.

Help me create the GitHub repository.

Confirm the repository and record its branch

Cloudflare Pages needs the repository's default branch when you connect deployment. The branch selector is the source of truth for that value.

Before you check, which repository details do you expect to prove that Cloudflare Pages can connect to the right source later?

  • Refresh the GitHub repository page in Safari.
  • Confirm the page shows search-ready-profile under your GitHub account.
  • Confirm the repository visibility shows Public.
  • Confirm the top-level file list includes README.md.
  • Record the branch name displayed in the repository's branch selector here: your repository default branch.

You should see the public search-ready-profile repository under your GitHub account.

The top-level file list shows the GitHub-generated README.md. The branch selector shows your recorded default branch.

Missing the README or branch name?

  • Return to the repository's main page if GitHub opened a settings screen.
  • Check the file list for README.md.
  • Look above the file list for the branch selector.

Help me verify my repository setup.

Your account sessions and public repository are ready. Next, you'll add the first profile page and publish it through Cloudflare Pages.

Publish a Minimal Page

Your GitHub repository is ready. Cloudflare needs a homepage file before this repository can become a website.

In this step, you'll add a minimal HTML page. You'll connect the repository to Cloudflare Pages for an early public result.

The deliberately plain page proves the publishing pipeline works. Its simple presentation gives you a clear baseline for the redesign.

In this step, get ready to:
  • Commit a minimal public/index.html page to GitHub.
  • Connect the search-ready-profile repository to Cloudflare Pages.
  • Deploy the page to a public *.pages.dev production URL.
Create the minimal homepage

The public/index.html file becomes the homepage inside the deployment output. Its visible heading gives you a clear signal when the first publish succeeds.

  • Switch back to the search-ready-profile repository tab from earlier.
  • Select Add file.
  • Select Create new file.

You'll see a blank editor with an area for the new file name.

  • Enter public/index.html as the file name.
  • Paste the following page into the editor:
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>My Profile Site</title>
</head>
<body>
  <h1>My Profile Site Is Live</h1>
  <p>This is the first published version.</p>
</body>
</html>

What does this page contain?

  • The <!doctype html> declaration identifies the document as modern HTML.
  • The <head> supplies metadata for the browser.
  • The <body> contains the visible page.
  • The <h1> provides the heading that confirms the deployment worked.
  • Select Commit changes... in the top right corner.
  • Confirm the commit by selecting Commit changes.

You'll return to the repository file view. You should see public/index.html committed alongside README.md.

Can't find the new homepage?

  • Check that the file name is exactly public/index.html.
  • Confirm that the first line begins with <!doctype html>.

Ask for help if the file is missing after the commit. Help me confirm that public/index.html was committed to my GitHub repository.

✔️ Awesome, I've got everything!

Good work. public/index.html is now committed to your repository.

ⓧ I'd like to double check the full code

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>My Profile Site</title>
</head>
<body>
  <h1>My Profile Site Is Live</h1>
  <p>This is the first published version.</p>
</body>
</html>
Connect GitHub to Cloudflare Pages

A Git integration connects each deployment to a repository commit. Future pushes to the production branch automatically trigger a new build.

Why use Git integration?

Git integration keeps GitHub as the source of every deployment. Future pushes automatically trigger builds on Cloudflare Pages.

Direct Upload uses a different project setup. Cloudflare Pages cannot switch a project between these setup types later.

  • Switch back to the Cloudflare tab from earlier.
  • Select Workers & Pages in the dashboard.
  • Select Create application.
  • Select Pages.
  • Select Connect to Git.

The authorization screen can feel sensitive because it connects two accounts. This project only needs Cloudflare to access search-ready-profile.

  • Select Install & Authorize if Cloudflare asks to connect to GitHub.
  • Limit GitHub access to search-ready-profile if repository choices appear.
  • Select search-ready-profile from the repository list.
  • Select Begin setup.

You'll see the Cloudflare Pages setup fields for the selected repository. This confirms that Cloudflare can access your committed homepage.

Can't see the repository?

  • Check that the Cloudflare authorization includes search-ready-profile.
  • Confirm that you authorized the same GitHub account that owns the repository.

Use this prompt for account-specific help. Help me connect my GitHub repository to Cloudflare Pages.

Deploy the site

A build command normally transforms source files into deployable files. This framework-free page already contains everything the browser needs.

The exit 0 command completes without running a build process. Cloudflare uploads the contents of the selected build output directory as the website.

  • Select the default branch recorded in Step 1 in the Production branch field.
  • Enter exit 0 in the Build command field.

The setup now points to the branch containing your committed homepage. The build command confirms that this static page needs no framework build step.

  • Enter public in the Build output directory field.
  • Select Save and Deploy.

Cloudflare now shows deployment progress. A short processing wait is normal while it publishes the contents of public.

Once the deployment reports completion, Cloudflare shows a public HTTPS production address.

  • Record the production URL shown by Cloudflare here: https://your-project.pages.dev/.

Before you open the link, predict which heading Cloudflare will serve from public/index.html.

  • Open https://your-project.pages.dev/ in a new Safari tab.

You'll see “My Profile Site Is Live” above “This is the first published version.” Your first public deployment now proves that the repository-to-Cloudflare publishing path works.

Seeing a blank page or 404?

  • Check that the Build output directory contains public.
  • Confirm that the production branch contains public/index.html.
  • Save any corrected setting to start another deployment.

Use this prompt if the production URL still does not show the heading. Help me troubleshoot my Cloudflare Pages deployment.

The deployment path is working. Next up, you'll transform this plain proof into a profile site worth sharing.

Redesign Your Profile Site

Your plain profile page is live at its production address. That first release proved your GitHub source can reach Cloudflare Pages.

The current page still looks unfinished, so it is not ready to represent you publicly. You'll replace it with a polished HTML profile that uses inline CSS.

A new commit will trigger continuous deployment. This gives you a direct view of the path from an edited file to a redesigned production site.

In this step, get ready to:
  • Replace the minimal page with the complete profile redesign.
  • Personalize the public name and profile copy.
  • Commit the redesigned file to trigger an automatic deployment.
Replace the plain page

The redesign keeps the entire site in public/index.html. Its CSS custom properties store the colour palette in :root so the visual theme stays consistent.

Keep public details intentional

Choosing public profile wording can feel exposing. You control every detail that appears in the public repository and on the production site.

Use a public name that you are comfortable sharing. Keep passwords and other private information out of the file.

  • Return to the search-ready-profile repository in Safari.
  • Select the public folder in the repository file list.
  • Select index.html.
  • Select the pencil-shaped edit control above the file.
  • Select all of the minimal HTML in the editor.
  • Open the double-check tab below to find the complete redesign.

✔️ Awesome, I've got everything!

Great. Your editor should contain the complete redesign while preserving space for your own public name and profile copy.

ⓧ I'd like to double check the full code

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="A simple public profile and home on the web.">
  <title>Your Name | Profile</title>
  <style>
    :root {
      color-scheme: light;
      --ink: #172033;
      --muted: #5d6780;
      --surface: #ffffff;
      --accent: #5b4bdb;
      --accent-dark: #3f32aa;
      --line: #dfe3ee;
      --wash: #f4f5fb;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      min-height: 100vh;
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      color: var(--ink);
      background: var(--wash);
      line-height: 1.6;
    }
    a { color: inherit; }
    .hero {
      padding: 5rem 1.25rem 4rem;
      color: #ffffff;
      background: linear-gradient(135deg, #34278f, #6d5ce8 55%, #9a8cff);
    }
    .hero__content, main, footer {
      width: min(68rem, 100% - 2.5rem);
      margin-inline: auto;
    }
    .eyebrow {
      margin: 0 0 0.75rem;
      font-size: 0.82rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }
    h1 {
      max-width: 12ch;
      margin: 0;
      font-size: clamp(2.6rem, 9vw, 5.5rem);
      line-height: 0.98;
    }
    .intro { max-width: 40rem; margin: 1.25rem 0 0; font-size: 1.15rem; }
    .button {
      display: inline-block;
      margin-top: 1.5rem;
      padding: 0.8rem 1.1rem;
      border-radius: 999px;
      color: var(--accent-dark);
      background: #ffffff;
      font-weight: 800;
      text-decoration: none;
    }
    main { padding-block: 3rem; }
    .section-heading { margin-bottom: 1rem; }
    .section-heading h2 { margin-bottom: 0.25rem; font-size: 2rem; }
    .section-heading p { margin: 0; color: var(--muted); }
    .grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
      gap: 1rem;
    }
    .card {
      padding: 1.25rem;
      border: 1px solid var(--line);
      border-radius: 1rem;
      background: var(--surface);
      box-shadow: 0 0.75rem 2rem rgb(25 32 56 / 8%);
    }
    .card h3 { margin-top: 0; }
    .details {
      margin-top: 2rem;
      padding: 1.25rem;
      border-left: 0.35rem solid var(--accent);
      border-radius: 0.5rem;
      background: var(--surface);
    }
    .details p { margin: 0.25rem 0; }
    footer { padding-block: 1.5rem 2.5rem; color: var(--muted); font-size: 0.92rem; }
  </style>
</head>
<body>
  <header class="hero">
    <div class="hero__content">
      <p class="eyebrow">My corner of the web</p>
      <h1>Hello, I'm Your Name.</h1>
      <p class="intro">This public profile is where I share what I am learning, building, and exploring.</p>
      <a class="button" href="#about">Explore the profile</a>
    </div>
  </header>
  <main id="about">
    <div class="section-heading">
      <h2>About this site</h2>
      <p>A small, focused home for the work and ideas I want to share.</p>
    </div>
    <section class="grid" aria-label="Profile highlights">
      <article class="card"><h3>Learning</h3><p>I document useful lessons and turn them into small practical projects.</p></article>
      <article class="card"><h3>Building</h3><p>I create simple web experiences and improve them through feedback.</p></article>
      <article class="card"><h3>Sharing</h3><p>I publish clear notes so other learners can follow the same path.</p></article>
    </section>
    <section class="details" aria-labelledby="details-title">
      <h2 id="details-title">Site details</h2>
      <p>Owner: Your Name</p>
      <p>Purpose: Personal profile and learning journal</p>
      <p>Status: Published with Cloudflare Pages</p>
    </section>
  </main>
  <footer><p>Built as a static HTML site and published from GitHub.</p></footer>
</body>
</html>

How the redesign fits together

  • :root defines seven reusable colours for the page.
  • .hero creates the gradient header at the top of the site.
  • #about gives the hero button a destination farther down the page.
  • .grid arranges the Learning, Building, and Sharing cards responsively.
  • .details separates the owner, purpose, and publishing status from the cards.
  • Copy the complete public/index.html file from the double-check tab.
  • Paste the copied file over the selected minimal HTML.

The redesigned file intentionally omits the ownership meta element because Google Search Console has not supplied your unique value yet. The <head> contains only the metadata needed for the profile at this stage.

Does the pasted file look incomplete?

Check that the file starts with <!doctype html> and ends with </html>. Copy the full reference again if either line is missing.

Confirm that the old heading My Profile Site Is Live no longer appears in the editor.

Help me compare my redesigned public/index.html with the supplied profile page.

Personalize and commit the profile

The supplied wording gives the design a complete structure. Your name and profile copy make the page represent you.

  • Replace every occurrence of Your Name with a name you are comfortable publishing.
  • Rewrite the sentence beginning with This public profile to describe what you share.

Your editor now shows your chosen public name in the page title, hero heading, and Site details section.

  • Update the text after Purpose: with your public reason for maintaining the site.
  • Review the three card paragraphs for claims you are comfortable publishing.
  • Select the preview control above the editor to inspect the complete change.
  • Confirm that the preview contains the redesigned page structure without a google-site-verification meta element.
  • Select Commit changes....
  • Enter Redesign profile site in the commit message field.
  • Confirm the commit using the dialog's commit control.

GitHub returns you to public/index.html with the redesigned source committed on the production branch. The latest commit is labelled Redesign profile site.

Can't find the new commit?

Check that you completed the confirmation inside the commit dialog. Closing the dialog leaves the editor changes uncommitted.

Return to public/index.html and confirm that the gradient CSS plus the three card elements appear in the saved source.

Help me confirm whether my GitHub file was committed successfully.

Watch the redesign deploy

Cloudflare Pages watches the connected repository for committed changes. Your new commit starts a fresh deployment without a manual file upload.

  • Switch back to the Cloudflare tab from earlier.
  • Select the existing Pages project connected to search-ready-profile.
  • Find the newest deployment in the project history.
  • Match the deployment to the Redesign profile site commit.
  • Stay on the deployment until Cloudflare reports completion.

The completed deployment confirms that Cloudflare rebuilt the existing production site from your latest GitHub commit.

Before you refresh, do you expect the production URL to keep showing the plain first version or load the redesigned profile?

  • Return to the existing HTTPS *.pages.dev production URL from earlier.
  • Refresh the page in Safari.

You'll see a purple gradient header above three profile cards. Farther down, you'll see the Site details section with your public name and purpose.

That is the redesign live: the same production URL now serves the profile created by your latest commit.

Still seeing the plain page?

Confirm that the newest Cloudflare deployment has completed. A deployment still in progress cannot update the production page.

Refresh the exact production URL recorded earlier. A repository preview or deployment details page does not show the live site itself.

Help me find why my Cloudflare Pages site still shows the old page.

Your profile now looks ready to share, and every future commit can follow the same deployment path. Next, you'll test whether a public URL alone proves that you control the site.

Test the Verification Gap

Your redesigned profile already loads from Cloudflare Pages. Anyone can visit its public address.

Google still needs proof that you control the homepage source. In this step, you will test that ownership claim through Google Search Console before publishing its verification tag.

In this step, get ready to:
  • Add a URL-prefix property for the exact HTTPS production address.
  • Capture the unique HTML verification tag that Google provides.
  • Test ownership before changing the deployed homepage.
Add the URL-prefix property

A URL-prefix property matches the exact address you enter. The address includes the https:// protocol.

The final / completes the prefix.

  • Switch back to the Cloudflare Pages tab from earlier.
  • Record the existing production address here: your HTTPS pages.dev production URL ending in /.
  • Switch back to the Google Search Console tab from earlier.
  • Select the property selector in the top-left corner.
  • Select + Add property.
  • Choose URL-prefix.
  • Paste your HTTPS pages.dev production URL ending in / into the website address field.
  • Submit the URL-prefix form to create the property.

Your exact production address now has its own Search Console property. The verification methods are ready for the ownership check.

Don't see the verification methods?

Compare the property address with the Cloudflare Pages production URL.

Confirm the protocol matches. Confirm the final slash is present.

Help me check my Search Console URL-prefix property.

Capture the HTML verification tag

The HTML tag method gives you a unique meta element for the homepage. Search Console looks for that value in the live source during verification.

  • Select the HTML tag verification method.
  • Copy the complete meta tag shown in the method.
  • Save the copied tag here: your Google-provided verification meta tag.
  • Leave the GitHub search-ready-profile repository unchanged.
  • Keep the verification panel open.

Your repository remains unchanged. The deployed homepage still has no Google verification element.

What does the verification tag prove?

The tag gives Google a value tied to this property. Finding that value in the live homepage source connects the ownership claim to a file you control.

Test ownership before changing the site

Before you select Verify, what do you expect Google to conclude when its tag is absent from the source.

  • Select Verify in the HTML tag verification panel.

You'll see that ownership verification does not succeed. Search Console cannot find the required HTML tag in the deployed homepage.

You found the gap this step was built to expose. Your site is public while its ownership remains unverified.

  • Keep the verification panel available for the next step.

Verification behaves differently?

Confirm the property address exactly matches the production URL. Confirm HTML tag is the selected verification method.

Help me understand my Search Console verification result.

You have exposed the missing link between a live page and verified ownership. Next, you'll publish Google's tag through the existing deployment workflow.

Add the Ownership Tag and Verify

Your failed ownership check exposed the missing proof. Google Search Console can reach the profile without connecting that public page to you.

Now you'll place the unique HTML tag in GitHub. Cloudflare Pages then carries that proof to the existing production URL through the connected deployment.

In this step, get ready to:
  • Add the unique Google verification tag to public/index.html.
  • Publish the committed tag through the existing Cloudflare Pages connection.
  • Verify the exact URL-prefix property in Google Search Console.
Add the verification tag

The verification tag is a small HTML meta element with a value unique to your property. Placing it inside the homepage <head> gives Google a public ownership signal to check.

  • Switch back to the GitHub tab from earlier.
  • Select public/index.html in the search-ready-profile repository.
  • Select the pencil-shaped edit control above the file source.
  • Find <meta name="description" content="A simple public profile and home on the web."> inside <head>.
  • Place your cursor at the end of the description line.
  • Press Enter to create a new line.
  • Paste the exact Google-provided verification tag you copied earlier.

What Does the Tag Prove?

The google-site-verification name tells Search Console what kind of proof it has found. The unique content value links that proof to your property.

Google can fetch the public homepage source to find this value. A matching value demonstrates that you control what gets published at the URL.

  • Confirm the tag sits inside <head> immediately below the description line.
  • Confirm its content value matches the unique value Google supplied.
  • Select Commit changes....
  • Enter Add Search Console verification tag in the commit message field.
  • Confirm the commit on the existing production branch.

GitHub shows the new commit on the production branch. Your repository now carries the ownership proof that the failed check was missing.

The reference below shows the expected cumulative structure of public/index.html. In this reference file, your-google-site-verification-token-here stands for your real token.

✔️ Awesome, I've got everything!

  • Confirm your verification line remains inside <head>.
  • Confirm your personal profile text remains unchanged.

ⓧ I'd like to double check the full code

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="A simple public profile and home on the web.">
  <meta name="google-site-verification" content="your-google-site-verification-token-here">
  <title>Your Name | Profile</title>
  <style>
    :root {
      color-scheme: light;
      --ink: #172033;
      --muted: #5d6780;
      --surface: #ffffff;
      --accent: #5b4bdb;
      --accent-dark: #3f32aa;
      --line: #dfe3ee;
      --wash: #f4f5fb;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      min-height: 100vh;
      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      color: var(--ink);
      background: var(--wash);
      line-height: 1.6;
    }
    a { color: inherit; }
    .hero {
      padding: 5rem 1.25rem 4rem;
      color: #ffffff;
      background: linear-gradient(135deg, #34278f, #6d5ce8 55%, #9a8cff);
    }
    .hero__content, main, footer {
      width: min(68rem, 100% - 2.5rem);
      margin-inline: auto;
    }
    .eyebrow {
      margin: 0 0 0.75rem;
      font-size: 0.82rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }
    h1 {
      max-width: 12ch;
      margin: 0;
      font-size: clamp(2.6rem, 9vw, 5.5rem);
      line-height: 0.98;
    }
    .intro { max-width: 40rem; margin: 1.25rem 0 0; font-size: 1.15rem; }
    .button {
      display: inline-block;
      margin-top: 1.5rem;
      padding: 0.8rem 1.1rem;
      border-radius: 999px;
      color: var(--accent-dark);
      background: #ffffff;
      font-weight: 800;
      text-decoration: none;
    }
    main { padding-block: 3rem; }
    .section-heading { margin-bottom: 1rem; }
    .section-heading h2 { margin-bottom: 0.25rem; font-size: 2rem; }
    .section-heading p { margin: 0; color: var(--muted); }
    .grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
      gap: 1rem;
    }
    .card {
      padding: 1.25rem;
      border: 1px solid var(--line);
      border-radius: 1rem;
      background: var(--surface);
      box-shadow: 0 0.75rem 2rem rgb(25 32 56 / 8%);
    }
    .card h3 { margin-top: 0; }
    .details {
      margin-top: 2rem;
      padding: 1.25rem;
      border-left: 0.35rem solid var(--accent);
      border-radius: 0.5rem;
      background: var(--surface);
    }
    .details p { margin: 0.25rem 0; }
    footer { padding-block: 1.5rem 2.5rem; color: var(--muted); font-size: 0.92rem; }
  </style>
</head>
<body>
  <header class="hero">
    <div class="hero__content">
      <p class="eyebrow">My corner of the web</p>
      <h1>Hello, I'm Your Name.</h1>
      <p class="intro">This public profile is where I share what I am learning, building, and exploring.</p>
      <a class="button" href="#about">Explore the profile</a>
    </div>
  </header>
  <main id="about">
    <div class="section-heading">
      <h2>About this site</h2>
      <p>A small, focused home for the work and ideas I want to share.</p>
    </div>
    <section class="grid" aria-label="Profile highlights">
      <article class="card"><h3>Learning</h3><p>I document useful lessons and turn them into small practical projects.</p></article>
      <article class="card"><h3>Building</h3><p>I create simple web experiences and improve them through feedback.</p></article>
      <article class="card"><h3>Sharing</h3><p>I publish clear notes so other learners can follow the same path.</p></article>
    </section>
    <section class="details" aria-labelledby="details-title">
      <h2 id="details-title">Site details</h2>
      <p>Owner: Your Name</p>
      <p>Purpose: Personal profile and learning journal</p>
      <p>Status: Published with Cloudflare Pages</p>
    </section>
  </main>
  <footer><p>Built as a static HTML site and published from GitHub.</p></footer>
</body>
</html>

How to Read the Reference

The verification line sits after the description meta element. It remains inside <head>.

Your committed file contains the real Google token. It also retains the public profile text you added earlier.

Publish the ownership proof

The commit stores the proof in your repository. The existing Git integration publishes that updated source at the same production URL.

  • Switch back to the Cloudflare tab from earlier.
  • Select the existing search-ready-profile Pages project.
  • Find the newest deployment associated with Add Search Console verification tag.
  • Wait for that deployment to report completion.

You'll see the ownership-tag deployment complete at the existing *.pages.dev production URL. The live homepage now includes the proof Google needs.

Deployment Not Completing?

Confirm the commit appears on the production branch connected to Cloudflare Pages. A commit on another branch does not update the production deployment.

Check that the newest deployment references your ownership-tag commit. Wait for that deployment to complete before returning to Search Console.

Help me troubleshoot my Cloudflare Pages ownership-tag deployment.

Verify the URL-prefix property

Search Console can now fetch the unique tag from the public homepage. The verification check compares that live value with the value assigned to your URL-prefix property.

  • Return to the Google Search Console tab from earlier.
  • Select the saved URL-prefix property for your exact HTTPS production URL.
  • Return to the HTML tag verification method.
  • Confirm the property URL includes https:// and its final /.

Before you run the check, do you expect Search Console to find the tag in the newly deployed homepage?

  • Select Verify.

You'll see ownership verification succeed for the exact HTTPS URL-prefix property. Google Search Console now recognizes your account as a verified owner.

You closed the loop: your public site now carries verifiable proof that you control its source.

Verification Still Unsuccessful?

Confirm the Cloudflare Pages deployment completed before you selected Verify. An older deployment still lacks the tag.

Confirm the tag is inside <head>. Check that its content value matches the tag from this property.

Help me fix my Google Search Console HTML tag verification.

  • Leave the verification tag in public/index.html after verification.

Why Must the Tag Stay?

Search Console periodically checks the verification token. Keeping the tag deployed preserves your verified ownership.

Secret mission

Add a Second Page

Your verified profile currently fits inside one homepage. In this Secret Mission, you will add an About page with working navigation in both directions. One GitHub commit will trigger one Cloudflare Pages deployment without disturbing your Google Search Console ownership proof.

Clean Up Your Resources

Clean Up Your Resources

This project uses free services, so keeping the site online has no ongoing cost on the main path. Choose whether to keep automatic publishing active, pause future deployments, or remove the public site and repository.

Resources you used:

  • Public search-ready-profile repository on GitHub. It contains README.md, public/index.html, and public/about.html.
  • Cloudflare Pages project connected to search-ready-profile. It hosts your public HTTPS *.pages.dev site.

Keep everything running

No action needed. Choose this if you want the profile site to remain public with automatic deployment enabled.

  • Future commits to search-ready-profile continue to deploy automatically.
  • The production *.pages.dev site stays public with both navigation links working.
  • The Google Search Console URL-prefix property stays verified while the homepage and verification tag remain available.

Pause - I'll come back to this later

Pause automatic publishing if you want to stop future commits from deploying. Your existing site stays online.

  • Switch back to the Cloudflare tab in Safari.
  • Select Workers & Pages in the Cloudflare dashboard.
  • Select the Pages project connected to search-ready-profile.
  • Select Build.
  • Select edit Branch control.
  • Turn off Enable automatic production branch deployments.
  • Set Preview branch to None (Disable automatic branch deployments).

Your current profile site remains available. New commits stop triggering automatic production or preview deployments.

Delete - I don't want to use this again

Removing the public site can feel drastic. These steps target only the Pages project and the search-ready-profile repository.

  • Switch back to the Cloudflare tab in Safari.
  • Select Workers & Pages.
  • Select the Pages project connected to search-ready-profile.
  • Select Settings.
  • Select Delete project.
  • Complete the on-screen confirmation.
  • Return to your production *.pages.dev URL in Safari.

You'll see that the profile site is no longer available. This also invalidates the Search Console verification target.

  • Switch back to the GitHub tab in Safari.
  • Select Settings in the search-ready-profile repository.
  • Scroll to Danger Zone.
  • Select Delete this repository.
  • Complete the on-screen confirmations.
  • Return to the former repository URL in Safari.

You'll see that the public repository no longer loads. Your profile source and its automatic deployment connection are now removed.

Nice Work!

Nice Work!

You did it. Your two-page profile site is live on Cloudflare Pages.

You've learned how to:

  • Publish a framework-free profile site at a public Cloudflare Pages production URL.
  • Use GitHub commits to trigger automatic deployments after each site update.
  • Verify a URL-prefix property in Google Search Console with a published HTML ownership tag.
  • Secret Mission: Expand the profile into a verified two-page site with working navigation.

Ready to quiz yourself?