Building My First SEO-Focused Website: A Complete Case Study.

WORDPRESS & SEO / CASE STUDY

From WordPress setup to Google Search Console: a practical record of building, testing, and learning.

By Xiaopeng · A personal SEO learning project

In this article

• Why I started
• Hosting & WordPress
• My plugin toolkit
• AI-assisted design
• Search Console
• Lessons learned

My toolkit

• Astra
• Elementor
• Yoast SEO
• Site Kit

Building a website from scratch can feel overwhelming, especially when you’re completely new to WordPress, web hosting, and search engine optimization (SEO).

When I decided to build my first personal website, I wasn’t simply trying to create an attractive homepage. My goal was to build a real website where I could practice Google SEO, publish content about digital marketing, and document my progress as I learned.

That website became xiaopengseo.com.

In this case study, I’ll walk through my actual website-building process, including why I chose Hostinger, how I configured WordPress, which plugins I installed, how I used ChatGPT to help design my pages, and how I started preparing my website for Google indexing.

I’ll also share some mistakes and technical issues I encountered along the way.

This isn’t a story about achieving thousands of organic visitors overnight. It’s a practical record of building my first SEO-focused website from the ground up.

1. Why I Decided to Build My Own SEO Website

My background is in e-commerce advertising and digital marketing, particularly campaign optimization on Chinese platforms such as Douyin.

While working with paid advertising, I became interested in another important source of website traffic: organic search.

Unlike paid advertising, where traffic depends heavily on ongoing ad spend, SEO focuses on improving a website’s visibility in unpaid search results.

I wanted to understand how this process works in practice.

Rather than learning SEO entirely through tutorials, I decided to create my own website and use it as an experimental project.

My objectives were straightforward:

• Learn how to build and manage a WordPress website.
• Understand the fundamentals of technical SEO.
• Practice keyword research and SEO content writing.
• Learn how Google discovers, crawls, and indexes webpages.
• Monitor real search performance using Google Search Console.
• Build a portfolio that demonstrates my practical SEO skills.

I also wanted to explore how generative AI tools could make website development more accessible to beginners.

This project gave me an opportunity to combine website building, content marketing, SEO, and AI-assisted workflows.

2. Choosing a Hosting Provider: Why I Selected Hostinger

One of the first decisions I had to make was where to host my website.

Initially, I considered a more manual setup using Alibaba Cloud, which could involve purchasing a domain, configuring DNS records, renting a server, managing a control panel such as BaoTa, and installing WordPress.

That approach offers flexibility, but it also introduces several technical steps that can be confusing for a beginner.

I eventually chose Hostinger because it offered a more integrated setup experience.

2.1 What Hostinger Simplified for Me

With Hostinger, I could handle most of the initial setup through a single hosting platform.

The process included:

1. Purchasing a hosting plan.
2. Registering or connecting my domain.
3. Installing WordPress through the guided setup.
4. Creating my WordPress administrator credentials.
5. Accessing the WordPress dashboard.

I didn’t have to configure a separate server management panel before installing WordPress.

This made the entire process easier to understand.

2.2 How Much Did It Cost?

My initial purchase cost approximately CNY 363.

The exact amount depends on the hosting plan, registration period, promotions, and additional services.

Although an integrated hosting package may not always be the cheapest option, I considered the convenience worthwhile.

As someone learning SEO from scratch, I preferred spending more time understanding website optimization and less time troubleshooting server configuration.

2.3 Hostinger vs. a Manual Cloud Server Setup

This comparison reflects the setup options I considered, not every hosting plan available from either provider.

My takeaway: For my first SEO project, reducing technical complexity was more valuable than having complete control over the server.

3. Getting Started With the WordPress Dashboard

After setting up my administrator username and password, I logged into the WordPress dashboard.

The dashboard initially looked complicated because there were many options in the left-hand navigation menu.

However, I quickly realized that most of my early website-building tasks could be completed through a few important sections.

