WordPress Best Practices

Implementacja styli i skryptów per page (Łukasz way)

Wiemy już, że dobrze jest oddzielić style i skrypty używane tylko na konkretnej podstronie od tych globalnych. Trec nauczył mnie przekazywania argumentów do headera i footera ? a następnie implementacji konkretnych skryptów w dokumencie w odpowiednich miejscach.

W drugim argumencie funkcji get_header() i get_footer() możemy przekazać dowolne argumenty, wykorzystałem je do nazw plików.

//custom-page.php

<?php
    /* Template Name: Custom Page */
?>

<?php
    get_header('default', [
        'css' => 'custom-page.css'
    ]);
?>

<?php
    the_content();
?>

<?php
    get_footer('default', [
        'script' => 'custom-page.js'
    ]);
?>

W headerze i footerze odebrałem ten argument a następnie wkleiłem w odpowiednie elementy.

//header.php

{...}
<?php
    if(isset($args['css'])) {
        $cssPath = get_template_directory_uri() . '/assets/css/pages/' . $args['css'];
        echo "<link rel='stylesheet' href='$cssPath' />";
    }
?>
{...}

//footer.php

{...}
<?php
    if(isset($args['script'])) {
        $scriptPath = get_template_directory_uri() . '/assets/js/' . $args['script'];
        echo "<script src='$scriptPath'></script>";
    }
?>
{...}

Dodanie styli do admina

Spraw żeby Twój edytor wyglądał tak samo jak front który tworzysz. Należy pamiętać o każdym pliku css który dodajemy do frontu.

function admin_style() {
    wp_enqueue_style('admin-styles', get_template_directory_uri().'/assets/css/global.css');
  }
add_action('admin_enqueue_scripts', 'admin_style');

Dodaj komentarz