Fix auto-linking order and add dash-dash underline styling

- Moved auto-linking before markdown link processing to avoid conflicts
- Added dash-dash (dashed) underline for auto-links instead of dotted
- Improved pattern matching to avoid linking inside existing markdown links
- Enhanced detection of existing HTML tags and links
- Auto-links now have 2px dashed underline with hover effect
This commit is contained in:
Edwin Noorlander 2025-11-19 14:29:00 +01:00
parent b0483f5882
commit 0f7e4ccc07
2 changed files with 26 additions and 10 deletions

View File

@ -212,6 +212,9 @@ class CodePressCMS {
$body = preg_replace('/\*\*(.+?)\*\*/', '<strong>$1</strong>', $body); $body = preg_replace('/\*\*(.+?)\*\*/', '<strong>$1</strong>', $body);
$body = preg_replace('/\*(.+?)\*/', '<em>$1</em>', $body); $body = preg_replace('/\*(.+?)\*/', '<em>$1</em>', $body);
// Auto-link page titles to existing content pages (before markdown link processing)
$body = $this->autoLinkPageTitles($body);
// Convert Markdown links to HTML links // Convert Markdown links to HTML links
$body = preg_replace('/\[([^\]]+)\]\(([^)]+)\)/', '<a href="$2">$1</a>', $body); $body = preg_replace('/\[([^\]]+)\]\(([^)]+)\)/', '<a href="$2">$1</a>', $body);
@ -219,9 +222,6 @@ class CodePressCMS {
$body = preg_replace('/href="\/blog\/([^"]+)"/', 'href="?page=blog/$1"', $body); $body = preg_replace('/href="\/blog\/([^"]+)"/', 'href="?page=blog/$1"', $body);
$body = preg_replace('/href="\/([^"]+)"/', 'href="?page=$1"', $body); $body = preg_replace('/href="\/([^"]+)"/', 'href="?page=$1"', $body);
// Auto-link page titles to existing content pages
$body = $this->autoLinkPageTitles($body);
$body = preg_replace('/\n\n/', '</p><p>', $body); $body = preg_replace('/\n\n/', '</p><p>', $body);
$body = '<p>' . $body . '</p>'; $body = '<p>' . $body . '</p>';
$body = preg_replace('/<p><\/p>/', '', $body); $body = preg_replace('/<p><\/p>/', '', $body);
@ -234,22 +234,36 @@ class CodePressCMS {
]; ];
} }
private function autoLinkPageTitles($content) { private function autoLinkPageTitles($content) {
// Get all available pages with their titles // Get all available pages with their titles
$pages = $this->getAllPageTitles(); $pages = $this->getAllPageTitles();
foreach ($pages as $pagePath => $pageTitle) { foreach ($pages as $pagePath => $pageTitle) {
// Create a pattern that matches the exact page title (case-insensitive) // Create a pattern that matches the exact page title (case-insensitive)
// Use word boundaries to avoid partial matches
$pattern = '/\b' . preg_quote($pageTitle, '/') . '\b/i'; $pattern = '/\b' . preg_quote($pageTitle, '/') . '\b/i';
// Replace with link, but avoid linking inside existing links or headings // Replace with link, but avoid linking inside existing links, headings, or markdown
$replacement = function($matches) use ($pageTitle, $pagePath) { $replacement = function($matches) use ($pageTitle, $pagePath) {
// Check if we're inside an HTML tag or link $text = $matches[0];
$before = substr($matches[0], 0, 50);
if (preg_match('/<[^>]*$/', $before) || preg_match('/href=/', $before)) { // Check if we're inside an existing link or markdown syntax
return $matches[0]; // Don't link inside HTML tags if (preg_match('/\[.*?\]\(.*?\)/', $text) ||
preg_match('/\[.*?\]:/', $text) ||
preg_match('/<a[^>]*>/', $text) ||
preg_match('/href=/', $text)) {
return $text; // Don't link existing links
} }
return '<a href="?page=' . $pagePath . '" class="auto-link" title="Ga naar ' . htmlspecialchars($pageTitle) . '">' . $text . '</a>';
};
$content = preg_replace_callback($pattern, $replacement, $content);
}
return $content;
}
return '<a href="?page=' . $pagePath . '" class="auto-link" title="Ga naar ' . htmlspecialchars($pageTitle) . '">' . $matches[0] . '</a>'; return '<a href="?page=' . $pagePath . '" class="auto-link" title="Ga naar ' . htmlspecialchars($pageTitle) . '">' . $matches[0] . '</a>';
}; };

View File

@ -165,13 +165,15 @@
.auto-link { .auto-link {
color: #0d6efd; color: #0d6efd;
text-decoration: none; text-decoration: none;
border-bottom: 1px dotted #0d6efd; border-bottom: 2px dashed #0d6efd;
font-weight: 500; font-weight: 500;
transition: all 0.2s ease;
} }
.auto-link:hover { .auto-link:hover {
color: #0a58ca; color: #0a58ca;
text-decoration: none; text-decoration: none;
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-color: #0a58ca;
} }
.search-form { .search-form {
max-width: 300px; max-width: 300px;