CodePress/guide/en/admin-beheerder/content-beheer.md

Content management

CodePress offers two views for content management:

1. Tree view (/admin/content) — default, file browser sidebar + CodeMirror editor (uniform with plugin/theme editors)
2. List view (/admin/content-list) — classic table with filter, upload, new folder/file per folder

Both work side-by-side and use the same content directory. Switch between views via the "List view"/"Tree view" buttons at the top right. The tree view offers the same functionality as the list view, but with a nested file-tree sidebar like the plugin and theme editors — for a consistent editor experience.

Tree view (content)

File browser sidebar

• Shows the nested file tree of content/
• Hidden directories (.bak, .git) and dotfiles are skipped
• Click a file to open it in the CodeMirror editor
• Folders containing the active file are auto-expanded
• Per folder there are action buttons: new file, new folder, rename, delete

Editable file types

.md (Markdown), .php (PHP), .html (HTML) — consistent with the existing content-edit page.

Set image size (Markdown)

The markdown editor toolbar has an "Image size" button (expand icon):

1. Select an image in the editor in markdown format ![alt](url)
2. Click the "Image size" button
3. Enter width and/or height (px or %, empty = don't set)
4. The {:width=... height=...} syntax is added to or replaced on the image

Example:

![logo](/content/_images/logo.png){:width="200" height="100"}

Existing {:width=...} values are shown in the prompts. The size attributes are rendered as width/height HTML attributes on the <img> tag in the frontend.

Images in content

Images in content/ are served via the /-media/ endpoint (content/ lives outside the webroot). Markdown syntax ![alt](url) with local URLs (relative like image.jpg, or absolute like /content/_images/image.jpg) is automatically rewritten to /-media/.... External URLs (https://...) are left untouched.

Create a new file

• Click New file (at the top or per folder in the sidebar)
• Enter a path within content (e.g. en.page or blog/en.post)
• Choose the file type (Markdown/PHP/HTML)
• Subfolders are created automatically
• Frontmatter with layout, author_name, author_email, created is auto-generated

Upload a file

• Click Upload to upload files to content/
• Allowed: images, video, audio, PDF, ZIP, office docs, CSS, SCSS, JS, JSON, HTML, MD
• Path-traversal protection: target dir must stay within content/

Move / delete a file

• In the file tree each file has a move button (arrows icon) and a delete button (trash)
• Move: choose a target folder from the dropdown listing all folders in content
• Delete: with confirmation

Folder management

• New folder: per folder in the sidebar or at the top
• Rename folder: pencil icon per folder
• Delete folder: trash icon per folder (only empty folders)

Layout selection

On the editor page you can choose the layout from the layouts defined in theme.json (template mapping). The selected layout is stored in the frontmatter layout: key.

Plugins on pages

• Content plugins (from plugin.json with type: "content") appear in the plugin selection
• Choose which plugins run on the page
• The plugin selection is stored in the frontmatter plugins: key

Git / Backup integration (Phase 5)

At the top of the content editor there are backup and git actions:

• Git init: initializes a git repository in content/ (if none exists yet)
• Commit: commits all uncommitted changes (only if there is a git repo and there are changes)
• Backup: link to the backup page (/admin/content-backup) for ZIP backup/restore
• The git status badge shows the current branch, whether there are uncommitted changes, and the last commit

Frontmatter

The editor updates the frontmatter live when layout or plugin selection changes:

---
layout: left_sidebar
author_name: Admin
author_email: admin@example.com
created: 2026-08-19 10:30:25
plugins: HTMLBlock, Navigation
---

# Page title

Content...

List view (content)

Managing files

• New folder — Create folder structure
• New file — Create a page (.md, .php, .html)
• Edit — Modify existing content in the CodeMirror editor
• Rename — Change file or folder names
• Move — Move content to another folder
• Delete — Remove content
• Rename folder — Change a folder name

Editor (content-edit)

• CodeMirror with syntax highlighting (Markdown, PHP, HTML)
• Toolbar for quickly inserting Markdown
• Shortcuts: Ctrl+S (save), Ctrl+N (new)

Frontmatter

The editor updates the frontmatter live when layout or plugin selection changes:

---
layout: left_sidebar
plugins:
  - HTMLBlock
  - Navigation
---

# Page title

Content...