3.1 Pages: Building the Main Website Structure

The Pages section allows you to create and edit static webpages.

For my personal SEO website, these pages form the foundation of the visitor experience.

Examples include:

• Home
• About Me
• Blog
• Projects
• Contact

The homepage introduces who I am, what I’m learning, and what visitors can expect from the website.

The About page explains my background in digital marketing and my interest in SEO.

The Projects page can eventually showcase practical experiments, website audits, and SEO case studies.

Unlike blog posts, which are usually published chronologically, pages are typically used for relatively permanent website content.

3.2 Posts: Publishing SEO Content

The Posts section is where I create blog articles.

This is particularly important for my long-term SEO strategy.

I plan to publish content covering topics such as:

• Google SEO for beginners
• WordPress SEO optimization
• E-commerce advertising strategies
• Douyin vs. TikTok advertising
• Generative Engine Optimization (GEO)

Each article provides an opportunity to practice keyword research, content optimization, and search performance analysis.

3.3 Appearance: Managing Website Themes

The Appearance section allows me to control the website’s theme and various design settings.

This led me to another important decision: choosing the right WordPress theme.

4. Why I Chose the Astra WordPress Theme

After exploring different WordPress themes, I selected Astra.

I wanted a theme that was relatively lightweight, customizable, and compatible with popular page builders.

Astra supports both Elementor and the native WordPress block editor, commonly called Gutenberg.

This flexibility was important because I didn’t want to depend entirely on one editing tool.

What I Like About Astra

1. Flexible design options

Astra provides a foundation for customizing layouts, typography, colors, and other visual elements.

2. Compatibility with Elementor

I can use Astra as the theme while building individual pages with Elementor.

3. Compatibility with Gutenberg

For standard blog posts, I can continue using the native WordPress editor without needing to design every article in Elementor.

4. A suitable foundation for SEO

Astra provides a useful starting point, although the theme alone cannot guarantee strong SEO performance or fast loading speeds.

I still need to optimize images, plugins, content, and technical settings.

My approach is simple: use Astra for the website’s overall foundation and Elementor for more customized page designs.

5. The Six WordPress Plugins I Installed

After choosing my theme, the next step was installing plugins.

Plugins extend WordPress functionality without requiring users to develop every feature from scratch.

At the beginning of this project, I installed six plugins.

Here’s what each one does and why I decided to use it.

5.1 All-in-One WP Migration and Backup

Purpose: Website backups, migration, and restoration.

One of my biggest concerns as a beginner was accidentally damaging my website while experimenting with different settings.

All-in-One WP Migration and Backup helps address this concern.

The plugin can export WordPress website data, including the database, media files, themes, and plugins, into a backup file.

For example, before making significant changes, I can:

1. Open All-in-One WP Migration.
2. Select the Export option.
3. Download a website backup.
4. Store the backup somewhere safe.

If something goes wrong later, I can use the import functionality to restore a compatible backup.

I think of this process as creating a restore point.

However, restoring a previous backup may overwrite changes made after the backup was created. Import size restrictions and hosting limitations can also affect restoration.

For that reason, it’s important to keep reliable backups and understand the recovery process before making major changes.

5.2 Elementor Website Builder

Purpose: Visual website design without coding.

Elementor has become one of my most frequently used plugins.

Instead of writing HTML and CSS manually, I can build webpages using a drag-and-drop interface.

For example, I can add:

• Headings
• Images
• Buttons
• Text blocks
• Navigation elements
• Layout containers

One feature I particularly like is the Flexbox Container layout system.

Containers allow me to organize content, control spacing, arrange elements, and adjust how a page behaves across different screen sizes.

This makes Elementor especially useful for designing a homepage with a modern, professional appearance.

Of course, visual editing doesn’t eliminate the need for quality checks. I still need to test the final design on desktop and mobile devices.

5.3 Site Kit by Google

