E.Noorlander
97c4d52c78
- /admin/content is nu de boom-editor (plugin-file-tree structuur),
consistent met plugin- en thema-editors. Oude tabelweergave verhuisd
naar /admin/content-list, bereikbaar via 'Boom weergave'/'Lijst
weergave' knoppen. /admin/content-files redirect naar /admin/content.
- Image-grootte knop in markdown editor-toolbar: selecteer ,
klik knop, breedte/hoogte dialog, {:width=... height=...} syntax
toevoegen/vervangen. Bestaande waarden worden in prompts getoond.
- Custom-grootte syntax {:width=...} nu ook correct herschreven naar
/-media/ endpoint (was alleen gewone  herschreven).
- Handleidingen bijgewerkt (content-beheer.md NL+EN: boom/lijst
weergave uitleg + image-grootte + images in content sectie)
- Release notes v2.6.2 bijgewerkt
- Pentest 30/30, WCAG 25/25
127 lines
4.8 KiB
Markdown
127 lines
4.8 KiB
Markdown
# 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 ``
|
|
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:
|
|
```markdown
|
|
{: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 `` 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:
|
|
|
|
```markdown
|
|
---
|
|
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:
|
|
|
|
```markdown
|
|
---
|
|
layout: left_sidebar
|
|
plugins:
|
|
- HTMLBlock
|
|
- Navigation
|
|
---
|
|
|
|
# Page title
|
|
|
|
Content...
|
|
``` |