Creating your own portfolio website can feel overwhelming — especially if you’re new to web development or design. In this post, I’ll walk you through exactly how I built my own portfolio website using WordPress, the Elementor page builder, and the Blocksy theme. My goal was to create a clean, modern site that’s easy to update, fully responsive, and fast-loading — without writing a single line of code.
Whether you’re just starting your web development journey or looking to showcase your work, this guide will help you build a portfolio site you can be proud of!
🛠️ What You’ll Need
Before we dive in, here’s what I used:
- WordPress (self-hosted -I’ll explain)
- Elementor (free version)-for drag-and-drop page building
- Blocksy theme (free)-for a lightweight, customizable base
- A domain name + web hosting (i used infinityfree during development then migrated to namecheap for production)
👉 Tip: You can get started for free using infinityfree free hosting but note this is temporary. You can then try Namecheap for less than $40/year with domain + hosting.
🌐 Step 1: Set Up Hosting and Install WordPress
First, I registered a domain and set up web hosting. Most hosts offer one-click WordPress installation. Here’s what I did:
✅ Register domain + hosting
✅ Log in to hosting dashboard
✅ Use the one-click installer to install WordPress
✅ Set admin username + password
✅ Log in to WordPress at yoursite.com/wp-admin
🖼️ [INSERT IMAGE: Screenshot of hosting dashboard + WordPress installer]
🖼️ [INSERT IMAGE: Screenshot of WordPress login screen]
🎨 Step 2: Install Blocksy Theme
I chose the Blocksy theme because:
- It’s fast and optimized for performance
- It offers lots of customization options (colors, typography, headers)
- It works perfectly with Elementor
Here’s how I installed it:
1️⃣ Go to Appearance → Themes → Add New
2️⃣ Search for Blocksy, click Install, then Activate
🖼️ [INSERT IMAGE: WordPress dashboard showing Blocksy theme search]
🔧 Step 3: Install Elementor Page Builder
Elementor lets you build pages visually with no code required. The free version is powerful enough for most portfolio sites.
✅ Go to Plugins → Add New
✅ Search for Elementor
✅ Click Install Now, then Activate
🖼️ [INSERT IMAGE: Installing Elementor in WordPress]
📄 Step 4: Plan Your Portfolio Pages
Before building, I sketched a simple site structure:
- Home page
- Portfolio page
- About page
- Services page
- Contact page
👉 Tip: Keep it simple. You can always add more later.
✨ Step 5: Design Pages With Elementor
Now the fun part — building! I created each page using Elementor’s drag-and-drop tools.
🏠 Home Page
- Hero section: My name + tagline + call-to-action button
- Short blurb about me
- Featured projects grid
- Footer with social links
🖼️ Portfolio Page
- Grid of projects (each links to a separate page or modal popup)
- Filter by category (optional)
👤 About Me Page
- Photo + short bio
- List of skills (icons + text)
📬 Contact Page
- Simple form (Elementor form widget or free plugin like WPForms)
- Email + social links
🎨 Step 6: Customize Your Theme (Blocksy Settings)
I customized the Blocksy theme settings:
✅ Colors & typography: Chose a simple color palette that matches my brand
✅ Header layout: Added logo + menu + call-to-action button
✅ Footer: Added copyright text + links
All of this is done under Appearance → Customize.
🖼️ [INSERT IMAGE: Blocksy theme customizer showing color settings]
🚀 Step 7: Optimize and Launch
Before going live:
- Tested the site on mobile + desktop
- Set up basic SEO with Yoast SEO (free)
- Used fewer images to speed up the site
Then, I hit Publish and shared my site!
🖼️ [INSERT IMAGE: Site live on browser or mobile device]
💡 Final Thoughts + What I Learned
Building this portfolio taught me:
✅ Planning your content makes the design process smoother
✅ WordPress + Elementor + Blocksy is a great stack for beginners
✅ Small tweaks (like color and font choices) make a big impact
If you’re thinking about creating your own site — go for it! The tools are beginner-friendly, and you’ll gain valuable skills along the way.
🔑 Key Takeaways
- You don’t need to know code to build a beautiful portfolio
- WordPress + Elementor + Blocksy = powerful, flexible combo
- Start simple — you can always improve your site over time
