✨ My Custom WordPress Theme – From LocalWP to GitHub

Welcome to my first fully custom WordPress theme built from scratch using LocalWP, PHP, and Git! This guide shares my step-by-step process—from installing WordPress locally to writing theme code and pushing only the required files to GitHub.

---

📌 Project Summary

🚀 Goal: Build a lightweight custom WordPress theme
🧰 Tools Used: LocalWP, VS Code, Git, GitHub
🎨 Stack: WordPress + PHP + HTML + CSS (No Frameworks)

---

🛠️ Step 1: Setup WordPress Locally (LocalWP)

I used LocalWP to spin up a local WordPress environment.

Steps:

• ✅ Install LocalWP
• ➕ Create new site: custom-theme.local
• 🛠️ WordPress auto-installed
• 📁 Local folder: Local Sites/custom-theme/app/public

---

🧱 Step 2: Create Your Custom Theme

Navigate to:

Screenshot

Folder Structure

my-custom-theme/ │ ├── header.php ├── footer.php ├── functions.php ├── index.php ├── page.php ├── single.php ├── style.css ├── screenshot.png

Then:

mkdir my-custom-theme
cd my-custom-theme

style.css

/*
Theme Name: My Custom Theme
Author: Your Name
Description: A simple custom theme built from scratch.
Version: 1.0
*/

body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
}

🔹 index.php

<?php get_header(); ?>

<main>
  <h1>Welcome to My Custom Theme</h1>
  <?php
    if ( have_posts() ) {
      while ( have_posts() ) {
        the_post();
        the_content();
      }
    }
  ?>
</main>

<?php get_footer(); ?>

🔹 functions.php

<?php
function mytheme_setup() {
    add_theme_support('title-tag');
    add_theme_support('post-thumbnails');
    add_theme_support('menus');
}
add_action('after_setup_theme', 'mytheme_setup');

🧪 Step 4: Activate Theme in WordPress

Go to Appearance > Themes and activate “My Custom Theme”.

🧼 Step 5: Add .gitignore to Clean the Repo

Create a .gitignore file inside my-custom-theme/:

touch .gitignore

*.log
.DS_Store
Thumbs.db
*.zip
node_modules/
vendor/
.env

🌐 Step 6: Push Only the Theme to GitHub

1. Open terminal in my-custom-theme/ bash Copy Edit cd path-to/wp-content/themes/my-custom-theme

2. Initialize Git

git init git add . git commit -m "Initial commit - custom WP theme"

3. Create GitHub Repo Go to GitHub and create a repo (e.g., my-custom-theme). Do NOT add a README or .gitignore on GitHub.

4. Connect & Push git remote add origin https://github.com/yourusername/my-custom-theme.git git branch -M main git push -u origin main