Project Blueprint: Musa Touray Portfolio

Project Overview

This is a professional portfolio website for Musa Touray, a Data Engineer, Analytics Engineer, and Microsoft Certified Fabric and Power BI specialist. The site showcases data analytics projects, technical skills, and professional certifications.

Live URL: https://musatouray.github.io Repository: https://github.com/musatouray/musatouray.github.io Tech Stack: Jekyll, Minimal Mistakes theme, GitHub Pages

Architecture

Theme

Key Features

Directory Structure

.
├── _config.yml              # Main configuration file (CRITICAL)
├── _data/
│   └── navigation.yml       # Site navigation menu
├── _pages/                  # Static pages
│   ├── contact.md
│   ├── privacy-policy.md
│   ├── categories.md
│   ├── tags.md
│   ├── portfolio.md         # Projects listing page
│   ├── musings.md           # Musings/blog listing page
│   └── resume.md
├── _posts/                  # Blog posts (YYYY-MM-DD-title.md)
│   ├── 2021-12-04-real-time-live-tv-presidential-elections-report.md
│   ├── 2022-04-10-the-gambia-national-assembly-parliamentary-elections-live-dashbard.md
│   ├── 2024-03-24-senegal-presidential-elections-analysis.md
│   └── 2025-10-08-dynamic-column-headers-power-bi-matrix.md
├── _portfolio/              # Portfolio collection items
├── .github/
│   └── workflows/
│       └── jekyll.yml       # GitHub Actions workflow (user-managed)
├── assets/
│   ├── css/
│   │   └── main.scss        # All custom styling (do not split)
│   └── images/              # All images, badges, logos
├── index.md                 # Home page (custom hero + project/musings grids)
├── Gemfile                  # Ruby dependencies
└── README.md                # Documentation

Home Page Architecture

The home page (index.md) uses a fully custom layout — not the standard MM overlay hero or sidebar.

Front matter:

---
layout: single
title: "Musa Touray"
classes: wide home-page
author_profile: false
---

Page structure:

  1. <section class="home-hero"> — full-bleed profile card
    • .home-hero__inner — centred column (name, avatar, bio, tagline, divider, location, social links)
    • .home-hero__nav — pill-style nav bar at the bottom border of the hero
  2. ## Featured Projects — .projects-grid home-projects-grid (3-col, portfolio items)
  3. ## Latest Musings — .projects-grid home-musings-grid (3-col, 3 most recent posts)

Key CSS behaviour (.home-page body class):

Design System (assets/css/main.scss)

Brand Tokens

$primary-color:  #FF6634;   // set before @import "minimal-mistakes"
$link-color:     #FF6634;

