Skip to content

Commit c78b68d

Browse files
viktorpmviktorpm
committed
add template page
1 parent 8621efa commit c78b68d

10 files changed

Lines changed: 194 additions & 10 deletions

File tree

‎TEMPLATE_README.md‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# LIM Lab Website Template System
2+
3+
## Overview
4+
This website uses a simple template system to maintain consistency across all pages. When you need to make design changes to headers, footers, or navigation, you can update all pages at once using the provided script.
5+
6+
## Files Structure
7+
- `update_template.py` - Script to update all pages with common templates
8+
- `includes/` - Directory containing template components (for reference)
9+
- Individual HTML pages - Each page has its own content but uses common header/footer
10+
11+
## How to Make Design Changes
12+
13+
### 1. Update the Template Script
14+
Edit `update_template.py` and modify the `HEADER_TEMPLATE` or `FOOTER_TEMPLATE` variables with your changes.
15+
16+
### 2. Run the Update Script
17+
```bash
18+
python3 update_template.py
19+
```
20+
21+
This will update all pages (index.html, research.html, people.html, publications.html, labnews.html, join.html) with the new template.
22+
23+
### 3. Verify Changes
24+
Check that all pages have been updated correctly and the navigation active states are working.
25+
26+
## Current Template Features
27+
- **Header**: IM Lab logo, navigation menu with active state highlighting
28+
- **Footer**: LIM Lab branding, official SWC and UCL logos
29+
- **Navigation**: Automatic active state based on current page
30+
- **Responsive**: Mobile-friendly design
31+
32+
## Adding New Pages
33+
1. Create your new HTML page
34+
2. Add it to the `pages` list in `update_template.py`
35+
3. Run the script to apply the template
36+
4. Add your page-specific content
37+
38+
## Notes
39+
- The script automatically sets the active navigation state for each page
40+
- All pages use the same CSS file (`assets/css/style.css`)
41+
- Logos are loaded from official institutional URLs to ensure they're always up-to-date

‎includes/footer.html‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<footer class="site-footer">
2+
<div class="footer-content">
3+
<div class="footer-brand">LIM Lab</div>
4+
<div class="footer-logos">
5+
<a href="https://www.ucl.ac.uk/swc" target="_blank" rel="noreferrer">
6+
<img src="https://www.sainsburywellcome.org/sites/default/files/2021-05/swc-logo.png" alt="Sainsbury Wellcome Centre logo">
7+
</a>
8+
<a href="https://www.ucl.ac.uk" target="_blank" rel="noreferrer">
9+
<img src="https://www.ucl.ac.uk/sites/default/files/ucl-logo.png" alt="UCL logo">
10+
</a>
11+
</div>
12+
</div>
13+
</footer>

‎includes/head.html‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<title>{{PAGE_TITLE}} – LIM Lab</title>
8+
<meta name="description" content="{{PAGE_DESCRIPTION}}">
9+
<link rel="canonical" href="https://limlabswc.github.io{{PAGE_URL}}">
10+
<link rel="icon" href="assets/img/logo.png" type="image/png">
11+
<meta property="og:site_name" content="Learning, Inference & Memory">
12+
<meta property="og:title" content="{{PAGE_TITLE}} – LIM Lab">
13+
<meta property="og:type" content="website">
14+
<meta property="og:description" content="{{PAGE_DESCRIPTION}}">
15+
<meta property="og:image" content="assets/img/hero.jpg">
16+
<meta name="twitter:card" content="summary_large_image">
17+
<meta name="twitter:title" content="{{PAGE_TITLE}} – LIM Lab">
18+
<meta name="twitter:description" content="{{PAGE_DESCRIPTION}}">
19+
<meta name="twitter:image" content="assets/img/hero.jpg">
20+
<link rel="stylesheet" href="assets/css/style.css">
21+
</head>

‎includes/header.html‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<header class="site-header">
2+
<div class="header-container">
3+
<div class="brand">
4+
<div class="logo-container">
5+
<div class="logo-text">
6+
<div class="logo-main">IM</div>
7+
<div class="logo-sub">Lab</div>
8+
</div>
9+
<div class="logo-full">Learning Inference Memory</div>
10+
</div>
11+
</div>
12+
<nav class="nav">
13+
<a href="/">HOME</a>
14+
<a href="/research">RESEARCH</a>
15+
<a href="/people">PEOPLE</a>
16+
<a href="/publications">PUBLICATIONS</a>
17+
<a href="/labnews">LAB NEWS</a>
18+
<a href="/join">JOIN</a>
19+
</nav>
20+
</div>
21+
</header>

‎join.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
<link rel="stylesheet" href="assets/css/style.css">
2121
</head>
2222
<body>
23-
<header class="site-header">
23+
<header class="site-header">
2424
<div class="header-container">
2525
<div class="brand">
2626
<div class="logo-container">
@@ -185,7 +185,7 @@ <h3>Application Materials</h3>
185185
</div>
186186
</main>
187187

188-
<footer class="site-footer">
188+
<footer class="site-footer">
189189
<div class="footer-content">
190190
<div class="footer-brand">LIM Lab</div>
191191
<div class="footer-logos">

‎labnews.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
<link rel="stylesheet" href="assets/css/style.css">
2121
</head>
2222
<body>
23-
<header class="site-header">
23+
<header class="site-header">
2424
<div class="header-container">
2525
<div class="brand">
2626
<div class="logo-container">
@@ -113,7 +113,7 @@ <h4>Training</h4>
113113
</div>
114114
</main>
115115

