Bump version to 1.6.0, update docs and guides to match current project state

- version.php: 1.5.0 → 1.6.0 + changelog for media browser, editor,
  theme management, content move/rename, /-media/ prefix
- README.md/README.en.md: complete rewrite with current project structure,
  config format, admin features, CodeMirror, themes, quick start
- guide/nl.codepress.md, guide/en.codepress.md: comprehensive update
  matching all current admin routes, features, and project layout
- TODO.md: compiled from docs/TODO.md with completed/future items
This commit is contained in:
2026-06-24 17:15:14 +02:00
parent dc0d370e65
commit e14f418e63
6 changed files with 1166 additions and 824 deletions

View File

@@ -1,104 +1,182 @@
# CodePress CMS Guide
## Welcome to CodePress
## Overview
CodePress is a lightweight, file-based Content Management System built with PHP and Bootstrap.
CodePress CMS is a lightweight, file-based content management system built with PHP (>=8.0). Works without a database.
## Features
### 🏠 Navigation
- Tab-style navigation with Bootstrap styling
### Navigation
- Tab-style navigation with Bootstrap 5 styling
- Dropdown menus for folders and sub-folders
- Home button with icon
- Automatic menu generation
- Automatic menu generation based on directory structure
- Responsive design
- Breadcrumb navigation with sidebar toggle
- Active state marking
- **Sidebar toggle** - Button placed left of HOME in the breadcrumb to open/close the sidebar. The icon changes between open and closed state. The choice is preserved during the session
### 📄 Content Types
- **Markdown (.md)** - CommonMark support
### Content Types
- **Markdown (.md)** - CommonMark support via `league/commonmark`
- **PHP (.php)** - Dynamic content
- **HTML (.html)** - Static HTML pages
- **Directory listings** - Automatic directory overviews
- **Language-specific content** - `en.` and `nl.` prefixes
### 🔍 Search Functionality
### Search Functionality
- Full-text search through all content
- Results with snippets and highlighting
- Direct navigation to found pages
- SEO-friendly search results
- Search URL: `?search=query`
### 🧭 Configuration
### Configuration
- **JSON configuration** in `config.json`
- Dynamic homepage setting
- Dynamic homepage setting (`default_page`)
- SEO settings (description, keywords)
- Author information with links
- Theme configuration with colors
- Theme configuration via `themes/` directory
- Language settings
- Feature toggles
- Feature toggles (auto_link_pages, search_enabled, breadcrumbs_enabled)
### 🎨 Layout & Design
### Layout & Design
- Flexbox layout for responsive structure
- Fixed header with logo and search
- Breadcrumb navigation
- Fixed footer with file info and links
- Bootstrap 5 styling
- Mustache templates
- Mustache templates (`cms/templates/`)
- Semantic HTML5 structure
- **Dynamic layouts** with YAML frontmatter
- **Sidebar support** with plugin integration and toggle function via breadcrumb
- **Theme support** via `themes/` directory with theme.json per theme
### 🛡️ Admin Console
### Admin Console
- Built-in admin panel at `/admin.php`
- **Dashboard** with statistics and quick actions
- **Content management** - Browse, create, edit and delete files
- **Dashboard** with statistics (pages, directories, plugins) and quick actions
- **Content management** - Browse files, upload, create, edit, rename, move and delete
- **CodeMirror editor** with toolbar (bold, italic, heading, link, image, list, media insert)
- **Media browser modal** in the editor for selecting images/files
- **Directory management** - Create, rename and delete directories (empty only)
- **Configuration editor** - Edit `config.json` with JSON validation
- **Plugin overview** - Status of all installed plugins
- **User management** - Add, remove users and change passwords
- **Theme management** - Create, activate, edit (colors, background) and delete themes
- **Plugin management** - Overview, create, edit, configure, enable/disable and delete
- **Media management** - Upload and delete media files in `content/-assets/`
- **User management** - Add, remove users, change passwords
- Session-based authentication with bcrypt hashing
- CSRF protection, brute-force lockout (5 attempts, 15 min)
- Default login: `admin` / `admin` (change immediately after installation)
## Installation
1. Clone or download CodePress files
2. Upload to your web server
3. Make sure `content/` directory is writable
4. Navigate to your website in browser
1. Upload files to web server
2. Set permissions for web server
3. Run `composer install` for CommonMark dependency
4. Configure `config.json` if needed
5. Access website via browser
6. **PHP development server**: `php -S localhost:8080 -t public` (uses `cms/router.php`)
## Project Structure
```
codepress/
├── cms/ # Core CMS engine
│ ├── core/
│ │ ├── class/
│ │ │ ├── CodePressCMS.php # Main CMS class (content, navigation, search)
│ │ │ ├── Logger.php # Structured logging system
│ │ │ └── SimpleTemplate.php # Mustache-style template engine
│ │ ├── plugin/
│ │ │ ├── PluginManager.php # Plugin loader and manager
│ │ │ └── CMSAPI.php # API for plugin developers
│ │ ├── config.php # Configuration loader (merge with config.json)
│ │ └── index.php # Bootstrap (autoloader, requires)
│ ├── lang/ # Language files
│ │ ├── nl.php # Dutch translations
│ │ └── en.php # English translations
│ ├── logs/ # CMS logs
│ ├── templates/ # Mustache templates
│ │ ├── layout.mustache # Main layout (CSS, structure)
│ │ ├── assets/ # Header, navigation, footer partials
│ │ ├── markdown_content.mustache
│ │ ├── php_content.mustache
│ │ └── html_content.mustache
│ └── router.php # PHP dev server router
├── admin/ # Admin panel
│ ├── config/
│ │ ├── app.php # Admin app configuration (paths, timezone)
│ │ └── admin.json # Users & security (bcrypt hashes)
│ ├── src/
│ │ └── AdminAuth.php # Authentication (sessions, bcrypt, CSRF, lockout)
│ ├── templates/
│ │ ├── login.php # Login page
│ │ ├── layout.php # Admin layout with sidebar navigation
│ │ └── pages/
│ │ ├── dashboard.php # Dashboard with statistics
│ │ ├── content.php # Content overview with file upload
│ │ ├── content-edit.php # CodeMirror editor with toolbar and rename
│ │ ├── content-new.php # Create new content
│ │ ├── content-dir-form.php # Create/edit directory
│ │ ├── content-move-form.php # Move content
│ │ ├── config.php # Configuration editor (JSON)
│ │ ├── plugins.php # Plugin overview
│ │ ├── plugins-edit.php # Plugin PHP source code editor
│ │ ├── plugins-new.php # Create new plugin
│ │ ├── plugin-config.php # Plugin configuration editor
│ │ ├── theme.php # Theme management (create, activate, edit)
│ │ ├── media.php # Media management (upload, delete)
│ │ └── users.php # User management
│ └── storage/logs/ # Admin logs
├── cli/ # CLI scripts & tests
├── content/ # Content files
│ ├── -assets/ # Uploaded media files
│ ├── index.md # Default homepage
│ └── ... # Other content
├── plugins/ # CMS plugins
│ ├── HTMLBlock/ # Custom HTML blocks in sidebar
│ ├── MQTTTracker/ # Real-time analytics and tracking
│ └── test/ # Test plugin
├── public/ # Web root
│ ├── index.php # Website entry point (media serving + CMS)
│ ├── admin.php # Admin entry point + routing
│ ├── .htaccess # Apache rewrite/security rules
│ ├── assets/ # CSS, JS, favicons
│ │ ├── codemirror/ # CodeMirror editor (minified JS/CSS)
│ │ └── css/js/ # Bootstrap, icons, app CSS/JS
│ ├── themes/ # Uploaded theme backgrounds
│ └── manifest.json / sw.js # PWA support
├── themes/ # Theme definitions
│ ├── default/ # Default theme
│ │ └── theme.json # Colors, heights, background
│ └── test/ # Test theme
│ └── theme.json
├── config.json # Site configuration
├── version.php # Version information (1.5.0)
└── vendor/ # Composer dependencies
```
## Configuration
### Basic Settings
### Basic Configuration (`config.json`)
Edit `config.json` in your project root:
\`\`\`json
```json
{
"site_title": "Your Website Name",
"site_title": "CodePress",
"content_dir": "content",
"templates_dir": "engine/templates",
"default_page": "auto",
"templates_dir": "cms\/templates",
"default_page": "index",
"active_theme": "default",
"language": {
"default": "en",
"available": ["en", "nl"]
},
"theme": {
"header_color": "#0a369d",
"header_font_color": "#ffffff",
"navigation_color": "#2754b4",
"navigation_font_color": "#ffffff",
"sidebar_background": "#f8f9fa",
"sidebar_border": "#dee2e6"
},
"author": {
"name": "Your Name",
"website": "https://yourwebsite.com"
"available": ["nl", "en"]
},
"seo": {
"description": "Your website description",
"keywords": "cms, php, content management"
"description": "CodePress CMS - Lightweight file-based content management system",
"keywords": "cms, php, content management, file-based"
},
"author": {
"name": "E. Noorlander",
"website": "https:\/\/noorlander.info"
},
"features": {
"auto_link_pages": true,
@@ -106,61 +184,114 @@ Edit `config.json` in your project root:
"breadcrumbs_enabled": true
}
}
\`\`\`
```
## Content Management
- `active_theme` - Determines which theme from `themes/` is active
- `templates_dir` - Directory with Mustache templates (`cms/templates`)
- `default_page` - Default page (e.g. `index`)
- `content_dir` - Directory with content files (usually not changed)
### Theme Configuration (`themes/<name>/theme.json`)
```json
{
"name": "Default",
"header_color": "#0a369d",
"header_font_color": "#ffffff",
"header_height": "56",
"navigation_color": "#2754b4",
"navigation_font_color": "#ffffff",
"nav_height": "42",
"sidebar_background": "#f8f9fa",
"sidebar_border": "#dee2e6",
"background_image": "",
"background_image_opacity": "100"
}
```
Themes can be managed via the admin panel: create, activate, adjust colors, upload background image and delete.
## Content Structure
### File Structure
\`\`\`
```
content/
├── home.md # Home page
├── blog/
│ ├── index.md # Blog overview
├── article-1.md # Blog article
│ └── category/
│ └── article.md # Article in category
└── about-us/
└── info.md # About us page
\`\`\`
├── folder1/
│ ├── subfolder1/
│ ├── nl.page1.md
│ └── en.page1.md
│ └── page3.html
├── folder2/
│ └── page4.md
├── index.md
└── -assets/
├── image.jpg
└── document.pdf
```
### Content Types
### File Naming
- Use lowercase filenames
- No spaces - use `-` or `_`
- Logical extensions - `.md`, `.php`, `.html`
- Unique names - no duplicates
- Language prefixes - `nl.file.md` and `en.file.md`
#### Markdown (`.md`)
\`\`\`markdown
# Page Title
### Media Files
This is page content in **Markdown** format with CommonMark extensions.
Media files (images, PDFs, video, audio) can be placed in any `content/` subdirectory and are served via:
## Subsection
- **`/-media/path/file.jpg`** - Media from any content subdirectory
- **`/-assets/file.jpg`** - Backward compatibility (old URLs)
- Uploads via the admin panel go to `content/-assets/`
- [x] Task list item
- [ ] Another task
- **Bold** and *italic* text
- [Auto-linked pages](?page=another-page)
\`\`\`
## Admin Console
#### PHP (`.php`)
\`\`\`php
<?php
$title = "Dynamic Page";
?>
<h1><?php echo htmlspecialchars($title); ?></h1>
<p>This is dynamic content with PHP.</p>
\`\`\`
### Access
#### HTML (`.html`)
\`\`\`html
<h1>HTML Page</h1>
<p>This is static HTML content.</p>
\`\`\`
- **URL**: `/admin.php`
- **Default login**: `admin` / `admin`
### File Naming Conventions
### Routes
- **Lowercase names**: Use lowercase for all files
- **No spaces**: Use hyphens (-) or underscores (_)
- **Language prefixes**: `en.page.md` and `nl.page.md`
- **Display names**: `file-name.md` displays as "File Name" in menus
| Route | Description |
|---|---|
| `login` | Login page |
| `logout` | Logout |
| `dashboard` | Dashboard with statistics |
| `content` | Content overview (browse, upload) |
| `content-edit` | Edit content (CodeMirror editor) |
| `content-new` | Create new content |
| `content-delete` | Delete content |
| `content-move` | Move content to another directory |
| `content-dir-form` | Create or edit directory |
| `content-dir-rename` | Rename directory |
| `content-dir-create` | Create directory (POST) |
| `content-dir-delete` | Delete directory (empty only) |
| `config` | Configuration editor (`config.json`) |
| `theme` | Theme management |
| `plugins` | Plugin overview |
| `plugins-new` | Create new plugin |
| `plugins-edit` | Edit plugin PHP source code |
| `plugins-config` | Edit plugin configuration |
| `plugins-toggle` | Enable/disable plugin |
| `plugins-delete` | Delete plugin |
| `media` | Media management (upload, delete) |
| `media-list` | JSON list of all media (for editor modal) |
| `users` | User management |
### Editor Features
The content editor (`content-edit`, `content-new`) includes:
- **CodeMirror** syntax highlighting for Markdown/PHP/HTML
- **Toolbar** with buttons for: bold, italic, heading, link, image, list, media insert
- **Media browser modal** - Open via the "Media" button to select images/files
- **Inline filename rename** - Inline filename input with extension badge
- **Layout selector** - Choose from available layouts
- **Plugin per-page visibility** - Select which plugins to show on this page
- **Upload and "Create" buttons** are disabled until input is provided
- **"Cancel" button** (instead of "Back") for unsaved changes
## Templates
@@ -173,93 +304,44 @@ $title = "Dynamic Page";
- `author_git` - Git repository link
#### Page Info
- `page_title` - Page title (filename without extension)
- `content` - Page content (HTML)
- `file_info` - File information (dates, size)
- `is_homepage` - Boolean: is this homepage?
- `page_title` - Page title
- `content` - Content (HTML)
- `file_info` - File information
- `is_homepage` - Boolean: is this the homepage?
#### Navigation
- `menu` - Navigation menu
- `breadcrumb` - Breadcrumb navigation
- `homepage` - Homepage link
#### Theme
#### Theme (from theme.json)
- `header_color` - Header background color
- `header_font_color` - Header text color
- `header_height` - Header height in pixels
- `navigation_color` - Navigation background color
- `navigation_font_color` - Navigation text color
- `nav_height` - Navigation height in pixels
- `sidebar_background` - Sidebar background color
- `sidebar_border` - Sidebar border color
- `background_image_css` - CSS for background image
- `background_image_opacity` - Overlay opacity
#### Language
- `current_lang` - Current language (en/nl)
- `current_lang_upper` - Current language (EN/NL)
- `t_*` - Translated strings
## URL Structure
### Basic URLs
- **Home**: `/` or `?page=home`
- **Page**: `?page=blog/article`
- **Search**: `?search=query`
- **Guide**: `?guide`
- **Language**: `?lang=en` or `?lang=nl`
## SEO Optimization
### Meta Tags
The CMS automatically adds meta tags:
\`\`\`html
<meta name="generator" content="CodePress CMS">
<meta name="application-name" content="CodePress">
<meta name="author" content="Your Name">
<meta name="description" content="...">
<meta name="keywords" content="...">
<link rel="author" href="https://yourwebsite.com">
<link rel="me" href="https://git.noorlander.info/E.Noorlander/CodePress">
\`\`\`
## 🔌 Plugin System
### Plugin Structure
\`\`\`
plugins/
├── README.md # Plugin documentation
├── HTMLBlock/
│ ├── HTMLBlock.php # Plugin class
│ └── README.md # Plugin specific documentation
└── MQTTTracker/
├── MQTTTracker.php # Plugin class
├── config.json # Plugin configuration
└── README.md # Plugin documentation
\`\`\`
### Plugin Development
- **API access** via `CMSAPI` class
- **Sidebar content** with `getSidebarContent()`
- **Metadata access** from YAML frontmatter
- **Configuration** via JSON files
- **Event hooks** for extension
### Available Plugins
- **HTMLBlock** - Custom HTML blocks in sidebar
- **MQTTTracker** - Real-time analytics and tracking
## 🎯 Template System
### Layout Options
Use YAML frontmatter to select layout:
\`\`\`yaml
```yaml
---
title: My Page
layout: sidebar-content
plugins: HTMLBlock
---
\`\`\`
```
### Available Layouts
@@ -271,70 +353,227 @@ layout: sidebar-content
### Meta Data
\`\`\`yaml
```yaml
---
title: Page Title
layout: content-sidebar
description: Page description
author: Author Name
date: 2025-11-26
plugins: HTMLBlock, MQTTTracker
---
\`\`\`
```
## 📊 Analytics & Tracking
## URL Structure
### Frontend Page URLs
- **Home**: `/` or `?page=index&lang=en`
- **Page**: `?page=folder/page&lang=en`
- **Search**: `?search=query`
- **Guide**: `?guide`
- **Language switch**: `?lang=nl` or `?lang=en`
### Media URLs
- **Media**: `/-media/path/to/file.jpg` (from any content subdirectory)
- **Assets**: `/-assets/file.jpg` (from content/-assets/, backward compatible)
### Admin URLs
- **Admin**: `admin.php?route=dashboard`
- **Edit content**: `admin.php?route=content-edit&file=page.md`
- **New content**: `admin.php?route=content-new&dir=folder`
- **Edit theme**: `admin.php?route=theme&edit=themename`
## SEO Optimization
### Meta Tags
The CMS automatically adds meta tags:
```html
<meta name="generator" content="CodePress CMS">
<meta name="author" content="E. Noorlander">
<meta name="description" content="...">
<meta name="keywords" content="...">
```
### Security Headers
```http
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
Referrer-Policy: strict-origin-when-cross-origin
Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline'; ...
```
## Plugin System
### Plugin Structure
```
plugins/
├── HTMLBlock/
│ ├── HTMLBlock.php # Plugin class (required)
│ ├── config.json # Configuration (optional)
│ └── README.md # Documentation (optional)
├── MQTTTracker/
│ ├── MQTTTracker.php
│ ├── config.json
│ └── README.md
└── test/
├── test.php
├── config.json
└── README.md
```
### Plugin Development
- **API access** via `CMSAPI` class - gives access to CMS configuration, templates, menu
- **Sidebar content** with `getSidebarContent()` - returns HTML for sidebar
- **Metadata access** from YAML frontmatter via `CMSAPI`
- **Configuration** via `config.json` - editable through admin panel
- **viewable** field in config.json determines if plugin is visible in sidebar
- **Per-page visibility** - via the editor plugin selector per page
### Plugin Boilerplate
```php
<?php
class MyPlugin
{
private ?CMSAPI $api = null;
private array $config;
public function __construct()
{
$this->config = [
'viewable' => true,
];
}
public function setAPI(CMSAPI $api): void
{
$this->api = $api;
}
public function getSidebarContent(): string
{
return '';
}
public function getConfig(): array
{
return $this->config;
}
public function setConfig(array $config): void
{
$this->config = array_merge($this->config, $config);
}
}
```
### Available Plugins
- **HTMLBlock** - Custom HTML blocks in sidebar
- **MQTTTracker** - Real-time analytics and tracking via MQTT
- **test** - Example/test plugin
### Known Issue: MQTTTracker Credentials
The MQTTTracker plugin stores `broker_host`, `broker_port`, `client_id`, `username` and `password` in plain text in `plugins/MQTTTracker/config.json`. This is a known open security issue - in a production environment it is recommended to externalize these credentials to environment variables or a separate credential manager.
## Analytics & Tracking
### MQTT Tracker
- Real-time page tracking
- Real-time page tracking via MQTT broker
- Session management
- Business Intelligence data
- Privacy aware (GDPR compliant)
- MQTT integration for dashboards
- Optional: visitor tracking, page views, performance metrics, user flows
### Data Format
## Frequently Asked Questions
\`\`\`json
{
"timestamp": "2025-11-26T15:30:00+00:00",
"session_id": "cms_1234567890abcdef",
"page_url": "?page=demo/sidebar-content&lang=en",
"page_title": "Sidebar-Content Layout",
"language": "en",
"layout": "sidebar-content"
}
\`\`\`
### How do I set the homepage?
## Tips and Tricks
1. **Automatic**: Set `"default_page": "index"` in `config.json` (or omit the field)
2. **Manual**: Set `"default_page": "page-name"` in `config.json`
### Page Organization
### How does navigation work?
- Use subdirectories for categories
- Give each directory an `index.md` for an overview page
- Keep file names short and descriptive
- Use language prefixes: `en.page.md` and `nl.page.md`
- **Directories** become dropdown menus
- **Files** become direct links
- **Sub-directories** become nested dropdowns
- Only files without a language prefix show in the menu
### Content Optimization
### How do I add new content?
- Use clear headings (H1, H2, H3)
- Add descriptive meta information
- Use internal links for better navigation
1. Via the admin panel: `admin.php?route=content-new`
2. Or upload files to the `content/` directory
3. Organize in logical directories
4. Use correct filenames and extensions
### How do I move a file or directory?
1. Go to `admin.php?route=content`
2. Click "Move" next to the item
3. Select the target directory
4. Confirm the move
### How do I create a new theme?
1. Go to `admin.php?route=theme`
2. Enter a name and click "Create"
3. Adjust colors, heights and background
4. Activate the theme
## Troubleshooting
### Common Issues
### Page not found (404)
- **Empty pages**: Check file permissions
- **Template errors**: Verify template syntax
- **404 errors**: Check file names and paths
- **Navigation not updated**: Reload the page
1. Check filename and path
2. Check file extension (.md, .php, .html)
3. Check file permissions
4. Check if the file has the correct language prefix (`nl.` or `en.`)
### Navigation not updated
1. Reload the page
2. Check content directory structure
3. Check filenames (no spaces)
4. Files with language prefix only show in the correct language mode
### Admin panel not accessible
1. Check if the session is still valid
2. On lockout: wait 15 minutes or clear lockout data in `admin/config/admin.json`
3. Check CSRF token (reload the page)
## Security
- **CSRF protection** via tokens on all admin forms
- **Brute-force lockout** after 5 failed attempts (15 minute block)
- **Bcrypt password hashing** for user passwords
- **Path traversal prevention** via `realpath()` and prefix check
- **Direct content access** blocked (403 Forbidden)
- **Security headers** for all pages
- **PHP execution** in content directory blocked
- **File upload restrictions** on allowed extensions
## Version
Current version: **1.5.0** (codename: "Enhanced")
Release date: 2025-11-26
## Support
### More Information
For technical support:
- **Git**: https://git.noorlander.info/E.Noorlander/CodePress
- **Website**: https://noorlander.info
- **Issues**: Report problems via Git issues
- Documentation: [CodePress Git](https://git.noorlander.info/E.Noorlander/CodePress)
- Issues and feature requests: [Git Issues](https://git.noorlander.info/E.Noorlander/CodePress/issues)
## License
---
*This guide is part of CodePress CMS and is automatically displayed when no content is available.*
CodePress CMS is open-source software under dual-license: AGPL v3 for open-source use, commercial license for proprietary use.

View File

@@ -2,60 +2,66 @@
## Overzicht
CodePress CMS is een lichtgewicht, file-based content management systeem gebouwd met PHP. Werkt zonder database.
CodePress CMS is een lichtgewicht, file-based content management systeem gebouwd met PHP (>=8.0). Werkt zonder database.
## Functies
### 🏠 Navigatie
- Tab-style navigatie met Bootstrap styling
### Navigatie
- Tab-style navigatie met Bootstrap 5 styling
- Dropdown menus voor mappen en sub-mappen
- Home knop met icoon
- Automatische menu generatie
- Automatische menu generatie op basis van directory structuur
- Responsive design
- Breadcrumb navigatie met sidebar toggle
- Active state marking
- **Sidebar toggle** - Knop links van HOME in de breadcrumb om de sidebar te openen/sluiten. Het icoon wisselt tussen open en gesloten status. De keuze blijft behouden tijdens de sessie
### 📄 Content Types
- **Markdown (.md)** - CommonMark ondersteuning
### Content Types
- **Markdown (.md)** - CommonMark ondersteuning via `league/commonmark`
- **PHP (.php)** - Dynamische content
- **HTML (.html)** - Statische HTML pagina's
- **Directory listings** - Automatische directory overzichten
- **Language-specific content** - `nl.` en `en.` prefix
### 🔍 Zoekfunctionaliteit
### Zoekfunctionaliteit
- Volledige tekst zoek door alle content
- Resultaten met snippets en highlighting
- Directe navigatie naar gevonden pagina's
- SEO-vriendelijke zoekresultaten
- Search URL: `?search=zoekterm`
### 🧭 Configuratie
### Configuratie
- **JSON configuratie** in `config.json`
- Dynamische homepage instelling
- Dynamische homepage instelling (`default_page`)
- SEO instellingen (description, keywords)
- Author informatie met links
- Thema configuratie met kleuren
- Thema configuratie via `themes/` directory
- Language settings
- Feature toggles
- Feature toggles (auto_link_pages, search_enabled, breadcrumbs_enabled)
### 🎨 Layout & Design
### Layout & Design
- Flexbox layout voor responsive structuur
- Fixed header met logo en zoekfunctie
- Breadcrumb navigatie
- Fixed footer met file info en links
- Bootstrap 5 styling
- Mustache templates
- Mustache templates (`cms/templates/`)
- Semantic HTML5 structuur
- **Dynamic layouts** met YAML frontmatter
- **Sidebar support** met plugin integratie en toggle functie via breadcrumb
- **Thema ondersteuning** via `themes/` map met theme.json per thema
### 🛡️ Admin Console
### Admin Console
- Ingebouwd admin paneel op `/admin.php`
- **Dashboard** met statistieken en snelle acties
- **Content beheer** - Bestanden browsen, aanmaken, bewerken en verwijderen
- **Dashboard** met statistieken (aantal pagina's, mappen, plugins) en snelle acties
- **Content beheer** - Bestanden browsen, uploaden, aanmaken, bewerken, hernoemen, verplaatsen en verwijderen
- **CodeMirror editor** met toolbar (vet, cursief, kop, link, afbeelding, lijst, media invoegen)
- **Media browser modal** in de editor voor het selecteren van afbeeldingen/bestanden
- **Map beheer** - Mappen aanmaken, hernoemen en verwijderen (alleen lege mappen)
- **Configuratie editor** - `config.json` bewerken met JSON-validatie
- **Plugin overzicht** - Status van alle geinstalleerde plugins
- **Thema beheer** - Thema's aanmaken, activeren, bewerken (kleuren, achtergrond) en verwijderen
- **Plugin beheer** - Overzicht, aanmaken, bewerken, configureren, in-/uitschakelen en verwijderen
- **Media beheer** - Uploaden en verwijderen van mediabestanden in `content/-assets/`
- **Gebruikersbeheer** - Gebruikers toevoegen, verwijderen, wachtwoorden wijzigen
- Session-based authenticatie met bcrypt hashing
- CSRF-bescherming, brute-force lockout (5 pogingen, 15 min)
@@ -65,63 +71,164 @@ CodePress CMS is een lichtgewicht, file-based content management systeem gebouwd
1. Upload bestanden naar webserver
2. Stel permissies in voor webserver
3. Configureer `config.json` indien nodig
4. Toegang tot website via browser
3. Voer `composer install` uit voor CommonMark dependency
4. Configureer `config.json` indien nodig
5. Toegang tot website via browser
6. **PHP ontwikkelserver**: `php -S localhost:8080 -t public` (gebruikt `cms/router.php`)
## Projectstructuur
```
codepress/
├── cms/ # Core CMS engine
│ ├── core/
│ │ ├── class/
│ │ │ ├── CodePressCMS.php # Hoofd CMS class (content, navigatie, search)
│ │ │ ├── Logger.php # Gestructureerd logging systeem
│ │ │ └── SimpleTemplate.php # Mustache-style template engine
│ │ ├── plugin/
│ │ │ ├── PluginManager.php # Plugin lader en beheer
│ │ │ └── CMSAPI.php # API voor plugin developers
│ │ ├── config.php # Configuratie lader (merge met config.json)
│ │ └── index.php # Bootstrap (autoloader, requires)
│ ├── lang/ # Taalbestanden
│ │ ├── nl.php # Nederlandse vertalingen
│ │ └── en.php # Engelse vertalingen
│ ├── logs/ # CMS logs
│ ├── templates/ # Mustache templates
│ │ ├── layout.mustache # Hoofd layout (CSS, structuur)
│ │ ├── assets/ # Header, navigation, footer partials
│ │ ├── markdown_content.mustache
│ │ ├── php_content.mustache
│ │ └── html_content.mustache
│ └── router.php # PHP dev server router
├── admin/ # Admin paneel
│ ├── config/
│ │ ├── app.php # Admin app configuratie (paden, timezone)
│ │ └── admin.json # Gebruikers & security (bcrypt hashes)
│ ├── src/
│ │ └── AdminAuth.php # Authenticatie (sessies, bcrypt, CSRF, lockout)
│ ├── templates/
│ │ ├── login.php # Login pagina
│ │ ├── layout.php # Admin layout met sidebar navigatie
│ │ └── pages/
│ │ ├── dashboard.php # Dashboard met statistieken
│ │ ├── content.php # Content overzicht met bestanden uploaden
│ │ ├── content-edit.php # CodeMirror editor met toolbar en rename
│ │ ├── content-new.php # Nieuwe content aanmaken
│ │ ├── content-dir-form.php # Map aanmaken/bewerken
│ │ ├── content-move-form.php # Content verplaatsen
│ │ ├── config.php # Configuratie editor (JSON)
│ │ ├── plugins.php # Plugin overzicht
│ │ ├── plugins-edit.php # Plugin PHP broncode editor
│ │ ├── plugins-new.php # Nieuwe plugin aanmaken
│ │ ├── plugin-config.php # Plugin configuratie editor
│ │ ├── theme.php # Thema beheer (aanmaken, activeren, bewerken)
│ │ ├── media.php # Media beheer (uploaden, verwijderen)
│ │ └── users.php # Gebruikersbeheer
│ └── storage/logs/ # Admin logs
├── cli/ # CLI scripts & tests
├── content/ # Content bestanden
│ ├── -assets/ # Geuploade mediabestanden
│ ├── index.md # Standaard homepage
│ └── ... # Overige content
├── plugins/ # CMS plugins
│ ├── HTMLBlock/ # Custom HTML blokken in sidebar
│ ├── MQTTTracker/ # Real-time analytics en tracking
│ └── test/ # Test plugin
├── public/ # Web root
│ ├── index.php # Website entry point (media serving + CMS)
│ ├── admin.php # Admin entry point + routing
│ ├── .htaccess # Apache rewrite/security rules
│ ├── assets/ # CSS, JS, favicons
│ │ ├── codemirror/ # CodeMirror editor (minified JS/CSS)
│ │ └── css/js/ # Bootstrap, icons, app CSS/JS
│ ├── themes/ # Geuploade theme achtergronden
│ └── manifest.json / sw.js # PWA ondersteuning
├── themes/ # Thema definities
│ ├── default/ # Standaard thema
│ │ └── theme.json # Kleuren, hoogtes, achtergrond
│ └── test/ # Test thema
│ └── theme.json
├── config.json # Site configuratie
├── version.php # Versie informatie (1.5.0)
└── vendor/ # Composer dependencies
```
## Configuratie
### Basis Configuratie (`config.json`)
\`\`\`json
```json
{
"site_title": "CodePress",
"content_dir": "content",
"templates_dir": "engine/templates",
"default_page": "auto",
"templates_dir": "cms\/templates",
"default_page": "index",
"active_theme": "default",
"language": {
"default": "nl",
"available": ["nl", "en"]
},
"theme": {
"header_color": "#0a369d",
"header_font_color": "#ffffff",
"navigation_color": "#2754b4",
"navigation_font_color": "#ffffff",
"sidebar_background": "#f8f9fa",
"sidebar_border": "#dee2e6"
},
"author": {
"name": "E. Noorlander",
"website": "https://noorlander.info"
},
"seo": {
"description": "CodePress CMS - Lightweight file-based content management system",
"keywords": "cms, php, content management, file-based"
},
"author": {
"name": "E. Noorlander",
"website": "https:\/\/noorlander.info"
},
"features": {
"auto_link_pages": true,
"search_enabled": true,
"breadcrumbs_enabled": true
}
}
\`\`\`
```
- `active_theme` - Bepaalt welk thema uit `themes/` actief is
- `templates_dir` - Map met Mustache templates (`cms/templates`)
- `default_page` - Standaard pagina (bijv. `index`)
- `content_dir` - Map met content bestanden (wordt gewoonlijk niet gewijzigd)
### Thema Configuratie (`themes/<naam>/theme.json`)
```json
{
"name": "Standaard",
"header_color": "#0a369d",
"header_font_color": "#ffffff",
"header_height": "56",
"navigation_color": "#2754b4",
"navigation_font_color": "#ffffff",
"nav_height": "42",
"sidebar_background": "#f8f9fa",
"sidebar_border": "#dee2e6",
"background_image": "",
"background_image_opacity": "100"
}
```
Thema's kunnen worden beheerd via het admin paneel: aanmaken, activeren, kleuren aanpassen, achtergrondafbeelding uploaden en verwijderen.
## Content Structuur
### Bestandsstructuur
\`\`\`
```
content/
├── map1/
│ ├── submap1/
│ │ ├── pagina1.md
│ │ └── pagina2.php
│ │ ├── nl.pagina1.md
│ │ └── en.pagina1.md
│ └── pagina3.html
├── map2/
│ └── pagina4.md
├── homepage.md
└── index.html
\`\`\`
├── index.md
└── -assets/
├── afbeelding.jpg
└── document.pdf
```
### Bestandsnamen
@@ -131,6 +238,62 @@ content/
- Unieke namen - geen duplicaten
- Language prefixes - `nl.bestand.md` en `en.bestand.md`
### Media Bestanden
Media bestanden (afbeeldingen, PDFs, video, audio) kunnen in elke `content/` subdirectory worden geplaatst en worden geserveerd via:
- **`/-media/pad/bestand.jpg`** - Media uit elke content subdirectory
- **`/-assets/bestand.jpg`** - Backward compatibility (oude URLs)
- Uploads via het admin paneel gaan naar `content/-assets/`
## Admin Console
### Toegang
- **URL**: `/admin.php`
- **Standaard login**: `admin` / `admin`
### Routes
| Route | Beschrijving |
|---|---|
| `login` | Inlogpagina |
| `logout` | Uitloggen |
| `dashboard` | Dashboard met statistieken |
| `content` | Content overzicht (browsen, uploaden) |
| `content-edit` | Content bewerken (CodeMirror editor) |
| `content-new` | Nieuwe content aanmaken |
| `content-delete` | Content verwijderen |
| `content-move` | Content verplaatsen naar andere map |
| `content-dir-form` | Map aanmaken of bewerken |
| `content-dir-rename` | Map hernoemen |
| `content-dir-create` | Map aanmaken (POST) |
| `content-dir-delete` | Map verwijderen (alleen leeg) |
| `config` | Configuratie editor (`config.json`) |
| `theme` | Thema beheer |
| `plugins` | Plugin overzicht |
| `plugins-new` | Nieuwe plugin aanmaken |
| `plugins-edit` | Plugin PHP broncode bewerken |
| `plugins-config` | Plugin configuratie bewerken |
| `plugins-toggle` | Plugin in-/uitschakelen |
| `plugins-delete` | Plugin verwijderen |
| `media` | Media beheer (uploaden, verwijderen) |
| `media-list` | JSON lijst van alle media (voor editor modal) |
| `users` | Gebruikersbeheer |
### Editor Functionaliteit
De content editor (`content-edit`, `content-new`) bevat:
- **CodeMirror** syntax highlighting voor Markdown/PHP/HTML
- **Toolbar** met knoppen voor: vet, cursief, kop, link, afbeelding, lijst, media invoegen
- **Media browser modal** - Open via de "Media" knop om afbeeldingen/bestanden te selecteren
- **Bestandsnaam hernoemen** - Inline filename input met extensie badge
- **Layout selector** - Kies uit beschikbare layouts
- **Plugin per-page zichtbaarheid** - Selecteer welke plugins op deze pagina tonen
- **Upload en "Aanmaken" knoppen** zijn disabled totdat er input is
- **"Annuleren"** knop (i.p.v. "Terug") bij ongewijzigde wijzigingen
## Templates
### Template Variabelen
@@ -152,78 +315,34 @@ content/
- `breadcrumb` - Breadcrumb navigatie
- `homepage` - Homepage link
#### Theme
#### Theme (uit theme.json)
- `header_color` - Header achtergrondkleur
- `header_font_color` - Header tekstkleur
- `header_height` - Header hoogte in pixels
- `navigation_color` - Navigatie achtergrondkleur
- `navigation_font_color` - Navigatie tekstkleur
- `nav_height` - Navigatie hoogte in pixels
- `sidebar_background` - Sidebar achtergrondkleur
- `sidebar_border` - Sidebar randkleur
- `background_image_css` - CSS voor achtergrondafbeelding
- `background_image_opacity` - Dekking van de overlay
#### Language
- `current_lang` - Huidige taal (nl/en)
- `current_lang_upper` - Huidige taal (NL/EN)
- `t_*` - Vertaalde strings
## URL Structuur
### Basis URLs
- **Home**: `/` of `?page=home`
- **Pagina**: `?page=map/pagina`
- **Zoeken**: `?search=zoekterm`
- **Handleiding**: `?guide`
- **Language**: `?lang=nl` of `?lang=en`
## SEO Optimalisatie
### Meta Tags
De CMS voegt automatisch meta tags toe:
\`\`\`html
<meta name="generator" content="CodePress CMS">
<meta name="author" content="E. Noorlander">
<meta name="description" content="...">
<meta name="keywords" content="...">
\`\`\`
## 🔌 Plugin Systeem
### Plugin Structuur
\`\`\`
plugins/
├── README.md
├── HTMLBlock/
│ ├── HTMLBlock.php
│ └── README.md
└── MQTTTracker/
├── MQTTTracker.php
├── config.json
└── README.md
\`\`\`
### Plugin Development
- **API toegang** via `CMSAPI` class
- **Sidebar content** met `getSidebarContent()`
- **Metadata toegang** uit YAML frontmatter
- **Configuratie** via JSON bestanden
### Beschikbare Plugins
- **HTMLBlock** - Custom HTML blokken in sidebar
- **MQTTTracker** - Real-time analytics en tracking
## 🎯 Template Systeem
### Layout Opties
Gebruik YAML frontmatter om layout te selecteren:
\`\`\`yaml
```yaml
---
title: Mijn Pagina
layout: sidebar-content
plugins: HTMLBlock
---
\`\`\`
```
### Beschikbare Layouts
@@ -235,31 +354,152 @@ layout: sidebar-content
### Meta Data
\`\`\`yaml
```yaml
---
title: Pagina Titel
layout: content-sidebar
description: Pagina beschrijving
author: Auteur Naam
date: 2025-11-26
plugins: HTMLBlock, MQTTTracker
---
\`\`\`
```
## 📊 Analytics & Tracking
## URL Structuur
### Frontend Pagina URLs
- **Home**: `/` of `?page=index&lang=nl`
- **Pagina**: `?page=map/pagina&lang=nl`
- **Zoeken**: `?search=zoekterm`
- **Handleiding**: `?guide`
- **Taal wisselen**: `?lang=nl` of `?lang=en`
### Media URLs
- **Media**: `/-media/pad/naar/bestand.jpg` (uit elke content subdirectory)
- **Assets**: `/-assets/bestand.jpg` (uit content/-assets/, backward compatible)
### Admin URLs
- **Admin**: `admin.php?route=dashboard`
- **Content bewerken**: `admin.php?route=content-edit&file=pagina.md`
- **Content nieuw**: `admin.php?route=content-new&dir=map`
- **Thema bewerken**: `admin.php?route=theme&edit=themanaam`
## SEO Optimalisatie
### Meta Tags
De CMS voegt automatisch meta tags toe:
```html
<meta name="generator" content="CodePress CMS">
<meta name="author" content="E. Noorlander">
<meta name="description" content="...">
<meta name="keywords" content="...">
```
### Security Headers
```http
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
Referrer-Policy: strict-origin-when-cross-origin
Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline'; ...
```
## Plugin Systeem
### Plugin Structuur
```
plugins/
├── HTMLBlock/
│ ├── HTMLBlock.php # Plugin class (verplicht)
│ ├── config.json # Configuratie (optioneel)
│ └── README.md # Documentatie (optioneel)
├── MQTTTracker/
│ ├── MQTTTracker.php
│ ├── config.json
│ └── README.md
└── test/
├── test.php
├── config.json
└── README.md
```
### Plugin Ontwikkeling
- **API toegang** via `CMSAPI` class - geeft toegang tot CMS configuratie, templates, menu
- **Sidebar content** met `getSidebarContent()` - retourneert HTML voor sidebar
- **Metadata toegang** uit YAML frontmatter via `CMSAPI`
- **Configuratie** via `config.json` - bewerkbaar via admin paneel
- **viewable** veld in config.json bepaalt of plugin zichtbaar is in sidebar
- **Per-page zichtbaarheid** - via de editor plugin selector per pagina
### Plugin Boilerplate
```php
<?php
class MijnPlugin
{
private ?CMSAPI $api = null;
private array $config;
public function __construct()
{
$this->config = [
'viewable' => true,
];
}
public function setAPI(CMSAPI $api): void
{
$this->api = $api;
}
public function getSidebarContent(): string
{
return '';
}
public function getConfig(): array
{
return $this->config;
}
public function setConfig(array $config): void
{
$this->config = array_merge($this->config, $config);
}
}
```
### Beschikbare Plugins
- **HTMLBlock** - Custom HTML blokken in sidebar
- **MQTTTracker** - Real-time analytics en tracking via MQTT
- **test** - Voorbeeld/test plugin
### Bekende Issue: MQTTTracker Credentials
De MQTTTracker plugin slaat `broker_host`, `broker_port`, `client_id`, `username` en `password` op in plain text in `plugins/MQTTTracker/config.json`. Dit is een bekend openstaand security punt - bij een productieomgeving wordt aangeraden deze gegevens te externaliseren naar omgevingsvariabelen of een aparte credentials manager.
## Analytics & Tracking
### MQTT Tracker
- Real-time page tracking
- Real-time page tracking via MQTT broker
- Session management
- Business Intelligence data
- Privacy aware (GDPR compliant)
- MQTT integration voor dashboards
- Optioneel: visitor tracking, page views, performance metrics, user flows
## Veelgestelde Vragen
### Hoe stel ik de homepage in?
1. **Automatisch**: Laat de CMS het eerste bestand kiezen
1. **Automatisch**: Zet `"default_page": "index"` in `config.json` (of verwijder het veld)
2. **Handmatig**: Stel `"default_page": "pagina-naam"` in `config.json`
### Hoe werkt de navigatie?
@@ -267,12 +507,28 @@ date: 2025-11-26
- **Mappen** worden dropdown menus
- **Bestanden** worden directe links
- **Sub-mappen** worden geneste dropdowns
- Alleen bestanden zonder taalprefix tonen in het menu
### Hoe voeg ik nieuwe content toe?
1. Upload bestanden naar de `content/` map
2. Organiseer in logische mappen
3. Gebruik juiste bestandsnamen en extensies
1. Via het admin paneel: `admin.php?route=content-new`
2. Of upload bestanden naar de `content/` map
3. Organiseer in logische mappen
4. Gebruik juiste bestandsnamen en extensies
### Hoe verplaats ik een bestand of map?
1. Ga naar `admin.php?route=content`
2. Klik op "Verplaatsen" naast het item
3. Selecteer de doelmap
4. Bevestig de verplaatsing
### Hoe maak ik een nieuw thema?
1. Ga naar `admin.php?route=theme`
2. Voer een naam in en klik "Aanmaken"
3. Pas kleuren, hoogtes en achtergrond aan
4. Activeer het thema
## Troubleshooting
@@ -281,20 +537,44 @@ date: 2025-11-26
1. Controleer bestandsnaam en pad
2. Controleer bestandsextensie (.md, .php, .html)
3. Controleer permissies van bestanden
4. Controleer of het bestand de juiste taalprefix heeft (`nl.` of `en.`)
### Navigatie niet bijgewerkt
1. Herlaad de pagina
2. Controleer content map structuur
3. Controleer bestandsnamen (geen spaties)
4. Bestanden met taalprefix worden alleen getoond in de juiste taalmodus
### Admin paneel niet toegankelijk
1. Controleer of de sessie nog geldig is
2. Bij lockout: wacht 15 minuten of wis `admin/config/admin.json` lockout data
3. Controleer CSRF token (herlaad de pagina)
## Beveiliging
- **CSRF-bescherming** via tokens op alle admin formulieren
- **Brute-force lockout** na 5 mislukte pogingen (15 minuten blokkade)
- **Bcrypt password hashing** voor gebruikerswachtwoorden
- **Path traversal preventie** via `realpath()` en prefix-controle
- **Directe content toegang** geblokkeerd (403 Forbidden)
- **Security headers** voor alle pagina's
- **PHP uitvoering** in content directory geblokkeerd
- **Bestandsupload restricties** op toegestane extensies
## Versie
Huidige versie: **1.5.0** (codenaam: "Enhanced")
Releasedatum: 2025-11-26
## Ondersteuning
Voor technische ondersteuning:
- **Git**: https://git.noorlander.info/E.Noorlander/CodePress
- **Website**: https://noorlander.info
- **Issues**: Rapporteer problemen via [Git issues](https://git.noorlander.info/E.Noorlander/CodePress/issues)
- **Issues**: Rapporteer problemen via Git issues
## Licentie
CodePress CMS is open-source software.
CodePress CMS is open-source software onder dual-license: AGPL v3 voor open-source gebruik, commerciële licentie voor proprietary gebruik.