:root {
  --color-primary:    #FF6634;
  --color-nav-bg:     #f0f4f8;
  --color-text:       #0F1729;
  --color-muted:      #6B7280;
  --color-border:     #e2e8f0;
  --font-sans:        'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

Typography

Key MM Overrides

Card Components

Critical Configuration Files

_config.yml

DO NOT MODIFY these without testing:

Current important settings:

atom_feed:
  hide: true          # removes FEED link from footer

# Google Analytics
analytics:
  provider: "google-gtag"
  google:
    tracking_id: "UA-113961478-1"

Social links: Only LinkedIn and GitHub are active. Twitter has been removed from author.links and footer.links.

Gemfile

gem "github-pages", group: :jekyll_plugins
# Do NOT add jekyll-include-cache separately — it's bundled inside github-pages

Navigation (_data/navigation.yml)

Current nav items: Home (/), Musings (/musings/), Projects (/projects/), Resume (/resume/)

Posts

File Teaser Image
2021-12-04-real-time-live-tv-presidential-elections-report.md gambia-presidential-elections.png
2022-04-10-...-parliamentary-elections-live-dashbard.md gambia-parliamentary-elections.jpg
2024-03-24-senegal-presidential-elections-analysis.md senegal_elections_analysis.png
2025-10-08-dynamic-column-headers-power-bi-matrix.md matrix_table_with_dynamic_column_headers.png

Note: Election post images are intentionally .png (except parliamentary which is .jpg). Do not change extensions without checking.

Adding a Blog Post

  1. Create file in _posts/ with format: YYYY-MM-DD-title.md
  2. Use this front matter template:
---
layout: single
title: "Your Post Title"
excerpt: "Brief 1-2 sentence description for previews"
date: YYYY-MM-DD
permalink: /musings/your-post-slug/
header:
  teaser: /assets/images/your-image.png
  overlay_image: /assets/images/your-image.png
  overlay_filter: 0.65
categories:
  - Musings
  - Power BI
tags:
  - Power BI
  - DAX
author_profile: true
share: true
related: true
---

Post content here...
  1. For Power BI embeds, use standard HTML:
<p>
    <iframe style="width:100%;" height="383"
        src="YOUR_POWERBI_EMBED_URL"
        frameborder="0" allowFullScreen="true">
    </iframe>
</p>

Adding a Portfolio Item

Create file in _portfolio/ directory:

---
layout: single
title: "Project Name"
excerpt: "Project description"
header:
  teaser: /assets/images/project-image.png
  overlay_image: /assets/images/project-image.png
  overlay_filter: 0.5
tags:
  - Power BI
  - Azure
---

Full project description and details...

Certification Badges

Configured in _config.yml under defaults → posts → sidebar. Current badges (all .png):

Development Workflow

Local Development

bundle install
bundle exec jekyll serve --watch
# Preview at http://localhost:4000

Git Workflow

Branch strategy:

Standard workflow:

# Work on dev
git checkout dev
# ... make changes ...
git add <files>
git commit -m "Description"
git push origin dev

# Merge to main (always use --no-ff)
git checkout main
git merge --no-ff dev -m "Merge dev: description of changes"
git push origin main

# Sync dev back to avoid "X commits behind" warning
git checkout dev
git merge --no-ff main -m "Sync dev with main merge commits"
git push origin dev
git checkout main

Force a rebuild without content changes:

git commit --allow-empty -m "Trigger GitHub Pages rebuild"
git push origin main

Important: Always use git merge --no-ff (not fast-forward) when merging dev → main.

Deployment

GitHub Pages Setup

Settings → Pages:

Do NOT use GitHub Actions deployment — the branch-based builder is simpler and works correctly with the github-pages gem. A jekyll.yml Actions workflow exists in .github/workflows/ but deployment is handled by the branch-based builder, not Actions.

Build Time

Important Notes

Image Paths

Always use absolute paths in front matter and content:

# Correct:
teaser: /assets/images/photo.png

# Wrong:
teaser: assets/images/photo.png

Never reference GitHub user-attachments URLs (e.g. https://github.com/user-attachments/assets/...) — these are private/temporary and return 404 when embedded. Always save images to assets/images/ and commit them.

URL Structure

Never change permalink: /:title/ in _config.yml — search engines have indexed existing URLs.

Author Configuration

Site uses a single author defined in _config.yml under author:. Do not add author: to individual post front matter — it causes issues. All posts automatically use the site-wide author.

Bootstrap

This site does not use Bootstrap. Minimal Mistakes has its own CSS framework. Do not add Bootstrap classes.

Troubleshooting

Build Fails

  1. Go to repo → Actions tab → click failed build → read error logs
  2. Common causes: YAML syntax error, missing quotes, invalid Liquid syntax

Images Not Displaying

Changes Not Showing on Live Site

  1. Check the Pages build completed (green checkmark in Actions tab)
  2. Open site in incognito mode to bypass browser cache
  3. Wait up to 10 minutes for CDN propagation after branch switch
  4. If still stale, push an empty commit to force rebuild

Gemfile Dependency Warning

If you see “The github-pages gem can’t satisfy your Gemfile’s dependencies” — ensure jekyll-include-cache is not listed separately in the Gemfile; it’s bundled inside github-pages.

Power BI iframes Not Loading

Resources

Last Updated: 2026-03-01 Theme Version: Minimal Mistakes 4.24.0 Jekyll Version: Via GitHub Pages gem