Skip to content

Site Architecture

Jump to bottom
Alexander Refsum Jensenius edited this page Jul 4, 2026 · 4 revisions

The MishMash website is a Jekyll static site hosted on GitHub Pages. It uses the Cayman remote theme with extensive custom CSS.

Repository layout

Jekyll is configured with source: site in the root _config.yml. The repo is split:

mishmash-web/
├── _config.yml              # Jekyll config (points source at site/)
├── Gemfile                  # Ruby dependencies
├── .github/workflows/       # CI, deploy, nightly NVA sync
├── config/                  # Local credentials, tag_merge_map.yml
├── scripts/                 # Python automation
└── site/                    # ← all published site content
    ├── _config.yml          # (none — config is at repo root)
    ├── _data/               # YAML data (translations, results, tag groups)
    ├── _directory/          # people, institutions, projects collection
    ├── _events/             # events collection
    ├── _news/               # news collection
    ├── _includes/           # reusable HTML snippets
    ├── _layouts/            # page templates
    ├── about/               # about & organisation pages
    ├── assets/              # CSS, images, portraits, logos
    ├── events/              # events index, ICS calendar
    ├── gallery/
    ├── internal/            # password-protected WP pages
    ├── news/
    ├── no/                  # Norwegian pages
    ├── people/network/      # interactive people network graph
    ├── results/
    ├── search/
    ├── vacancies/
    ├── wp1/ … wp7/          # work package pages
    ├── index.md             # front page
    └── search.json          # Liquid template → search index

Build output goes to _site/ at the repo root (gitignored).

Key configuration — _config.yml 

source: site
destination: _site
markdown: kramdown
remote_theme: pages-themes/cayman@v0.2.0
url: "https://mishmash.no"
timezone: Europe/Oslo
future: true   # publishes events with future dates

Plugins:

  • jekyll-remote-theme — Cayman base theme
  • jekyll-feed — RSS/Atom feeds for events and news
  • jekyll-redirect-from — supports redirect_from in front matter

Jekyll collections

Collection Source folder Output URL
events site/_events/ /events/:title/
news site/_news/ /news/:title/
directory site/_directory/ /:path/ (overridden per entry)

Directory entries set explicit permalinks, e.g. /people/{slug}/, /institutions/{slug}/, /projects/{slug}/.

Layouts (site/_layouts/)

File Purpose
default.html Base layout — header, navigation, footer, language switcher, SEO
page.html Simple content wrapper for about/WP/institution pages
person.html Person profile with affiliations, tags, publications
event.html Event metadata, iCalendar generation
internal.html Password-gated pages (client-side SHA-256)
meeting.html Board/council meeting pages

Includes (site/_includes/)

File Purpose
events_front_page.html Next upcoming events on the front page
news_front_page.html Recent news items
partner_events_front_page.html Partner institution events
events_wp_pages.html WP-filtered event lists
nva-results-list.html Research results cards from NVA data
board_meetings.html / council_meetings.html Meeting lists
lang-switcher.html English ↔ Norwegian switcher

Data files (site/_data/)

File Content
translations.yml UI strings (en, nb)
mishmash_results.yml MishMash publications from NVA (nightly sync)
partner_events.yml AI events scraped from partner sites
other_events.yml Additional external events
work_packages.yml WP metadata for network graph and listings
tag_groups.yml Research tag groupings for people network
institution_locations.yml Map coordinates for institutions

CSS (site/assets/css/)

File Purpose
custom.css Brand colours, typography, header nav dropdowns, search badges, results cards
people-network.css D3 people network graph
style.css Cayman theme overrides
icons.css Icon definitions
adaptive.css Adaptive content / stretchtext (see Adaptive Content)

Styling belongs in these files — layouts use classes, not inline styles.

Adaptive content

Pages with adaptive: true in front matter get the audience switcher and stretchtext support. Reader groups are defined in site/_data/audiences.yml; the assets are adaptive.css, assets/js/adaptive.js, and the audience-switcher.html / stretch.html includes. Authoring guide: Adaptive Content.

Student UI themes (themes/, repo root)

Alternative frontends built by student groups. Each themes/<name>/ shadows files in site/ at build time via scripts/ui (list / new / serve / build); production builds ignore themes/ entirely. Guide: Student Development and themes/README.md in the repo.

Multilingual support

  • Default: English (en)
  • Norwegian: site/no/ (e.g. site/no/about/description/index.md)
  • Set lang: nb in Norwegian front matter
  • Link EN ↔ NO with translation_url
  • Prefer absolute asset paths (/assets/...) in shared includes

People network

site/people/network/index.html renders an interactive D3 graph of researchers connected by shared institutions, tags, or work packages.

  • Connection modes: institutions, tags, work packages (from site/_data/work_packages.yml)
  • Role filters: Board, Council, Members (Member role), WP Leaders (slugs in work_packages.yml)
  • Tag display groups: site/_data/tag_groups.yml
  • Styles: site/assets/css/people-network.css

Clone this wiki locally