@gurupanguji

gurupanguji.github.io // Documentation

This repository houses the personal portfolio and review site for @gurupanguji. It is built as a high-end static site using Jekyll, following the philosophy of “Das Wesentliche” (The Essential).

🏷 Naming Policy

🏗 Site Architecture

The site uses Jekyll to generate a static portfolio and a 1,200+ post blog archive:

/_config.yml                # Jekyll Configuration (Pagination, SEO, Timezone)
/Gemfile                    # Ruby dependencies (with Ruby 4.0 compatibility patches)
/index.html                 # Home: Portal to Blog & Reviews (Jekyll powered)
/404.html                   # Custom 404 & Legacy WP Link Redirector
/GEMINI.md                  # Core Agent Mandates (Branching Policy)
/docs/
    /superpowers/
        /plans/             # Implementation plans (tracked in branches)
        /specs/             # Technical specifications (tracked in branches)
/scripts/
    /generate_social_snippets.py # Generator for _snippets/ artifacts
    /publish_social.py           # Core engine for social media API publishing
    /validate_posts.py           # CI validator for post dates and snippet coverage
/.github/workflows/
    /publish_social.yml          # Scheduled (15:00 PT) social media publisher
    /validate_posts.yml          # CI check for post/snippet integrity
    /validate_html.yml           # CI check for markdown leaks in HTML
/_layouts/
    /post.html              # Standard layout for blog posts & archive
/_posts/
    /YYYY-MM-DD-slug.md     # 1,200+ migrated WordPress posts
/_snippets/
    /YYYY-MM-DD-slug.md     # Companion social snippets for each blog post
/about/
    /index.html             # About page
/blog/
    /index.html             # Jekyll-paginated Blog Archive
/rss/
    /index.html             # RSS Feed Portal
    /photography.xml        # Photography RSS Feed
/assets/
    /gurupanguji.jpeg       # Profile image (Favicon & Avatar)
    /whatsapp-preview.jpg   # Default social preview image (OG/Twitter/WhatsApp)
    /css/style.css          # Global Design System (Resets, Header, Footer)
    /images/blog/           # Locally hosted images for blog posts
/reviews/
    /index.html             # Visual Portal for all reviews
    /camera/
        /$brand/$model/     # e.g., /reviews/camera/leica/m11-p/ or /reviews/camera/fujifilm/x100vi/
            /index.html     # The review content
            /images/        # Published assets referenced by the review

🌳 Git Workflow & Branching Policy

To ensure the stability of the main branch, all changes must follow these rules:

🎨 Design System: “Das Wesentliche”

The design is inspired by German precision engineering (Leica):

Shared UI Components

1. Background Dot Grid

Every page should include this div immediately after the <body> tag:

<div class="dot-grid"></div>

2. Premium Header (.header-minimal)

Used on all pages. Note: Use absolute paths (/about/index.html, /assets/...) to ensure consistency across Jekyll’s nested directory structure.

<header class="header-minimal">
  <a href="/" class="logo-link">
    <img src="/assets/gurupanguji.jpeg" alt="Avatar" class="avatar avatar-sm">
    gurupanguji
  </a>
  <nav class="nav-links">
    <a href="/about/index.html" class="nav-link">About</a>
    <a href="/blog/index.html" class="nav-link">Blog</a>
    <a href="/reviews/index.html" class="nav-link">Photography</a>
  </nav>
</header>

Standardized copyright signature and 6 social icons.

<footer>
  <!-- Social Links -->
  <div class="copyright">
    © 2026 // gurupanguji //
    <span class="das-wesentliche" style="letter-spacing: 2px; font-size: 0.5rem">Das Wesentliche.</span>
  </div>
</footer>

✍️ Writing Content

Voice Calibration Notes

Adding a New Post

  1. Create File: Create a new Markdown file in _posts/ following the YYYY-MM-DD-slug.md naming convention.
  2. YAML Front Matter: Every post MUST start with this block: 
    ---
layout: post
title: "Your Post Title"
date: YYYY-MM-DD HH:MM:SS +0000
categories: ["category1", "category2"]
tags: ["tag1", "tag2"]
---

    Note: Using +0000 ensures the URL date matches your filename exactly.

  3. Markdown Styling:
    • Quotes: Use > for blockquotes (rendered in Newsreader serif).
    • Code: Use triple backticks for code blocks (rendered in a contrasted box).
    • Embeds: For new Jekyll posts, prefer native HTML or markdown embeds over legacy wp-* WordPress block markup when a clean native option exists.
  4. Images:
    • Place images in assets/images/blog/.
    • Reference them using absolute paths: ![](/assets/images/blog/filename.jpg).
  5. Social Snippets: Create a companion file in _snippets/ with the same YYYY-MM-DD-slug.md filename. Include platform-specific copy for Twitter, Tumblr, LinkedIn, Threads, Bluesky, Mastodon, Instagram, and Pixelfed.
  6. Editor’s Desk Pass: Before posting any new blog post, always run an Editor’s Desk pass first. Fix factual issues and clarity breaks first, then tighten cadence without sanding off authored texture.
  7. Local Preview: Run bundle exec jekyll serve and check http://localhost:4000/blog/ before committing.
  8. Direct In-File Edit Pause: If the author wants to edit the post directly, create the real _posts/YYYY-MM-DD-slug.md file first, then pause snippet generation, commit, and push until those edits are done.

Adding a New Review

  1. Create a folder in reviews/camera/ or reviews/lens/.
  2. Add assets to a local images/ subfolder.
  3. Update reviews/index.html and assets/photography.json (for RSS).

🤖 Automations & SEO

To prevent 404s for old WordPress blog links, 404.html acts as a routing layer:

SEO & Discoverability

Social Media Automation

🛠 Development Notes

Updated March 2026