Top 10 Custom Code Snippets voor je functions.php in WordPress

In de wereld van WordPress zijn de mogelijkheden eindeloos, vooral als je de kracht van het functions.php-bestand benut. Dit bestand maakt het mogelijk om de functionaliteit van je thema te wijzigen en aan te passen zonder dat je plugins hoeft te gebruiken. Hier zijn de top 10 custom code snippets die je kunt toevoegen aan je functions.php-bestand om je WordPress-site te verbeteren.

1. Verander het Login Logo

Met deze snippet kun je het standaard WordPress-loginlogo vervangen door je eigen logo.

function custom_login_logo() {
    echo '<style type="text/css">
        #login h1 a {
            background-image: url(' . get_template_directory_uri() . '/images/custom-logo.png);
            width: 100%;
            height: 100px;
            background-size: contain;
            background-repeat: no-repeat;
        }
    </style>';
}
add_action('login_enqueue_scripts', 'custom_login_logo');

2. Verberg de Admin Bar voor Alle Gebruikers Behalve Beheerders

Wil je de admin-balk verbergen voor iedereen behalve beheerders? Gebruik deze snippet:

if (!current_user_can('administrator')) {
    add_filter('show_admin_bar', '__return_false');
}

3. Voeg een “Scroll to Top” Button Toe

Met deze snippet kun je eenvoudig een “Scroll to Top” knop aan je site toevoegen.

function scroll_to_top_button() {
    echo '<a href="#" class="scroll-to-top">↑</a>';
}
add_action('wp_footer', 'scroll_to_top_button');

CSS voor de Knop

Voeg deze CSS toe aan je thema om de knop te stylen:

.scroll-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #3498db;
    color: white;
    padding: 10px;
    border-radius: 5px;
    display: none; /* Verberg de knop standaard */
}

.scroll-to-top.show {
    display: block; /* Toon de knop als je naar beneden scrolt */
}

JavaScript om de Knop Te Tonen

Voeg ook dit JavaScript toe aan je footer om de knop te tonen bij scrollen:

jQuery(document).ready(function($) {
    $(window).scroll(function() {
        if ($(this).scrollTop() > 100) {
            $('.scroll-to-top').addClass('show');
        } else {
            $('.scroll-to-top').removeClass('show');
        }
    });

    $('.scroll-to-top').click(function(e) {
        e.preventDefault();
        $('html, body').animate({scrollTop: 0}, 500);
    });
});

4. Voeg een Custom Excerpt Lengte Toe

Standaard is de excerpt-lengte in WordPress 55 woorden. Met deze snippet kun je deze lengte aanpassen.

function custom_excerpt_length($length) {
    return 20; // Pas dit aan naar het gewenste aantal woorden
}
add_filter('excerpt_length', 'custom_excerpt_length');

5. Verwijder de WordPress Versie Nummer

Verberg het versie nummer van je WordPress-installatie voor extra veiligheid.

remove_action('wp_head', 'wp_generator');

6. Voeg een Footer Widget Area Toe

Met deze snippet kun je een widget area in de footer van je thema toevoegen.

function custom_footer_widget_init() {
    register_sidebar(array(
        'name' => 'Footer Widget Area',
        'id' => 'footer-widget',
        'before_widget' => '<div>',
        'after_widget' => '</div>',
        'before_title' => '<h3>',
        'after_title' => '</h3>',
    ));
}
add_action('widgets_init', 'custom_footer_widget_init');

7. Pas de Login URL aan

Met deze snippet kun je de login-URL van je WordPress-site aanpassen.

function custom_login_url() {
    return home_url(); // Vervang dit door je gewenste URL
}
add_filter('login_headerurl', 'custom_login_url');

8. Voeg een Berichtenfunctie Toe voor Voorbeelden van Berichten

Met deze functie kun je een voorbeeld van een bericht toevoegen aan je WordPress-editor.

function custom_post_preview($post) {
    echo '<div class="post-preview">Voorbeeld van je bericht hier.</div>';
}
add_action('edit_form_after_title', 'custom_post_preview');

9. Schakel het Emoji Script uit

WordPress voegt standaard een emoji-script toe. Als je dit niet nodig hebt, kun je het uitschakelen:

remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('wp_print_styles', 'print_emoji_styles');

10. Pas de Standaard Avatar Aan

Met deze snippet kun je de standaard avatar van WordPress wijzigen.

function custom_avatar($avatar_defaults) {
    $avatar_defaults['custom_avatar'] = get_template_directory_uri() . '/images/custom-avatar.png';
    return $avatar_defaults;
}
add_filter('avatar_defaults', 'custom_avatar');

---

Conclusie

Door deze custom code snippets toe te voegen aan je functions.php-bestand, kun je de functionaliteit van je WordPress-site gemakkelijk uitbreiden en aanpassen. Zorg ervoor dat je altijd een back-up maakt van je bestanden voordat je wijzigingen aanbrengt. Experimenteer met deze snippets en ontdek hoe ze jouw WordPress-ervaring kunnen verbeteren!