Purpose: Connecting WordPress to Google services.

Site Kit by Google makes it easier to access information from Google’s website measurement tools.

For my SEO project, the most important integration is Google Search Console.

Site Kit can help connect a WordPress website to Search Console and display important search performance metrics directly in the WordPress dashboard.

These include information such as:

• Search impressions
• Organic clicks
• Search queries
• Average search position

It can also connect to other supported Google services, including Google Analytics.

Site Kit is useful for monitoring website performance, although I can also access Search Console directly without using the plugin.

5.4 WordPress Importer

Purpose: Importing WordPress content.

The WordPress Importer is designed to transfer content from WordPress export files.

Depending on the exported content, this can include posts, pages, comments, categories, and other supported data.

It’s different from a full website backup tool.

For example, importing a set of blog posts is not the same as restoring an entire WordPress website, including themes, plugins, and site configuration.

Understanding the difference helped me avoid confusing content imports with website backups.

5.5 WP File Manager

Purpose: Accessing website files through WordPress.

WP File Manager provides a way to browse and manage server files from the WordPress administration interface.

This can be convenient for tasks that involve uploading or inspecting files.

For example, Google Search Console offers an HTML file upload method for verifying website ownership.

A file management tool may help with this process when the necessary server access is available.

However, file management plugins have access to sensitive website resources.

For security, I need to keep such plugins updated, restrict administrator access, and disable or remove tools that are no longer necessary.

Hostinger’s own file manager is another option for managing website files.

5.6 Yoast SEO

Purpose: On-page SEO guidance and technical SEO features.

Because my main objective is learning SEO, Yoast SEO is one of the most relevant plugins in my setup.

Yoast helps me manage important SEO elements, including:

• SEO titles
• Meta descriptions
• Search appearance settings
• XML sitemaps
• Content optimization suggestions
• Certain structured data features

It also provides SEO and readability analysis while editing content.

Some AI-assisted and advanced features depend on the plugin edition.

One lesson I’ve learned is that getting a positive score in Yoast doesn’t automatically mean a page will rank well.

The plugin provides guidance, but actual SEO performance depends on factors such as search intent, content quality, crawlability, and competition.

6. How I Used ChatGPT to Design My WordPress Homepage

One of the most interesting parts of this project was using ChatGPT to help with website design.

I wanted a professional-looking homepage but didn’t have much experience with web design or coding.

Instead of starting with a blank Elementor canvas, I experimented with an AI-assisted workflow.

Step 1: Research Other Personal Websites

I began by looking at existing personal blogs and SEO portfolio websites.

I paid attention to their:

• Navigation menus
• Homepage hero sections
• Typography
• Content hierarchy
• About sections
• Project cards
• Footer layouts

My objective wasn’t to copy another website.

I wanted to understand which design patterns made a personal website easy to navigate and visually appealing.

Step 2: Create a Design Direction With ChatGPT

After researching different layouts, I described my preferred design to ChatGPT.

For example, I wanted a homepage that included a short personal introduction, my learning focus, a selection of projects, and recent blog articles.

I also preferred a clean layout with generous spacing and a professional appearance.

ChatGPT helped me organize these requirements into a clearer design concept.

Step 3: Ask ChatGPT to Create an Elementor-Compatible Template

Once I had a design direction, I used a more specific prompt.

Here’s an English version of the prompt I used:

Convert this design into a page layout compatible with the WordPress Elementor page builder.

Please use native Elementor widgets rather than HTML widgets. Use Flexbox Containers instead of the older Inner Sections.

Requirements:

• Create a modern, clean, professional design.
• Make the layout responsive across desktop, tablet, and mobile devices.
• Include navigation links and buttons with appropriate destinations.
• Use suitable images from Unsplash.
• Prepare the page for SEO with a clear H1 heading, descriptive image alt text, semantic HTML, and appropriate metadata guidance.
• Generate a valid Elementor-compatible JSON template that I can import, preview, and customize.
• Use native Elementor components wherever possible.