116-
<footer class="site-footer">
116+
<footer class="site-footer">
117117
<div class="footer-content">
118118
<div class="footer-brand">LIM Lab</div>
119119
<div class="footer-logos">

‎people.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
<link rel="stylesheet" href="assets/css/style.css">
2121
</head>
2222
<body>
23-
<header class="site-header">
23+
<header class="site-header">
2424
<div class="header-container">
2525
<div class="brand">
2626
<div class="logo-container">
@@ -280,7 +280,7 @@ <h2>Alumni</h2>
280280
</div>
281281
</main>
282282

283-
<footer class="site-footer">
283+
<footer class="site-footer">
284284
<div class="footer-content">
285285
<div class="footer-brand">LIM Lab</div>
286286
<div class="footer-logos">

‎publications.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
<link rel="stylesheet" href="assets/css/style.css">
2121
</head>
2222
<body>
23-
<header class="site-header">
23+
<header class="site-header">
2424
<div class="header-container">
2525
<div class="brand">
2626
<div class="logo-container">
@@ -220,7 +220,7 @@ <h2>Research Areas</h2>
220220
</div>
221221
</main>
222222

223-
<footer class="site-footer">
223+
<footer class="site-footer">
224224
<div class="footer-content">
225225
<div class="footer-brand">LIM Lab</div>
226226
<div class="footer-logos">

‎research.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
<link rel="stylesheet" href="assets/css/style.css">
2121
</head>
2222
<body>
23-
<header class="site-header">
23+
<header class="site-header">
2424
<div class="header-container">
2525
<div class="brand">
2626
<div class="logo-container">
@@ -148,7 +148,7 @@ <h2>Research Photos</h2>
148148
</div>
149149
</main>
150150

151-
<footer class="site-footer">
151+
<footer class="site-footer">
152152
<div class="footer-content">
153153
<div class="footer-brand">LIM Lab</div>
154154
<div class="footer-logos">

‎update_template.py‎

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
#!/usr/bin/env python3
2+
"""
3+
Simple template updater for LIM Lab website.
4+
This script helps maintain consistency across all pages.
5+
"""
6+
7+
import os
8+
import re
9+
10+
# Common header template
11+
HEADER_TEMPLATE = ''' <header class="site-header">
12+
<div class="header-container">
13+
<div class="brand">
14+
<div class="logo-container">
15+
<div class="logo-text">
16+
<div class="logo-main">IM</div>
17+
<div class="logo-sub">Lab</div>
18+
</div>
19+
<div class="logo-full">Learning Inference Memory</div>
20+
</div>
21+
</div>
22+
<nav class="nav">
23+
<a href="/">HOME</a>
24+
<a href="/research">RESEARCH</a>
25+
<a href="/people">PEOPLE</a>
26+
<a href="/publications">PUBLICATIONS</a>
27+
<a href="/labnews">LAB NEWS</a>
28+
<a href="/join">JOIN</a>
29+
</nav>
30+
</div>
31+
</header>'''
32+
33+
# Common footer template
34+
FOOTER_TEMPLATE = ''' <footer class="site-footer">
35+
<div class="footer-content">
36+
<div class="footer-brand">LIM Lab</div>
37+
<div class="footer-logos">
38+
<a href="https://www.ucl.ac.uk/swc" target="_blank" rel="noreferrer">
39+
<img src="https://www.sainsburywellcome.org/sites/default/files/2021-05/swc-logo.png" alt="Sainsbury Wellcome Centre logo">
40+
</a>
41+
<a href="https://www.ucl.ac.uk" target="_blank" rel="noreferrer">
42+
<img src="https://www.ucl.ac.uk/sites/default/files/ucl-logo.png" alt="UCL logo">
43+
</a>
44+
</div>
45+
</div>
46+
</footer>'''
47+
48+
def update_page(page_path, active_nav):
49+
"""Update a single page with the common template."""
50+
with open(page_path, 'r', encoding='utf-8') as f:
51+
content = f.read()
52+
53+
# Replace header
54+
header_pattern = r'<header class="site-header">.*?</header>'
55+
content = re.sub(header_pattern, HEADER_TEMPLATE, content, flags=re.DOTALL)
56+
57+
# Replace footer
58+
footer_pattern = r'<footer class="site-footer">.*?</footer>'
59+
content = re.sub(footer_pattern, FOOTER_TEMPLATE, content, flags=re.DOTALL)
60+
61+
# Set active navigation
62+
if active_nav:
63+
content = content.replace(f'href="{active_nav}"', f'href="{active_nav}" class="active"')
64+
65+
with open(page_path, 'w', encoding='utf-8') as f:
66+
f.write(content)
67+
68+
print(f"Updated {page_path}")
69+
70+
def main():
71+
"""Update all pages with the common template."""
72+
pages = [
73+
('index.html', '/'),
74+
('research.html', '/research'),
75+
('people.html', '/people'),
76+
('publications.html', '/publications'),
77+
('labnews.html', '/labnews'),
78+
('join.html', '/join'),
79+
]
80+
81+
for page_path, active_nav in pages:
82+
if os.path.exists(page_path):
83+
update_page(page_path, active_nav)
84+
else:
85+
print(f"Warning: {page_path} not found")
86+
87+
if __name__ == "__main__":
88+
main()

0 commit comments

Comments
 (0)