A professional portfolio website built with Jekyll, showcasing experience as a Lead Engineer and Digital Transformation Specialist.
- Responsive Design: Mobile-first, fully responsive layout
- Multi-page Structure: Home, About, Case Studies, Blog, Contact
- Blog System: Jekyll blog with pagination and tagging
- Case Studies: Detailed project case studies with custom layout
- SEO Optimized: SEO tags, sitemap, and structured data
- Google Analytics: Integrated analytics tracking
- Social Integration: Social media links and sharing buttons
- Performance Optimized: Fast loading with optimized assets
├── _config.yml # Jekyll configuration
├── Gemfile # Ruby dependencies
├── index.html # Homepage
├── about.md # About page
├── case-studies.md # Case studies index
├── blog.html # Blog index
├── contact.md # Contact page
├── _layouts/ # Page layouts
│ ├── default.html # Base layout
│ ├── page.html # Page layout
│ ├── post.html # Blog post layout
├── _posts/ # Blog posts
│ ├── 2025-01-15-microservices-architecture-patterns.md
│ ├── 2025-01-08-cloud-migration-zero-downtime.md
│ └── ...
├── assets/
│ ├── css/
│ │ └── styles.scss # Main stylesheet
│ └── js/
│ └── main.js # JavaScript functionality
└── README.md
- Ruby 2.7 or higher
- Jekyll 4.3+
- Git
-
Clone the repository
git clone <your-repo-url> cd <your-repo-name>
-
Install dependencies
bundle install
-
Run locally
bundle exec jekyll serve -
Open in browser
http://localhost:4000
-
Update _config.yml
url: "https://yourusername.github.io" baseurl: "/your-repo-name" # if not using custom domain
-
Configure Google Analytics
google_analytics: G-XXXXXXXXXX # Replace with your GA ID
-
Push to GitHub
git add . git commit -m "Initial commit" git push origin main
-
Enable GitHub Pages
- Go to repository Settings → Pages
- Select source: Deploy from a branch
- Branch: main / (root)
- Save
Create new markdown files in _posts/ following the naming convention:
YYYY-MM-DD-title-of-post.md
Example post structure:
---
layout: post
title: "Your Post Title"
date: 2025-01-15
tags: [tag1, tag2, tag3]
excerpt: "Brief description of your post content..."
---
Your post content here...- Personal Information: Update
_config.ymlwith your details - Social Links: Update social media usernames in
_config.yml - Navigation: Modify navigation items in
_config.yml - Colors & Styling: Update CSS variables in
assets/css/main.scss - Images: Add your profile image to
assets/images/
Update the navigation section in _config.yml:
navigation:
- title: Home
url: /
- title: About
url: /about/
# Add more navigation items as needed-
Create Google Analytics Account
- Go to Google Analytics
- Create a new property for your website
-
Get Tracking ID
- Copy your Google Analytics 4 Measurement ID (G-XXXXXXXXXX)
-
Update Configuration
google_analytics: G-XXXXXXXXXX # Replace with your actual ID
-
Add CNAME file
echo "yourdomain.com" > CNAME -
Update _config.yml
url: "https://yourdomain.com" baseurl: ""
-
Configure DNS
- Add CNAME record pointing to
yourusername.github.io
- Add CNAME record pointing to
The site includes several SEO features:
- SEO plugin with meta tags
- Sitemap generation
- Structured data markup
- Open Graph tags for social sharing
- Minified CSS and JavaScript
- Optimized images (add your own optimized images)
- Fast loading fonts and icons from CDN
The website is fully responsive with breakpoints for:
- Mobile: < 768px
- Tablet: 768px - 1024px
- Desktop: > 1024px
- Automatic deployment on push
- Custom domain support
- SSL certificate included
- Semantic HTML structure
- Meta descriptions and titles
- Schema.org structured data
- Fast loading times
- Mobile-first design
- XML sitemap
- Social media meta tags
- Use
bundle exec jekyll serve --watchfor auto-reloading - Check
_site/folder for generated output - Use browser developer tools for debugging
- Test on multiple devices and screen sizes
This project is open source. Feel free to use it as a template for your own portfolio website.
If you find issues or have improvements:
- Fork the repository
- Create a feature branch
- Make your changes
- Submit a pull request
For questions about setup or customization:
- Check the Jekyll documentation
- Review GitHub Pages documentation
- Open an issue in the repository
Built with ❤️ using Jekyll • Deployed on GitHub Pages