This prompt made the requirements much more specific than simply asking AI to build a homepage.

Step 4: Import the Generated JSON Template

Elementor supports importing compatible templates in JSON or ZIP format.

My workflow was:

1. Ask ChatGPT to generate an Elementor-compatible JSON template.
2. Save the generated file with a .json extension.
3. Open the Elementor template library in WordPress.
4. Import the template.
5. Insert the imported layout into the relevant page.
6. Open the page in Elementor and continue editing.

The import process helped me create an initial page structure more quickly.

However, an important limitation is that AI-generated JSON isn’t guaranteed to be a valid or fully functional Elementor template.

The file must follow Elementor’s expected structure, and certain components may depend on specific plugin versions or features.

If the import fails, the JSON needs to be corrected rather than simply renamed.

Step 5: Refine the Page Manually

Importing a layout was only the beginning.

After creating the initial structure, I still needed to refine the details.

This included:

• Adjusting font sizes and spacing.
• Replacing placeholder text with my own content.
• Checking image quality and usage rights.
• Setting correct links for navigation and buttons.
• Adjusting mobile layouts.
• Making sure headings use the appropriate HTML tags.
• Configuring SEO titles and descriptions in Yoast SEO.

I also learned that an attractive design preview doesn’t guarantee that every element works correctly after import.

Every button, image, and responsive layout still requires manual testing.

My biggest takeaway was that AI can accelerate the first draft of a website, but human review is necessary to make it usable and reliable.

7. Preparing My Website for SEO

Once my homepage was taking shape, I began focusing on the website’s SEO foundation.

A website can look excellent to visitors but still have technical issues that prevent search engines from discovering or understanding its content.

I started with several basic checks.

7.1 Use a Clear Website Structure

I wanted the website to be easy for both people and search engines to navigate.

My planned structure includes a homepage, About page, blog, and project portfolio.

I also want related articles to link to one another naturally.

For example, a future article about WordPress SEO could link to this website-building case study.

7.2 Create Search-Friendly URLs

Instead of using unclear URLs, I prefer short, descriptive slugs.

For example:

https://xiaopengseo.com/first-seo-website-case-study/

This makes the page topic easier to understand.

I can manage permalink settings in WordPress under Settings → Permalinks.

7.3 Optimize Page Titles and Descriptions

Using Yoast SEO, I can customize how individual pages are presented to search engines.

For each important page, I aim to write:

• A descriptive SEO title.
• A useful meta description.
• A clear H1 heading.
• Relevant H2 and H3 subheadings.

I also try to avoid repeating keywords unnaturally.

7.4 Check Search Engine Visibility

WordPress includes a setting that can discourage search engines from indexing a website.

I learned to check this under:

WordPress → Settings → Reading → Search Engine Visibility

For a public website intended to appear in Google Search, the option to discourage search engines should normally remain unchecked.

This setting is important, but turning it off does not guarantee indexing.

8. Connecting My Website to Google Search Console

After setting up the website and its basic SEO features, I moved on to Google Search Console.

Google Search Console is a free tool that helps website owners monitor their site’s presence in Google Search.

It provides information about indexing, search queries, impressions, clicks, and technical issues.

Step 1: Add My Website

I opened Google Search Console and added my website as a property.

There are different property verification options, including domain properties and URL-prefix properties.

For a beginner, a URL-prefix property can be a straightforward starting point.

However, it’s important to use the correct website address, including the protocol.

For example:

https://xiaopengseo.com/

The HTTP and HTTPS versions are treated as separate URL prefixes.

Step 2: Verify Website Ownership

Google requires website owners to prove that they control the property they are adding.

One available method is HTML file verification.

The process involves downloading a verification file from Search Console and uploading it to the website’s root directory.

For example, a verification file might be accessible at a URL such as:

https://example.com/google-verification-file.html

