Theme WordPress dari nol

1. Aktifkan Custom Logo

Di functions.php, tambahkan ke fungsi aamblog_setup(): tambahkan add_theme_support('custom-logo'); kita memberi tahu WordPress bahwa Theme ini mendukung fitur Logo pada Site Identity.

Hasilnya jadi seperti ini

function aamblog_setup()
{
    add_theme_support('title-tag');

    add_theme_support('custom-logo');
}

add_action(
    'after_setup_theme',
    'aamblog_setup'
);

2. Pilih Logo di WordPress

Masuk ke:

Appearance → Customize → Site Identity

Kemudian pilih logo dan upload logo

3. Tampilkan Logo di sebelah Site Title

Sekarang di header.php, kita bisa menggunakan: <?php the_custom_logo(); ?>

<header class="header">

    <div class="container">

        <div class="site-branding">

            <?php the_custom_logo(); ?>

            <div>

                <h1>
                    <?php bloginfo('name'); ?>
                </h1>

                <p>
                    <?php bloginfo('description'); ?>
                </p>

            </div>

        </div>

    </div>

</header>

4. CSS

Tambahkan css di style.css

.site-branding {
    display: flex;
    align-items: center;
    gap: 15px;
}

.site-branding .custom-logo {
    width: 60px;
    height: 60px;
    object-fit: contain;
}

.site-branding h1 {
    margin: 0 0 5px;
}

.site-branding p {
    margin: 0;
}

Hasilnya seperti ini , logo tampil sebelah kiri dan sudah ada link ke halaman depan