176 lines
7.1 KiB
Markdown
176 lines
7.1 KiB
Markdown
# Markdown Parser WP - Dokumentation der Aktualisierungen
|
|
|
|
## Übersicht der Verbesserungen
|
|
|
|
Diese Aktualisierung des Markdown Parser WP Plugins enthält folgende Verbesserungen:
|
|
|
|
1. **Korrekte Behandlung relativer Bildpfade im Fließtext**
|
|
2. **Import von Bildern aus dem Fließtext in die WordPress-Mediathek**
|
|
3. **Konfigurierbare Feldzuordnung zwischen YAML/JSON und WordPress-Feldern**
|
|
|
|
## 1. Relative Bildpfade im Fließtext
|
|
|
|
### Problem
|
|
Bilder im Fließtext mit relativen Pfaden (z.B. ``) wurden nicht korrekt aufgelöst und importiert.
|
|
|
|
### Lösung
|
|
Das Plugin löst jetzt relative Bildpfade korrekt auf, indem es den Pfad der Markdown-Datei als Basis verwendet. Beispiel:
|
|
|
|
- Markdown-URL: `https://example.com/posts/artikel/index.md`
|
|
- Relatives Bild im Text: ``
|
|
- Aufgelöster Bildpfad: `https://example.com/posts/artikel/bild.jpg`
|
|
|
|
### Implementierung
|
|
Die `BlocksConverter`-Klasse wurde aktualisiert, um relative Pfade zu erkennen und aufzulösen:
|
|
|
|
```php
|
|
private static function process_images_in_html($html, $original_url = '') {
|
|
// ...
|
|
foreach ($images as $img) {
|
|
$src = $img->getAttribute('src');
|
|
|
|
// Handle relative URLs
|
|
if (!filter_var($src, FILTER_VALIDATE_URL) && !empty($original_url)) {
|
|
// If the src doesn't start with http/https, it's likely a relative path
|
|
if (strpos($src, 'http') !== 0) {
|
|
$base_url = dirname($original_url) . '/';
|
|
$src = $base_url . ltrim($src, '/');
|
|
}
|
|
}
|
|
|
|
// Import external image
|
|
$attachment_id = PostCreator::import_external_image($src);
|
|
// ...
|
|
}
|
|
// ...
|
|
}
|
|
```
|
|
|
|
## 2. Import von Bildern aus dem Fließtext
|
|
|
|
### Problem
|
|
Bilder im Fließtext wurden nicht in die WordPress-Mediathek importiert und als Gutenberg-Blöcke mit korrekten Attachment-IDs dargestellt.
|
|
|
|
### Lösung
|
|
Das Plugin importiert jetzt alle Bilder aus dem Fließtext in die WordPress-Mediathek und erstellt korrekte Gutenberg-Bild-Blöcke mit den entsprechenden Attachment-IDs.
|
|
|
|
### Implementierung
|
|
Die `BlocksConverter`-Klasse wurde verbessert, um Bilder zu importieren und korrekte Gutenberg-Blöcke zu erstellen:
|
|
|
|
```php
|
|
private static function create_image_block($src, $alt = '', $attachment_id = '') {
|
|
$block_attrs = [
|
|
'url' => $src,
|
|
'alt' => $alt
|
|
];
|
|
|
|
if ($attachment_id) {
|
|
$block_attrs['id'] = (int) $attachment_id;
|
|
|
|
// Get image dimensions if available
|
|
$image_meta = wp_get_attachment_metadata($attachment_id);
|
|
if ($image_meta && isset($image_meta['width']) && isset($image_meta['height'])) {
|
|
$block_attrs['width'] = $image_meta['width'];
|
|
$block_attrs['height'] = $image_meta['height'];
|
|
$block_attrs['sizeSlug'] = 'full';
|
|
}
|
|
|
|
// Get caption if available
|
|
$attachment = get_post($attachment_id);
|
|
if ($attachment && !empty($attachment->post_excerpt)) {
|
|
$block_attrs['caption'] = $attachment->post_excerpt;
|
|
}
|
|
}
|
|
|
|
// Create the image block with proper figure and figcaption if needed
|
|
$figure_html = '<figure class="wp-block-image';
|
|
|
|
// Add size class if available
|
|
if (isset($block_attrs['sizeSlug'])) {
|
|
$figure_html .= ' size-' . $block_attrs['sizeSlug'];
|
|
}
|
|
|
|
$figure_html .= '">';
|
|
|
|
// Add image tag
|
|
$figure_html .= '<img src="' . esc_url($src) . '" alt="' . esc_attr($alt) . '"';
|
|
|
|
// Add width and height if available
|
|
if (isset($block_attrs['width']) && isset($block_attrs['height'])) {
|
|
$figure_html .= ' width="' . esc_attr($block_attrs['width']) . '"';
|
|
$figure_html .= ' height="' . esc_attr($block_attrs['height']) . '"';
|
|
}
|
|
|
|
// Add class and close img tag
|
|
$figure_html .= ' class="wp-image-' . esc_attr($attachment_id) . '"/>';
|
|
|
|
// Add caption if available
|
|
if (isset($block_attrs['caption'])) {
|
|
$figure_html .= '<figcaption>' . esc_html($block_attrs['caption']) . '</figcaption>';
|
|
}
|
|
|
|
$figure_html .= '</figure>';
|
|
|
|
return '<!-- wp:image ' . json_encode($block_attrs) . ' -->' .
|
|
$figure_html .
|
|
'<!-- /wp:image -->';
|
|
}
|
|
```
|
|
|
|
## 3. Konfigurierbare Feldzuordnung
|
|
|
|
### Problem
|
|
Die Zuordnung zwischen YAML/JSON-Feldern und WordPress-Feldern war fest codiert und konnte nicht angepasst werden.
|
|
|
|
### Lösung
|
|
Das Plugin bietet jetzt eine benutzerfreundliche Oberfläche, mit der Sie die Zuordnung zwischen YAML/JSON-Feldern und WordPress-Feldern konfigurieren können. Sie können sehen, welche Felder in der Markdown-Datei verfügbar sind und wie sie auf WordPress-Felder abgebildet werden.
|
|
|
|
### Implementierung
|
|
Eine neue Benutzeroberfläche wurde hinzugefügt, die Folgendes ermöglicht:
|
|
|
|
- Anzeige aller verfügbaren YAML/JSON-Felder
|
|
- Konfiguration der Zuordnung zu WordPress-Feldern
|
|
- Vorschau der Feldwerte vor dem Import
|
|
- Hinzufügen und Entfernen von Feldzuordnungen
|
|
|
|
## Verwendung der neuen Funktionen
|
|
|
|
### Relative Bildpfade und Bildimport
|
|
|
|
Die Funktionen für relative Bildpfade und Bildimport sind automatisch aktiviert. Sie können den Bildimport über die Option "Bilder importieren" in der Benutzeroberfläche aktivieren oder deaktivieren.
|
|
|
|
### Konfigurierbare Feldzuordnung
|
|
|
|
1. Gehen Sie zu "Markdown Parser" im WordPress-Admin-Menü
|
|
2. Geben Sie die URL zu einer Markdown-Datei ein und klicken Sie auf "Markdown parsen"
|
|
3. Scrollen Sie zum Abschnitt "Feldzuordnung"
|
|
4. Hier sehen Sie die Standard-Feldzuordnungen:
|
|
- WordPress-Feld "Titel" → YAML-Feld "title" oder "name"
|
|
- WordPress-Feld "Auszug" → YAML-Feld "summary" oder "description"
|
|
- WordPress-Feld "Datum" → YAML-Feld "datePublished"
|
|
- WordPress-Feld "Slug" → YAML-Feld "url"
|
|
- WordPress-Feld "Schlagwörter" → YAML-Feld "keywords"
|
|
5. Sie können diese Zuordnungen ändern, indem Sie andere YAML-Felder aus den Dropdown-Menüs auswählen
|
|
6. Sie können weitere Feldzuordnungen hinzufügen, indem Sie auf "Weitere Feldzuordnung hinzufügen" klicken
|
|
7. Für jede Feldzuordnung wird eine Vorschau des Wertes angezeigt
|
|
8. Wenn Sie mit den Zuordnungen zufrieden sind, klicken Sie auf "Beitrag erstellen"
|
|
|
|
## Technische Details
|
|
|
|
### Dateistruktur
|
|
|
|
- `src/BlocksConverter.php`: Enthält die Logik für die Konvertierung von Markdown zu Gutenberg-Blöcken und die Behandlung relativer Bildpfade
|
|
- `src/PostCreator.php`: Enthält die Logik für die Erstellung von WordPress-Beiträgen aus Markdown-Daten
|
|
- `src/Admin.php`: Enthält die Benutzeroberfläche und AJAX-Handler für die Feldzuordnung
|
|
- `assets/js/admin.js`: Enthält den JavaScript-Code für die dynamische Feldzuordnungs-UI
|
|
- `assets/css/admin.css`: Enthält die Styles für die Feldzuordnungs-UI
|
|
|
|
### Hooks und Filter
|
|
|
|
Das Plugin bietet folgende Hooks und Filter für Entwickler:
|
|
|
|
- `markdown_parser_wp_field_mapping`: Filter zum Anpassen der Standard-Feldzuordnungen
|
|
- `markdown_parser_wp_before_import_image`: Action vor dem Import eines Bildes
|
|
- `markdown_parser_wp_after_import_image`: Action nach dem Import eines Bildes
|
|
- `markdown_parser_wp_blocks_converter_options`: Filter zum Anpassen der Optionen für die Konvertierung von Markdown zu Blocks
|