The file must contain the exact content provided by Google.

Another option is verification through DNS records.

Site Kit by Google can also assist with the verification and Search Console connection process.

Once verification succeeds, I can access the site’s Search Console reports.

Step 3: Inspect My Homepage URL

Inside Search Console, I can use the URL Inspection tool.

I enter the homepage address:

https://xiaopengseo.com/

If the page hasn’t been indexed, I can test the live URL to check whether Google can access it.

When the page is eligible, I can select Request Indexing.

However, requesting indexing does not mean that Google will immediately include the page in search results.

Google still needs to crawl and evaluate the webpage.

9. Creating and Submitting My XML Sitemap

Another important step was understanding XML sitemaps.

A sitemap is a file that helps search engines discover important URLs on a website.

Because I installed Yoast SEO, the plugin generated an XML sitemap index.

The typical Yoast SEO sitemap URL is:

https://xiaopengseo.com/sitemap_index.xml

The Four Sitemaps I Discovered

When I checked the sitemap index, I found four separate sitemap files.

Initially, I wasn’t sure whether I needed to submit all four files to Google.

After researching the issue, I learned that Yoast combines these files into a single sitemap index.

That means I generally only need to submit:

sitemap_index.xml

Google can discover the individual sitemaps through that index.

A Real Issue: My Sitemap Displayed a Temporary Domain

During setup, I encountered a problem that taught me an important technical SEO lesson.

Although my intended public domain was xiaopengseo.com, the sitemap initially displayed URLs under a temporary Hostinger domain ending in:

hostingersite.com

This created a potential inconsistency between my intended public domain and the URLs being advertised to search engines.

Before submitting the sitemap, I needed to verify:

1. Whether my custom domain was correctly connected in Hostinger.
2. Whether the WordPress Address and Site Address settings used the correct domain.
3. Whether Yoast SEO was generating URLs under the intended HTTPS domain.
4. Whether cached website data was still referencing the temporary address.

Changing WordPress URLs without checking the hosting configuration can cause access problems, so I treated this as a configuration issue to investigate carefully.

This was one of my first practical encounters with technical SEO.

It helped me understand why canonical URLs, domain consistency, and site configuration matter.

Submitting the Sitemap

Once the sitemap points to the intended public domain, the submission process is straightforward:

1. Open Google Search Console.
2. Select the correct website property.
3. Navigate to Sitemaps.
4. Enter sitemap_index.xml in the new sitemap field.
5. Click Submit.
6. Check the submission status.

A successful sitemap submission means Google has processed the sitemap submission successfully.

It does not mean every URL has been indexed.

10. What Happens After Requesting Google Indexing?

One of the most important lessons from this project is that publishing a website and getting it indexed are different processes.

A new website generally goes through three stages:

Discovery: Google learns that a URL exists.

Crawling: Googlebot requests the webpage and examines its content.

Indexing: Google evaluates whether to store the page in its search index.

These stages are not guaranteed to happen immediately or successfully for every URL.

According to Google Search Central, crawling can take several days or weeks, and an indexing request does not guarantee inclusion in search results.

That means my next responsibility is to monitor what actually happens.

How I Plan to Measure Progress

I’ll use Google Search Console to track:

In the beginning, indexing and crawlability are my main concerns.

As I publish more content, I can begin evaluating impressions, clicks, and keyword performance.

11. Five Lessons I Learned From Building My First SEO Website

Although this project is still in its early stages, the experience has already taught me several useful lessons.

Lesson 1: Simplifying Website Setup Helps Beginners Focus

Using Hostinger reduced the amount of server administration I needed to handle.

That allowed me to focus more attention on WordPress, website structure, and SEO.

Lesson 2: Themes and Plugins Serve Different Purposes

Astra provides the website’s design foundation, while plugins such as Elementor and Yoast SEO add specific functionality.

Understanding this separation made WordPress easier to manage.

