The more intended WP way but with a lot of shortcodes, will change to Gutenberg

This commit is contained in:
2026-09-06 00:14:07 +02:00
parent 4d8a7a6924
commit f8ff394db2
12 changed files with 337 additions and 839 deletions
@@ -28,9 +28,9 @@ $hl_biz = hogelandlinux_business();
<p>Vrijwilliger bij <a href="https://laptoprevive.nl" target="_blank">Laptoprevive.nl</a></p>
<p>Ik ondersteun de <a href="https://endof10.org" target="_blank">End-of-10</a>-beweging voor duurzaam computergebruik.</p>
<p>
<?php hogelandlinux_nav_link( 'Over mij', '/over-mij/', 'over-mij' ); ?>
<a href="<?php echo esc_url( home_url( '/over-mij/' ) ); ?>">Over mij</a>
&middot;
<?php hogelandlinux_nav_link( 'Contact', '/contact/', 'contact' ); ?>
<a href="<?php echo esc_url( home_url( '/contact/' ) ); ?>">Contact</a>
</p>
</div>
</div>
@@ -1,246 +0,0 @@
<?php
/**
* Front page (home): mirrors the original index.html.
*/
get_header();
?>
<main>
<section id="home" class="hero">
<div class="hero-content">
<h2>Geef uw computer een tweede leven</h2>
<p class="hero-subtitle">Windows 10-ondersteuning eindigt binnenkort? Ik help u graag overstappen. Ontdek hoe Linux uw hardware nieuw leven kan geven.</p>
<div class="hero-buttons hero-buttons--stack">
<div class="hero-buttons-row hero-buttons-row--secondary">
<a href="<?php echo esc_url( home_url( '/contact/' ) ); ?>" class="btn btn-secondary">Gratis advies</a>
<a href="<?php echo esc_url( home_url( '/over-mij/' ) ); ?>" class="btn btn-secondary">Wie ben ik?</a>
</div>
<div class="hero-buttons-row hero-buttons-row--primary">
<a href="#voordelen" class="btn btn-primary">&darr; Meer weten</a>
</div>
</div>
</div>
</section>
<?php $hl_section_class = 'section--light'; get_template_part( 'template-parts/benefits' ); ?>
<section id="windows10-eol" class="section windows-eol">
<div class="container">
<h2>Windows 10-ondersteuning eindigt</h2>
<div class="eol-content">
<div class="eol-main">
<div class="eol-clippy-image">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/clippy.png' ); ?>" alt="Clippy advising to use Linux">
</div>
<div class="eol-text">
<p>Microsoft stopt de ondersteuning voor Windows 10 in <strong>oktober 2025</strong>. Dit betekent:</p>
<ul>
<li>&#10060; Geen beveiligingsupdates meer</li>
<li>&#10060; Geen technische ondersteuning</li>
<li>&#10060; Uw computer wordt kwetsbaar voor cyberaanvallen</li>
<li>&#10060; Mogelijk niet meer compatibel met nieuwe software</li>
</ul>
<p class="highlight">Maar u hoeft geen nieuwe computer te kopen! Linux biedt een modern, veilig alternatief dat perfect werkt op uw huidige hardware.</p>
</div>
</div>
<div class="eol-stats">
<div class="stat">
<div class="stat-icon">&#128187;</div>
<h3>1+ miljard</h3>
<p>Windows 10 computers wereldwijd</p>
</div>
<div class="stat">
<div class="stat-icon">&#128465;&#65039;</div>
<h3>240 miljoen ton</h3>
<p>Potenti&euml;le e-waste zonder migratie</p>
</div>
<div class="stat">
<div class="stat-icon">&#128274;</div>
<h3>0 updates</h3>
<p>Na oktober 2025</p>
</div>
</div>
</div>
</div>
</section>
<section class="section section--light services">
<div class="container">
<h2><a href="<?php echo esc_url( home_url( '/diensten/' ) ); ?>">Mijn aanpak</a></h2>
<div class="steps-grid" style="margin-top:1.5rem">
<div class="card card--service"><h3>1. Kennismaking (gratis)</h3><p>Korte intake: wensen, hardware en gebruik. Samen kiezen we een route.</p></div>
<div class="card card--service"><h3>2. Proefstart</h3><p>Linux live vanaf USB zodat u ziet hoe het werkt op uw pc.</p></div>
<div class="card card--service"><h3>3. Installatie</h3><p>Veilig, met updates, codecs, printer, Nederlandse taal en basissoftware.</p></div>
<div class="card card--service"><h3>4. Migratie</h3><p>Bestanden, foto&rsquo;s, documenten en favorieten overzetten.</p></div>
<div class="card card--service"><h3>5. Uitleg &amp; nazorg</h3><p>Korte training, daarna laagdrempelig bereikbaar voor vragen.</p></div>
</div>
<p style="margin-top:1rem"><strong>Daarnaast</strong> geef ik gratis informatiebijeenkomsten en help ik soms bij Repair Caf&eacute;s met installaties, zonder kosten.</p>
</div>
</section>
<section id="distros" class="section section--light-green distros">
<div class="container">
<h2><a href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">Welke Linux past bij u?</a></h2>
<p class="section-subtitle">Er zijn veel Linux-distributies, elk met hun eigen voordelen. Ik help u graag de perfecte keuze te maken.</p>
<div class="distros-grid">
<a class="card card--distro card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="distro-header">
<div class="distro-logo">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/mint.svg' ); ?>" alt="Linux Mint" width="48" height="48">
</div>
<div class="distro-header-content">
<h3>Linux Mint</h3>
<span class="distro-tag">Windows-achtig</span>
</div>
</div>
<p class="distro-description">Ziet er vertrouwd uit voor Windows-gebruikers. Stabiel en betrouwbaar.</p>
<div class="distro-features">
<span class="feature">&#10003; Vertrouwde interface</span>
<span class="feature">&#10003; Multimedia ondersteuning</span>
<span class="feature">&#10003; Zeer stabiel</span>
</div>
<p class="distro-ideal">Ideaal voor: <strong>Windows migratie, ouderen, conservatieve gebruikers</strong></p>
</a>
<a class="card card--distro card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="distro-header">
<div class="distro-logo">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/ubuntu.png' ); ?>" alt="Ubuntu" width="48" height="48">
</div>
<div class="distro-header-content">
<h3>Ubuntu</h3>
<span class="distro-tag">Populair</span>
</div>
</div>
<p class="distro-description">Perfect voor beginners die van Windows komen. Gebruiksvriendelijk met veel ondersteuning.</p>
<div class="distro-features">
<span class="feature">&#10003; Eenvoudig</span>
<span class="feature">&#10003; Grote community</span>
<span class="feature">&#10003; LTS versies</span>
</div>
<p class="distro-ideal">Ideaal voor: <strong>Beginners, kantoorwerk, algemeen gebruik</strong></p>
</a>
<a class="card card--distro card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="distro-header">
<div class="distro-logo">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/popos.svg' ); ?>" alt="Pop!_OS" width="48" height="48">
</div>
<div class="distro-header-content">
<h3>Pop!_OS</h3>
<span class="distro-tag">Gaming</span>
</div>
</div>
<p class="distro-description">Gemaakt door System76. Uitstekend voor gaming en creatief werk.</p>
<div class="distro-features">
<span class="feature">&#10003; Gaming-geoptimaliseerd</span>
<span class="feature">&#10003; NVIDIA-ondersteuning</span>
<span class="feature">&#10003; Modern ontwerp</span>
</div>
<p class="distro-ideal">Ideaal voor: <strong>Gamers, ontwikkelaars, jongeren</strong></p>
</a>
<a class="card card--distro card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="distro-header">
<div class="distro-logo">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/elementary.png' ); ?>" alt="elementary" width="48" height="48">
</div>
<div class="distro-header-content">
<h3>Elementary OS</h3>
<span class="distro-tag">Mooi</span>
</div>
</div>
<p class="distro-description">Prachtig ontwerp ge&iuml;nspireerd door macOS. Eenvoudig en elegant.</p>
<div class="distro-features">
<span class="feature">&#10003; Elegant ontwerp</span>
<span class="feature">&#10003; Privacy-gericht</span>
<span class="feature">&#10003; Mac-achtig</span>
</div>
<p class="distro-ideal">Ideaal voor: <strong>Mac gebruikers, designers, stijlbewuste mensen</strong></p>
</a>
<div class="card card--distro">
<div class="distro-header">
<div class="distro-logo">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/fedora.png' ); ?>" alt="Fedora" width="48" height="48">
</div>
<div class="distro-header-content">
<h3>Fedora</h3>
<span class="distro-tag">Geavanceerd</span>
</div>
</div>
<p class="distro-description">Nieuwste technologie&euml;n en functies. Voor technische gebruikers.</p>
<div class="distro-features">
<span class="feature">&#10003; Geavanceerde technologie</span>
<span class="feature">&#10003; Red Hat basis</span>
<span class="feature">&#10003; Ontwikkelaarstools</span>
</div>
<p class="distro-ideal">Ideaal voor: <strong>Ontwikkelaars, IT-professionals, tech-enthousiastelingen</strong></p>
</div>
<div class="card card--distro">
<div class="distro-header">
<div class="distro-logo">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/garuda.svg' ); ?>" alt="Garuda Linux" width="48" height="48">
</div>
<div class="distro-header-content">
<h3>Garuda Linux</h3>
<span class="distro-tag">Prestaties</span>
</div>
</div>
<p class="distro-description">Arch-gebaseerd met extreme prestaties. Prachtig ontwerp en gaming-geoptimaliseerd.</p>
<div class="distro-features">
<span class="feature">&#10003; Arch basis</span>
<span class="feature">&#10003; Gaming-klaar</span>
<span class="feature">&#10003; Mooie interface</span>
</div>
<p class="distro-ideal">Ideaal voor: <strong>Powergebruikers, gamers, prestatie-enthousiasten</strong></p>
</div>
</div>
<div class="distro-cta">
<h3>Weet u niet welke u moet kiezen?</h3>
<p>Geen probleem! Ik adviseer u graag over de beste distributie voor uw specifieke situatie en behoeften.</p>
<a href="<?php echo esc_url( home_url( '/contact/' ) ); ?>" class="btn btn-primary">Persoonlijk advies</a>
</div>
</div>
</section>
<section id="diensten" class="section section--light services">
<div class="container">
<h2><a href="<?php echo esc_url( home_url( '/diensten/' ) ); ?>">Mijn diensten</a></h2>
<div class="services-grid">
<a class="card card--service card-link" href="<?php echo esc_url( home_url( '/diensten/' ) ); ?>">
<h3>Gratis advies</h3>
<p>Ik bekijk uw huidige computer en adviseer over de beste Linux distributie voor uw behoeften.</p>
</a>
<a class="card card--service card-link" href="<?php echo esc_url( home_url( '/diensten/' ) ); ?>">
<h3>Installatieservice</h3>
<p>Professionele Linux-installatie op uw computer, inclusief alle benodigde software.</p>
</a>
<div class="card card--service">
<h3><a href="<?php echo esc_url( home_url( '/diensten/' ) ); ?>">Datamigratie</a></h3>
<p>Veilige overdracht van al uw bestanden, foto&rsquo;s en documenten van Windows naar Linux. Zie de <a href="<?php echo esc_url( home_url( '/diensten/#backup-disclaimer' ) ); ?>">back-updisclaimer</a>.</p>
</div>
<a class="card card--service card-link" href="<?php echo esc_url( home_url( '/diensten/' ) ); ?>">
<h3>Training en ondersteuning</h3>
<p>Persoonlijke begeleiding om u vertrouwd te maken met uw nieuwe Linux-systeem.</p>
</a>
</div>
</div>
</section>
<?php $hl_section_class = 'section--light-green'; get_template_part( 'template-parts/linux-features' ); ?>
<section class="section cta">
<div class="container">
<h2>Klaar voor de overstap?</h2>
<p>Laat uw computer niet eindigen als e-waste. Geef hem een tweede leven met Linux - ik help u graag.</p>
<a href="<?php echo esc_url( home_url( '/contact/' ) ); ?>" class="btn btn-primary btn-large">Neem contact op</a>
</div>
</section>
</main>
<?php
get_footer();
@@ -1,13 +1,17 @@
<?php
/**
* HogelandLinux theme functions and definitions.
*
* A universal classic theme: page content lives in the editor (Gutenberg /
* classic editor), pages show up in the menu automatically, and the original
* site's design system is exposed through shortcodes for easy composition.
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
define( 'HOGELANDLINUX_VERSION', '1.0.0' );
define( 'HOGELANDLINUX_VERSION', '1.0.1' );
define( 'HOGELANDLINUX_URL', get_template_directory_uri() );
define( 'HOGELANDLINUX_PATH', get_template_directory() );
@@ -64,65 +68,314 @@ function hogelandlinux_scripts() {
add_action( 'wp_enqueue_scripts', 'hogelandlinux_scripts' );
/**
* Helper: current page name, used to highlight the active nav item.
*/
function hogelandlinux_current_page() {
if ( is_front_page() ) {
return 'home';
}
$page = get_queried_object();
if ( $page && isset( $page->post_name ) ) {
$name = $page->post_name;
} else {
$name = wp_basename( (string) wp_parse_url( home_url( $GLOBALS['wp']->request ?? '' ), PHP_URL_PATH ) );
}
return $name ? $name : 'home';
}
/**
* Render a nav link with the active class applied.
*/
function hogelandlinux_nav_link( $label, $path, $key ) {
$current = hogelandlinux_current_page();
$class = ( $current === $key ) ? ' class="active"' : '';
printf( '<a href="%s"%s>%s</a>', esc_url( home_url( $path ) ), $class, esc_html( $label ) );
}
/**
* Business info used across the template (matches the original static site).
* Business info used across the site (matches the original static site).
* All values can be overridden on the Settings > General screen.
*/
function hogelandlinux_business() {
return array(
'name' => get_bloginfo( 'name' ),
'kvk' => '91927935',
'email' => 'info@chemistry.software',
'street' => 'Voorstraat 123',
'postal' => '9967 AA',
'village' => 'Eenrum',
'kvk' => get_option( 'hl_kvk', '91927935' ),
'email' => get_option( 'hl_email', get_option( 'admin_email', 'info@chemistry.software' ) ),
'street' => get_option( 'hl_street', 'Voorstraat 123' ),
'postal' => get_option( 'hl_postal', '9967 AA' ),
'village' => get_option( 'hl_village', 'Eenrum' ),
'domain' => wp_parse_url( home_url(), PHP_URL_HOST ),
'about' => 'Bdnugget',
'birth' => '1990-01-01',
'son_birth' => '2022-01-01',
);
}
/**
* Age helper, mirrors the Go site's age calculation.
* Determine which page slug should be considered "active route" for the menu.
*/
function hogelandlinux_age( $birth ) {
$birth = DateTime::createFromFormat( 'Y-m-d', $birth );
if ( ! $birth ) {
return 0;
function hogelandlinux_current_key() {
if ( is_front_page() ) {
return 'home';
}
$now = new DateTime();
$age = $now->diff( $birth )->y;
return $age;
if ( is_home() ) {
return 'blog';
}
$obj = get_queried_object();
if ( $obj && isset( $obj->post_name ) ) {
return $obj->post_name;
}
return home_url();
}
/**
* Excerpt size for pages used on the front page.
* Render the primary nav. Uses a registered WordPress menu when one is set,
* otherwise falls back to listing published top-level pages (so any new page
* automatically appears in the menu).
*/
function hogelandlinux_excerpt_length( $length ) {
return 20;
function hogelandlinux_nav( $location = 'primary' ) {
$locations = get_nav_menu_locations();
if ( ! empty( $locations[ $location ] ) ) {
wp_nav_menu(
array(
'theme_location' => $location,
'container' => false,
'menu_class' => 'nav-links',
'items_wrap' => '<ul class="nav-links">%3$s</ul>',
'fallback_cb' => false,
)
);
return;
}
if ( 'footer' === $location ) {
return;
}
// Fallback: list pages automatically.
$pages = get_pages(
array(
'sort_column' => 'menu_order',
'sort_order' => 'ASC',
'exclude' => get_option( 'page_on_front' ) ? array( (int) get_option( 'page_on_front' ) ) : array(),
)
);
if ( empty( $pages ) ) {
return;
}
echo '<ul class="nav-links">';
foreach ( $pages as $page ) {
$current = ( hogelandlinux_current_key() === $page->post_name ) ? ' active' : '';
printf(
'<li class="menu-item%s"><a href="%s">%s</a></li>',
esc_attr( $current ),
esc_url( get_permalink( $page ) ),
esc_html( get_the_title( $page ) )
);
}
echo '</ul>';
}
add_filter( 'excerpt_length', 'hogelandlinux_excerpt_length' );
/**
* Fallback for the mobile menu: same pages as primary, or registered menu.
*/
function hogelandlinux_nav_mobile() {
$locations = get_nav_menu_locations();
if ( ! empty( $locations['primary'] ) ) {
wp_nav_menu(
array(
'theme_location' => 'primary',
'container' => false,
'menu_class' => '',
'items_wrap' => '%3$s',
'fallback_cb' => false,
)
);
return;
}
$pages = get_pages(
array(
'sort_column' => 'menu_order',
'sort_order' => 'ASC',
'exclude' => get_option( 'page_on_front' ) ? array( (int) get_option( 'page_on_front' ) ) : array(),
)
);
if ( empty( $pages ) ) {
return;
}
foreach ( $pages as $page ) {
$current = ( hogelandlinux_current_key() === $page->post_name ) ? ' active' : '';
printf(
'<a href="%s" class="%s">%s</a>',
esc_url( get_permalink( $page ) ),
esc_attr( trim( $current ) ),
esc_html( get_the_title( $page ) )
);
}
}
/**
* Shortcode: a generic hero banner.
*
* [hero title="..." subtitle="..." button_text="..." button_url="..."]
* [hero button_secondary_text="..." button_secondary_url="..."]
*/
function hogelandlinux_shortcode_hero( $atts ) {
$atts = shortcode_atts(
array(
'title' => '',
'subtitle' => '',
'button_text' => '',
'button_url' => '',
'button2_text' => '',
'button2_url' => '',
'large' => 'no',
),
$atts,
'hero'
);
ob_start();
?>
<section class="<?php echo ( 'yes' === $atts['large'] ) ? 'hero' : 'page-hero'; ?>">
<div class="<?php echo ( 'yes' === $atts['large'] ) ? 'hero-content' : 'container'; ?>">
<?php if ( $atts['title'] ) : ?>
<h1><?php echo esc_html( $atts['title'] ); ?></h1>
<?php endif; ?>
<?php if ( $atts['subtitle'] ) : ?>
<p class="hero-subtitle"><?php echo esc_html( $atts['subtitle'] ); ?></p>
<?php endif; ?>
<?php if ( $atts['button_text'] ) : ?>
<div class="hero-buttons">
<a href="<?php echo esc_url( $atts['button_url'] ); ?>" class="btn btn-primary"><?php echo esc_html( $atts['button_text'] ); ?></a>
<?php if ( $atts['button2_text'] ) : ?>
<a href="<?php echo esc_url( $atts['button2_url'] ); ?>" class="btn btn-secondary"><?php echo esc_html( $atts['button2_text'] ); ?></a>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
</section>
<?php
return ob_get_clean();
}
add_shortcode( 'hero', 'hogelandlinux_shortcode_hero' );
/**
* Shortcode: opening of a section with an optional title.
* [section title="..."] ... [end-section]
* Use with optional class attr: [section title="..." class="section--brand"]
*/
function hogelandlinux_shortcode_section( $atts, $content = null ) {
$atts = shortcode_atts(
array(
'title' => '',
'class' => 'section--light',
),
$atts,
'section'
);
$title = $atts['title'] ? '<h2>' . esc_html( $atts['title'] ) . '</h2>' : '';
return '<section class="section ' . esc_attr( $atts['class'] ) . '"><div class="container">' . $title . do_shortcode( $content ) . '</div></section>';
}
add_shortcode( 'section', 'hogelandlinux_shortcode_section' );
/**
* Shortcode: a single card.
* [card title="..." class="card--benefit" icon="🛡️"]Body content[/card]
*/
function hogelandlinux_shortcode_card( $atts, $content = null ) {
$atts = shortcode_atts(
array(
'title' => '',
'class' => 'card--service',
'icon' => '',
'link' => '',
),
$atts,
'card'
);
$inner = '';
if ( $atts['icon'] ) {
$inner .= '<div class="card__icon">' . $atts['icon'] . '</div>';
}
if ( $atts['title'] ) {
$inner .= '<h3>' . esc_html( $atts['title'] ) . '</h3>';
}
$inner .= do_shortcode( $content );
$class = 'card ' . esc_attr( $atts['class'] );
if ( $atts['link'] ) {
return '<a class="' . esc_attr( $class . ' card-link' ) . '" href="' . esc_url( $atts['link'] ) . '">' . $inner . '</a>';
}
return '<div class="' . esc_attr( $class ) . '">' . $inner . '</div>';
}
add_shortcode( 'card', 'hogelandlinux_shortcode_card' );
/**
* Shortcode: a responsive grid.
* [grid cols="benefits|services|distros|2|3"] content [/grid]
*/
function hogelandlinux_shortcode_grid( $atts, $content = null ) {
$atts = shortcode_atts(
array(
'cols' => 'services',
),
$atts,
'grid'
);
$map = array(
'benefits' => 'benefits-grid',
'services' => 'services-grid',
'distros' => 'distros-grid',
'features' => 'features-grid',
'steps' => 'steps-grid',
'2' => 'grid grid--2-col',
'3' => 'grid grid--3-col',
);
$class = isset( $map[ $atts['cols'] ] ) ? $map[ $atts['cols'] ] : 'grid';
return '<div class="' . esc_attr( $class ) . '">' . do_shortcode( $content ) . '</div>';
}
add_shortcode( 'grid', 'hogelandlinux_shortcode_grid' );
/**
* Shortcode: a call-to-action section.
* [cta title="..." text="..." button_text="..." button_url="..."]
*/
function hogelandlinux_shortcode_cta( $atts ) {
$atts = shortcode_atts(
array(
'title' => '',
'text' => '',
'button_text' => '',
'button_url' => '',
),
$atts,
'cta'
);
ob_start();
?>
<section class="section cta">
<div class="container">
<h2><?php echo esc_html( $atts['title'] ); ?></h2>
<p><?php echo esc_html( $atts['text'] ); ?></p>
<?php if ( $atts['button_text'] ) : ?>
<a href="<?php echo esc_url( $atts['button_url'] ); ?>" class="btn btn-primary btn-large"><?php echo esc_html( $atts['button_text'] ); ?></a>
<?php endif; ?>
</div>
</section>
<?php
return ob_get_clean();
}
add_shortcode( 'cta', 'hogelandlinux_shortcode_cta' );
/**
* Shortcode: a stat tile (used in the Windows EOL stats).
* [stat icon="💻" number="1+ miljard" label="Windows 10 computers wereldwijd"]
*/
function hogelandlinux_shortcode_stat( $atts ) {
$atts = shortcode_atts(
array(
'icon' => '',
'number' => '',
'label' => '',
),
$atts,
'stat'
);
return '<div class="stat"><div class="stat-icon">' . $atts['icon'] . '</div><h3>' . esc_html( $atts['number'] ) . '</h3><p>' . esc_html( $atts['label'] ) . '</p></div>';
}
add_shortcode( 'stat', 'hogelandlinux_shortcode_stat' );
/**
* Shortcode: a collapsible disclaimer.
* [disclaimer summary="Lees de back-updisclaimer"]Body[/disclaimer]
*/
function hogelandlinux_shortcode_disclaimer( $atts, $content = null ) {
$atts = shortcode_atts(
array(
'summary' => '',
),
$atts,
'disclaimer'
);
return '<details class="disclaimer"><summary>' . esc_html( $atts['summary'] ) . '</summary><div class="disclaimer-body">' . do_shortcode( $content ) . '</div></details>';
}
add_shortcode( 'disclaimer', 'hogelandlinux_shortcode_disclaimer' );
@@ -30,26 +30,12 @@ $hl_biz = hogelandlinux_business();
<h1><?php bloginfo( 'name' ); ?></h1>
</a>
</div>
<div class="nav-links">
<?php
hogelandlinux_nav_link( 'Home', '/', 'home' );
hogelandlinux_nav_link( 'Waarom Linux', '/waarom-linux/', 'waarom-linux' );
hogelandlinux_nav_link( 'Diensten', '/diensten/', 'diensten' );
hogelandlinux_nav_link( 'Over mij', '/over-mij/', 'over-mij' );
hogelandlinux_nav_link( 'Contact', '/contact/', 'contact' );
?>
</div>
<?php hogelandlinux_nav( 'primary' ); ?>
<button class="mobile-menu-toggle" aria-label="Menu">
<span>&#9776;</span>
</button>
<div class="mobile-menu" id="mobile-menu">
<?php
hogelandlinux_nav_link( 'Home', '/', 'home' );
hogelandlinux_nav_link( 'Waarom Linux', '/waarom-linux/', 'waarom-linux' );
hogelandlinux_nav_link( 'Diensten', '/diensten/', 'diensten' );
hogelandlinux_nav_link( 'Over mij', '/over-mij/', 'over-mij' );
hogelandlinux_nav_link( 'Contact', '/contact/', 'contact' );
?>
<?php hogelandlinux_nav_mobile(); ?>
</div>
</div>
</nav>
@@ -1,181 +0,0 @@
<?php
/**
* The "Contact" page, mirroring the original contact.html.
* Template Name: Contact
*/
$hl_biz = hogelandlinux_business();
$hl_name = isset( $_POST['hl_name'] ) ? sanitize_text_field( wp_unslash( $_POST['hl_name'] ) ) : '';
$hl_email = isset( $_POST['hl_email'] ) ? sanitize_email( wp_unslash( $_POST['hl_email'] ) ) : '';
$hl_phone = isset( $_POST['hl_phone'] ) ? sanitize_text_field( wp_unslash( $_POST['hl_phone'] ) ) : '';
$hl_computer = isset( $_POST['hl_computer'] ) ? sanitize_text_field( wp_unslash( $_POST['hl_computer'] ) ) : '';
$hl_service = isset( $_POST['hl_service'] ) ? sanitize_text_field( wp_unslash( $_POST['hl_service'] ) ) : '';
$hl_message = isset( $_POST['hl_message'] ) ? sanitize_textarea_field( wp_unslash( $_POST['hl_message'] ) ) : '';
$hl_error = '';
$hl_success = '';
if ( 'POST' === ( $_SERVER['REQUEST_METHOD'] ?? '' ) && isset( $_POST['hl_submit'] ) ) {
if ( empty( $hl_name ) || ! is_email( $hl_email ) || empty( $hl_message ) ) {
$hl_error = 'Vul alle verplichte velden in (naam, e-mail, bericht).';
} else {
$hl_to = $hl_biz['email'];
$hl_subject = sprintf( 'Nieuw contactformulier van %s (via %s)', $hl_name, $hl_biz['name'] );
$hl_body = "Naam: $hl_name\n";
$hl_body .= "Email: $hl_email\n";
$hl_body .= "Telefoon: $hl_phone\n";
$hl_body .= "Computer: $hl_computer\n";
$hl_body .= "Service: $hl_service\n\n";
$hl_body .= "Bericht:\n$hl_message\n";
$hl_headers = array( 'Reply-To: ' . $hl_name . ' <' . $hl_email . '>' );
if ( wp_mail( $hl_to, $hl_subject, $hl_body, $hl_headers ) ) {
$hl_success = 'Bedankt voor uw bericht! Ik neem zo snel mogelijk contact met u op.';
$hl_name = $hl_email = $hl_phone = $hl_computer = $hl_service = $hl_message = '';
} else {
$hl_error = 'Er is een fout opgetreden bij het versturen van uw bericht. Probeer het later opnieuw of stuur direct een e-mail naar ' . $hl_biz['email'] . '.';
}
}
}
get_header();
?>
<main>
<section class="page-hero">
<div class="container">
<h1>Neem contact op</h1>
<p>Heeft u vragen over Linux-migratie? Ik help u graag verder!</p>
</div>
</section>
<section class="section">
<div class="container">
<div class="contact-grid">
<div class="contact-info">
<h2>Contactgegevens</h2>
<div class="contact-item">
<div class="contact-icon">&#128205;</div>
<div>
<h3>Adres</h3>
<p>Geen bezoekadres: ik doe uitsluitend huisbezoeken</p>
<p><?php echo esc_html( $hl_biz['street'] ); ?></p>
<p><?php echo esc_html( $hl_biz['postal'] . ' ' . $hl_biz['village'] ); ?></p>
</div>
</div>
<div class="contact-item">
<div class="contact-icon">&#128231;</div>
<div>
<h3>E-mail</h3>
<p><a href="mailto:<?php echo esc_attr( $hl_biz['email'] ); ?>"><?php echo esc_html( $hl_biz['email'] ); ?></a></p>
</div>
</div>
<div class="contact-item">
<div class="contact-icon">&#127959;&#65039;</div>
<div>
<h3>KvK-nummer</h3>
<p><?php echo esc_html( $hl_biz['kvk'] ); ?></p>
</div>
</div>
<div class="contact-hours">
<h3>Openingstijden</h3>
<p>Maandag: 09:00 - 14:00 (op afspraak)</p>
<p>Dinsdag: 09:00 - 17:00 (op afspraak)</p>
<p>Woensdag: 09:00 - 14:00 (op afspraak)</p>
<p>Donderdag: 09:00 - 14:00 (op afspraak)</p>
<p>Vrijdag: gesloten</p>
</div>
</div>
<div class="contact-form">
<h2>Stuur een bericht</h2>
<?php if ( $hl_error ) : ?>
<div class="alert alert-error">
<strong>&#10060; Fout:</strong> <?php echo esc_html( $hl_error ); ?>
</div>
<?php endif; ?>
<?php if ( $hl_success ) : ?>
<div class="alert alert-success">
<strong>&#9989; Gelukt:</strong> <?php echo esc_html( $hl_success ); ?>
</div>
<?php endif; ?>
<form method="POST" action="<?php echo esc_url( get_permalink() ); ?>">
<div class="form-group">
<label for="hl_name">Naam *</label>
<input type="text" id="hl_name" name="hl_name" value="<?php echo esc_attr( $hl_name ); ?>" required>
</div>
<div class="form-group">
<label for="hl_email">E-mail *</label>
<input type="email" id="hl_email" name="hl_email" value="<?php echo esc_attr( $hl_email ); ?>" required>
</div>
<div class="form-group">
<label for="hl_phone">Telefoon</label>
<input type="tel" id="hl_phone" name="hl_phone" value="<?php echo esc_attr( $hl_phone ); ?>">
</div>
<div class="form-group">
<label for="hl_computer">Huidige computer</label>
<input type="text" id="hl_computer" name="hl_computer" value="<?php echo esc_attr( $hl_computer ); ?>" placeholder="Bijv. Dell Inspiron 2015, HP Pavilion 2018">
</div>
<div class="form-group">
<label for="hl_service">Gewenste service</label>
<select id="hl_service" name="hl_service">
<option value="">Selecteer een optie</option>
<option value="advice" <?php selected( $hl_service, 'advice' ); ?>>Gratis advies</option>
<option value="installation" <?php selected( $hl_service, 'installation' ); ?>>Linux-installatie</option>
<option value="migration" <?php selected( $hl_service, 'migration' ); ?>>Datamigratie</option>
<option value="training" <?php selected( $hl_service, 'training' ); ?>>Training en ondersteuning</option>
<option value="other" <?php selected( $hl_service, 'other' ); ?>>Anders</option>
</select>
</div>
<div class="form-group">
<label for="hl_message">Bericht *</label>
<textarea id="hl_message" name="hl_message" rows="5" required placeholder="Vertel iets over uw situatie en hoe ik u kan helpen..."><?php echo esc_textarea( $hl_message ); ?></textarea>
</div>
<button type="submit" name="hl_submit" class="btn btn-primary">Verstuur bericht</button>
</form>
</div>
</div>
</div>
</section>
<section class="section section--light-green contact-cta">
<div class="container">
<h2>Waarom kiezen voor <?php echo esc_html( $hl_biz['name'] ); ?>?</h2>
<div class="cta-benefits">
<div class="card card--cta">
<div class="card__icon">&#127919;</div>
<h3>Persoonlijke aanpak</h3>
<p>Elke klant is uniek. Ik lever maatwerkoplossingen.</p>
</div>
<div class="card card--cta">
<div class="card__icon">&#128736;&#65039;</div>
<h3>Professionele service</h3>
<p>Ruim 20 jaar ervaring met Linux systemen en migraties.</p>
</div>
<div class="card card--cta">
<div class="card__icon">&#129309;</div>
<h3>Volledige ondersteuning</h3>
<p>Van installatie tot training: ik begeleid u door het hele proces.</p>
</div>
<div class="card card--cta">
<div class="card__icon">&#128154;</div>
<h3>Duurzame keuze</h3>
<p>U kiest voor een duurzamere digitale toekomst.</p>
</div>
</div>
</div>
</section>
</main>
<?php
get_footer();
@@ -1,108 +0,0 @@
<?php
/**
* The "Diensten" page, mirroring the original diensten.html.
* Template Name: Diensten
*/
get_header();
?>
<main>
<section class="page-hero">
<div class="container">
<h1>Diensten en tarieven</h1>
<p>Linux blijft vrij. Mijn hulp is betaalbaar, met duidelijke afspraken vooraf.</p>
</div>
</section>
<section class="section section--light services">
<div class="container">
<h2>Wat ik voor u kan doen</h2>
<div class="services-grid">
<div class="card card--service">
<h3>Gratis advies</h3>
<p>Ik bekijk uw huidige computer en adviseer over de beste Linux-distributie en aanpak.</p>
</div>
<div class="card card--service">
<h3>Installatieservice</h3>
<p>Professionele Linux-installatie met basissoftware, updates en drivers waar nodig.</p>
</div>
<div class="card card--service">
<h3>Datamigratie</h3>
<p>Overzetten van bestanden, documenten en foto&rsquo;s van uw oude systeem naar Linux. Zie ook de <a href="#backup-disclaimer">back-updisclaimer</a> hieronder.</p>
</div>
<div class="card card--service">
<h3>Training en ondersteuning</h3>
<p>Uitleg en begeleiding zodat u direct prettig aan de slag kunt met Linux.</p>
</div>
</div>
</div>
</section>
<section class="section section--light">
<div class="container">
<h2>Waarom betalen voor hulp bij Linux?</h2>
<p>Linux zelf is vrije software. Iedereen kan het downloaden en gebruiken. Wat ik aanbied, is mijn tijd, kennis en zorg: ik neem u het uitzoekwerk, de installatie en de uitleg uit handen. Zo kunt u zonder stress meteen prettig aan de slag.</p>
</div>
</section>
<section class="section section--brand contact-cta">
<div class="container">
<h2>Tarieven</h2>
<div class="cta-benefits">
<div class="cta-benefit">
<div class="benefit-icon" aria-hidden="true"><span class="benefit-icon__glyph">&euro;</span></div>
<h3>&euro;20 per half uur</h3>
<p>Transparant, zonder verborgen kosten. Reistijd in overleg, binnen Het Hogeland vaak kosteloos.</p>
</div>
<div class="cta-benefit">
<div class="benefit-icon" aria-hidden="true"><span class="benefit-icon__glyph">i</span></div>
<h3>Voorbeelden</h3>
<p>Installatie + basisinrichting + uitleg: 1 &agrave; 2 uur. Migratie van gegevens: afhankelijk van volume en snelheid van opslag.</p>
</div>
<div class="cta-benefit">
<div class="benefit-icon" aria-hidden="true"><span class="benefit-icon__glyph">+</span></div>
<h3>Extra service</h3>
<p>Optioneel kan ik data kopi&euml;ren naar uw USB-stick(s) of externe schijf. Zie de <a href="#backup-disclaimer">back-updisclaimer</a>.</p>
</div>
</div>
<div style="margin-top:1.5rem">
<h3>Toegankelijkheid</h3>
<p>Mijn standaardtarief is &euro;20 per half uur. Dat is een eerlijke vergoeding voor mijn werk, waarmee ik deze service in Het Hogeland kan blijven aanbieden.</p>
<p>Heeft u een smalle beurs of zit u in een moeilijke situatie? Dan kijken we samen naar een oplossing. Ik vind dat financi&euml;le drempels geen reden mogen zijn om de overstap naar Linux te missen.</p>
<p>Ik organiseer regelmatig <b>gratis informatiebijeenkomsten</b> en help bij Repair Caf&eacute;s. Dat blijft kosteloos.</p>
</div>
</div>
</section>
<section class="section section--light-green services">
<div class="container">
<h2>Mijn aanpak</h2>
<div class="steps-grid">
<div class="card card--service"><h3>1. Kennismaking (gratis)</h3><p>We bespreken wensen, hardware en gebruik.</p></div>
<div class="card card--service"><h3>2. Proefstart</h3><p>Linux live vanaf USB om te testen op uw pc.</p></div>
<div class="card card--service"><h3>3. Installatie</h3><p>Compleet ingericht met updates, drivers en basissoftware.</p></div>
<div class="card card--service"><h3>4. Migratie</h3><p>Bestanden, foto&rsquo;s en documenten veilig overzetten.</p></div>
<div class="card card--service"><h3>5. Uitleg &amp; nazorg</h3><p>Korte training en laagdrempelige ondersteuning.</p></div>
</div>
</div>
</section>
<section class="contact-content">
<div class="container">
<h2 id="backup-disclaimer">Belangrijk over back-ups</h2>
<details class="disclaimer">
<summary>Lees de back-updisclaimer</summary>
<div class="disclaimer-body">
<p>Ik lever een Linux-installatie- en migratieservice. <strong>Back-ups maken en bewaren is in principe de verantwoordelijkheid van de klant.</strong> Als extra service kan ik, op uw verzoek, data kopi&euml;ren naar door u aangeleverde USB-sticks of een externe schijf. Als u geen opslag bij de hand heeft, kan ik USB-sticks van verschillende groottes meebrengen en leveren tegen een normale, eerlijke prijs.</p>
<p>Hoewel ik zorgvuldig werk, kan er bij datakopie of migratie altijd een risico op dataverlies bestaan, bijvoorbeeld door defecte schijven, corrupte data of hardwarefouten. <strong>U blijft verantwoordelijk voor uw eigen data</strong>. Ik ben niet aansprakelijk voor verlies of beschadiging van gegevens. Ik adviseer altijd om vooraf een eigen back-up te maken.</p>
</div>
</details>
<div class="about-cta">
<a href="<?php echo esc_url( home_url( '/contact/' ) ); ?>" class="btn btn-primary">Vrijblijvend contact opnemen</a>
</div>
</div>
</section>
</main>
<?php
get_footer();
@@ -1,57 +0,0 @@
<?php
/**
* The "Over mij" page, mirroring the original over-mij.html.
* Template Name: Over mij
*/
$hl_biz = hogelandlinux_business();
$hl_age = hogelandlinux_age( $hl_biz['birth'] );
$hl_son_age = hogelandlinux_age( $hl_biz['son_birth'] );
get_header();
?>
<main>
<section class="page-hero">
<div class="container">
<h1>Over mij</h1>
<p>Maak kennis met de Linux-evangelist van Het Hogeland.</p>
</div>
</section>
<section class="section">
<div class="container">
<div class="about-grid">
<div class="about-text">
<p>Moi! Ik ben <?php echo esc_html( $hl_biz['about'] ); ?> (<?php echo esc_html( $hl_age ); ?>). Ik ben opgegroeid in <strong>Baflo</strong> en woon sinds <strong>2023</strong> in <strong>Eenrum</strong>, samen met mijn partner en onze <?php echo esc_html( $hl_son_age ); ?>-jarige zoon. Het Hogeland is mijn thuis - en juist hier wil ik mensen helpen om hun computers duurzaam, veilig en prettig te blijven gebruiken met Linux.</p>
<div class="about-photo about-photo-mobile">
<figure>
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/DutchOpen2024.jpg' ); ?>" alt="Foto van mijzelf met mijn zoontje bij grasbaanraces">
<figcaption><small>Ik met mijn zoontje bij de grasbaanraces (Dutch Open 2024)</small></figcaption>
</figure>
</div>
<p>Linux gebruik ik al ruim <strong>20 jaar</strong>. Eerst uit nieuwsgierigheid, later uit overtuiging: het is veilig, snel, privacyvriendelijk en geeft je de regie over je eigen computer. In mijn werk heb ik <strong>meer dan 10 jaar</strong> ervaring als <strong>organisch chemicus</strong> en ben ik daarna <strong>softwareontwikkelaar</strong> geworden (nu <strong>5+ jaar</strong>). In beide werelden werkte ik veel met Linux en servers - van dataverwerking tot automatisering en betrouwbare infrastructuur.</p>
<p>Met <?php echo esc_html( $hl_biz['name'] ); ?> wil ik de <strong>Linux-evangelist van Het Hogeland</strong> zijn: iemand die je helpt bij de overstap, de juiste keuzes met je afstemt en ervoor zorgt dat jouw computer weer jaren mee kan. Of je nu wilt migreren van Windows 10, nieuwsgierig bent naar Linux, of gewoon hulp nodig hebt met je systeem - ik sta voor je klaar.</p>
<p>Naast deze service run ik ook <a href="https://chemistry.software" target="_blank" rel="noopener">chemistry.software</a>, waar ik bedrijven help met wetenschappelijke en scheikundige softwareoplossingen. Die ervaring neem ik natuurlijk mee in mijn aanpak: praktisch, zorgvuldig en toekomstbestendig.</p>
<p>Wil je weten wat Linux voor jou kan betekenen of gewoon even sparren? Neem gerust contact op, ik denk graag met je mee.</p>
<div class="about-cta">
<a href="<?php echo esc_url( home_url( '/contact/' ) ); ?>" class="btn btn-primary">Neem contact op</a>
</div>
</div>
<div class="about-photo about-photo-desktop">
<figure>
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/DutchOpen2024.jpg' ); ?>" alt="Foto van mijzelf met mijn zoontje bij grasbaanraces">
<figcaption><small>Ik met mijn zoontje bij de grasbaanraces (Dutch Open 2024)</small></figcaption>
</figure>
</div>
</div>
</div>
</section>
</main>
<?php
get_footer();
@@ -1,78 +0,0 @@
<?php
/**
* Walks the "Waarom Linux" page, mirroring the original linux.html.
* Template Name: Waarom Linux
*/
get_header();
?>
<main>
<section class="page-hero">
<div class="container">
<h1>Waarom Linux?</h1>
<p>Nieuw bij Linux? Geen zorgen. Linux is een betrouwbaar en eenvoudig computersysteem dat uw computer vaak weer prettig laat werken, zonder dat u ervoor hoeft te betalen. U kunt blijven doen wat u gewend bent: internetten, e-mailen, foto&rsquo;s bekijken, videobellen en bankieren. Hieronder vindt u een korte uitleg en voorbeelden in beeld.</p>
</div>
</section>
<section class="section section--light intro-gnome">
<div class="container">
<h2 class="section__title">Rustig overstappen naar Linux</h2>
<div class="grid grid--2-col">
<div>
<div class="feature-image">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/gnome.webp' ); ?>" alt="GNOME desktop op Linux" loading="lazy">
<div class="image-caption">
<small>GNOME desktop. Bron: <a href="https://www.ifixit.com/Guide/How+to+install+a+GUI+on+Arch+Linux/167611" target="_blank" rel="noopener">iFixit</a></small>
</div>
</div>
</div>
<div>
<h3>Bekende bediening</h3>
<p>Menu, vensters, bureaublad: het werkt zoals u verwacht. U kunt direct aan de slag.</p>
<h3>Wat u dagelijks nodig hebt</h3>
<p>Internet, e-mail, videobellen, foto&rsquo;s beheren, bankieren en documenten maken: het kan allemaal. Veel vertrouwde apps zijn beschikbaar en er zijn goede alternatieven voor Windows-programma&rsquo;s. Ik help u stap voor stap op weg.</p>
</div>
</div>
</div>
</section>
<?php $hl_section_class = 'section--light-green'; get_template_part( 'template-parts/benefits' ); ?>
<section class="section section--light distros">
<div class="container">
<h2>Welke Linux past bij u?</h2>
<p class="section-subtitle">Niet iedereen hoeft alle keuzes te zien. Daarom drie eenvoudige opties om mee te beginnen.</p>
<div class="distro-tiles">
<div class="distro-tile">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/mint.svg' ); ?>" alt="Linux Mint" class="distro-tile__img">
<h3>Linux Mint</h3>
<p>Heel vertrouwd voor overstappers. Lijkt qua bediening op Windows en werkt stabiel.</p>
</div>
<div class="distro-tile">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/ubuntu.png' ); ?>" alt="Ubuntu" class="distro-tile__img">
<h3>Ubuntu LTS</h3>
<p>Veelgebruikt en jarenlang ondersteund. Geschikt voor allerlei toepassingen.</p>
</div>
<div class="distro-tile">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/elementary.png' ); ?>" alt="Elementary OS" class="distro-tile__img">
<h3>Elementary OS</h3>
<p>Rustig en overzichtelijk, met een eenvoudig ontwerp dat prettig oogt.</p>
</div>
</div>
<p class="section-subtitle" style="margin-top:1rem">Wilt u later meer ontdekken? Er bestaan nog veel andere varianten zoals Fedora, Pop!_OS of Garuda Linux, ideaal voor wie graag experimenteert of speciale wensen heeft.</p>
</div>
</section>
<?php $hl_section_class = 'section--light-green'; get_template_part( 'template-parts/linux-features' ); ?>
<section class="section cta">
<div class="container">
<h2>Klaar voor de overstap?</h2>
<p>Laat uw computer niet eindigen als e-waste. Geef hem een tweede leven met Linux - ik help u graag.</p>
<a href="<?php echo esc_url( home_url( '/contact/' ) ); ?>" class="btn btn-primary btn-large">Neem contact op</a>
</div>
</section>
</main>
<?php
get_footer();
@@ -1,27 +1,44 @@
<?php
/**
* Fallback template: generic page.
* Universal page template: renders the editor content.
*
* Page hero is shown if the page has a title and there is no [hero] shortcode
* already in the content. Any [hero] shortcode placed at the top of the editor
* replaces this automatic hero.
*/
get_header();
?>
<main>
<section class="page-hero">
<div class="container">
<h1><?php the_title(); ?></h1>
</div>
</section>
<?php
while ( have_posts() ) :
the_post();
<section class="section">
<div class="container">
<?php
while ( have_posts() ) :
the_post();
the_content();
endwhile;
$content = get_the_content();
if ( false !== strpos( $content, '[hero' ) ) {
// Hero handled inside the content via shortcode.
} else {
?>
</div>
</section>
<section class="page-hero">
<div class="container">
<h1><?php the_title(); ?></h1>
<?php if ( has_excerpt() ) : ?>
<p><?php echo esc_html( get_the_excerpt() ); ?></p>
<?php endif; ?>
</div>
</section>
<?php
}
?>
<section class="section">
<div class="container">
<div class="entry-content">
<?php the_content(); ?>
</div>
</div>
</section>
<?php endwhile; ?>
</main>
<?php
@@ -1,44 +0,0 @@
<?php
/**
* Benefits partial (Where to place: home + linux pages).
* Variable: $hl_section_class
*/
$hl_section_class = isset( $hl_section_class ) ? $hl_section_class : 'section--light';
?>
<section id="voordelen" class="section <?php echo esc_attr( $hl_section_class ); ?> benefits">
<div class="container">
<h2><a href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">Waarom Linux kiezen?</a></h2>
<div class="benefits-grid">
<a class="card card--benefit card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="card__icon">&#128737;&#65039;</div>
<h3>Veilig en betrouwbaar</h3>
<p>Beschermd tegen virussen en zonder storende, onverwachte updates. U houdt de controle over uw computer.</p>
</a>
<a class="card card--benefit card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="card__icon">&#128176;</div>
<h3>Helemaal gratis</h3>
<p>Geen licenties of abonnementen nodig. Linux en de meeste programma&rsquo;s zijn kosteloos.</p>
</a>
<a class="card card--benefit card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="card__icon">&#128260;</div>
<h3>Geschikt voor oudere computers</h3>
<p>Ook een computer die al jaren meegaat kan met Linux weer soepel draaien.</p>
</a>
<a class="card card--benefit card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="card__icon">&#127793;</div>
<h3>Beter voor het milieu</h3>
<p>Door langer met uw computer te doen voorkomt u elektronisch afval (e-waste). Goed voor uw portemonnee en voor de planeet.</p>
</a>
<a class="card card--benefit card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="card__icon">&#128274;</div>
<h3>Uw privacy blijft van uzelf</h3>
<p>Geen verborgen gegevensverzameling of tracking.</p>
</a>
<a class="card card--benefit card-link" href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">
<div class="card__icon">&#9889;</div>
<h3>Sneller werken</h3>
<p>Linux start vlot op en voelt vaak lichter aan dan andere systemen.</p>
</a>
</div>
</div>
</section>
@@ -1,45 +0,0 @@
<?php
/**
* Linux features partial (home + linux pages).
* Variable: $hl_section_class
*/
$hl_section_class = isset( $hl_section_class ) ? $hl_section_class : 'section--light-green';
?>
<section class="section <?php echo esc_attr( $hl_section_class ); ?> linux-features">
<div class="container">
<h2><a href="<?php echo esc_url( home_url( '/waarom-linux/' ) ); ?>">Linux in actie</a></h2>
<p class="section-subtitle">Zie hoe Linux eruitziet en werkt in de praktijk</p>
<div class="features-grid">
<div class="feature-showcase">
<div class="feature-image">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/Zorin-17-desktop.webp' ); ?>" alt="Zorin OS 17 Desktop" loading="lazy">
<div class="image-caption">
<small>Bron: <a href="https://www.debugpoint.com/wp-content/uploads/2023/12/Zorin-17-desktop.jpg" target="_blank" rel="noopener">DebugPoint.com</a></small>
</div>
</div>
<h3>Moderne desktopinterface</h3>
<p>Ziet er vertrouwd uit, werkt snel en stabiel. Ideaal voor dagelijks gebruik.</p>
</div>
<div class="feature-showcase">
<div class="feature-image">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/LinuxMintCinnamonSoftwareManager.webp' ); ?>" alt="Linux Mint Softwarebeheer" loading="lazy">
<div class="image-caption">
<small>Bron: <a href="https://linuxmint.com" target="_blank" rel="noopener">LinuxMint.com</a></small>
</div>
</div>
<h3>Eenvoudig software installeren</h3>
<p>Duizenden gratis programma&rsquo;s met &eacute;&eacute;n klik via Softwarebeheer.</p>
</div>
<div class="feature-showcase">
<div class="feature-image">
<img src="<?php echo esc_url( HOGELANDLINUX_URL . '/assets/images/GamingBenchmarkLinuxvsWindows.webp' ); ?>" alt="Gamingprestaties Linux versus Windows" loading="lazy">
<div class="image-caption">
<small>Bron: <a href="https://www.youtube.com/watch?v=4LI-1Zdk-Ys" target="_blank" rel="noopener">Linux vs Windows Gaming Performance</a></small>
</div>
</div>
<h3>Gamingprestaties</h3>
<p>Prima geschikt voor gaming dankzij moderne drivers en optimalisaties.</p>
</div>
</div>
</div>
</section>