Lesson 3: AI Is Most Useful When Instructions Are Specific

ChatGPT became more helpful when I described the required layout, Elementor components, responsive behavior, and SEO requirements.

Clear prompts produced more useful starting points.

Lesson 4: Technical SEO Starts Before Publishing Articles

Domain configuration, HTTPS, crawlability, indexability, and XML sitemaps all matter.

A beautiful website alone is not enough.

Lesson 5: SEO Requires Measurement, Not Assumptions

Installing Yoast SEO, verifying Search Console, and submitting a sitemap are setup activities.

They are not evidence that a website is ranking or receiving organic traffic.

I need to collect performance data before making conclusions about SEO results.

12. My Next Steps

Now that I have established the initial website-building workflow, I want to move toward practical SEO experimentation.

My next priorities are:

• Complete the domain and sitemap configuration checks.
• Publish useful, original English-language blog articles.
• Conduct keyword research for e-commerce marketing and SEO topics.
• Improve internal linking between related articles.
• Audit website performance and mobile usability.
• Monitor indexing and search impressions in Google Search Console.
• Document meaningful SEO results in future case studies.

I also want to explore Generative Engine Optimization (GEO) and how content can be structured to communicate useful information clearly across traditional search engines and AI-powered discovery systems.

The website will serve as both a learning environment and a public record of my progress.

Frequently Asked Questions

Is Hostinger Good for Building a WordPress Website?

Hostinger can be a practical option for beginners who want integrated hosting and a guided WordPress installation process.

The best choice depends on your budget, performance requirements, technical experience, and preferred level of server control.

Can I Build a WordPress Website Without Coding?

Yes. Tools such as Elementor allow beginners to create and customize many WordPress page layouts without writing code.

However, some advanced customization or troubleshooting tasks may still require technical knowledge.

Can ChatGPT Generate Elementor Website Templates?

ChatGPT can help generate layouts and Elementor-compatible JSON structures.

However, the generated files must follow Elementor’s expected format, and successful importing is not guaranteed without validation.

Manual editing and functional testing are still important.

Do I Need to Submit Every Sitemap to Google Search Console?

Usually not.

If Yoast SEO generates a sitemap index containing several child sitemaps, submitting the main sitemap_index.xml file is generally sufficient.

Does Submitting a Sitemap Guarantee Google Indexing?

No.

A sitemap helps Google discover URLs, but Google independently determines which pages to crawl and index.

How Long Does It Take for a New Website to Appear in Google?

There is no fixed timeline.

Crawling and indexing may take days or weeks, and some pages may not be indexed at all.

Google Search Console is the best place to investigate individual URL indexing status.

Conclusion: My First Step Toward Practical SEO

Building my first SEO-focused website has helped me turn abstract concepts into practical experience.

Before starting, WordPress, hosting, Elementor, XML sitemaps, and Google Search Console were mostly unfamiliar tools.

By working through the setup process myself, I began to understand how these pieces fit together.

I learned how to establish a WordPress website, create pages without coding, use AI to accelerate layout design, install essential plugins, and prepare a site for search engine discovery.

I also discovered that small technical details, such as a sitemap referencing the wrong domain, can have important implications for SEO.

Most importantly, I now understand that launching a website is only the beginning of an SEO project.

The real work comes next: publishing useful content, measuring search performance, identifying problems, and improving the website through continuous experimentation.

I’ll continue documenting that process on xiaopengseo.com.

If you’re also starting your SEO journey, my advice is simple: build something real, test what you learn, and document both your successes and mistakes.

That’s how I intend to turn SEO theory into practical skills.

References and Further Reading

• Google Search Central — SEO Starter Guide
• Google Search Central — Requesting a Recrawl
• Google Search Central — Creating Helpful, People-First Content
• Elementor — Template Library Documentation
• Yoast SEO — XML Sitemap Documentation
• Site Kit by Google — Search Console Integration