Дмитрий Комчев

Примеры стилизации select

Попробуйте поиграться с navigator.userAgent. Можно определить телефон, планшет, ПК, браузер, операционную систему.

Способов много. Например, так: Стилизация Input File

.parent-div {
    display: grid;
    place-items: center;
}

.fancybox-inner .fancybox-navigation .fancybox-button {
    opacity: 1;
    visibility: visible;
}

А вообще, наверно потому что у вас один элемент и не стоит
loop: true,

const text = document.querySelector('.class');

document.onclick = function(e){
    if ( event.target.className != 'class' ) {
        // ваша другая функция
    };
};

Больше примеров: Клик вне элемента.

Если без плагинов - Стилизация select

<?php
$logo_img = '';
if ($custom_logo_id = get_theme_mod('custom_logo')) {
    $logo_img = wp_get_attachment_image($custom_logo_id, 'full', false, array(
        'class'    => 'logo-footer', // здесь Ваш class
        'alt' => get_bloginfo('name'),
        'itemprop' => 'logo',
    ));
}
?>
<a href="<?php echo esc_url(home_url('/')); ?>" rel="home" class="logo">
        <?php echo $logo_img; ?>
</a>

Источник: Шпаргалка по работе с WordPress - блок «Вывод логотипа в WordPress».

Проверяя тип страницы, добавьте подключение стилей и скриптов для нужных типов страниц.

// Подключение стилей и скриптов только на страницах магазина
add_action( 'wp_enqueue_scripts', 'wc_styles_scripts', 99 );
function wc_styles_scripts() {

    if ( function_exists( 'is_woocommerce' ) ) {
        if ( ! is_woocommerce() && ! is_cart() && ! is_checkout() && ! is_account_page() ) {

            wp_dequeue_style('woocommerce-layout');
            wp_dequeue_style('woocommerce-smallscreen');
            wp_dequeue_style('woocommerce-general');
            wp_dequeue_style('evolution-woostyles');

            wp_dequeue_script('wc_price_slider');
            wp_dequeue_script('wc-single-product');
            wp_dequeue_script('wc-add-to-cart');
            wp_dequeue_script('wc-cart-fragments');
            wp_dequeue_script('wc-checkout');
            wp_dequeue_script('wc-add-to-cart-variation');
            wp_dequeue_script('wc-single-product');
            wp_dequeue_script('wc-cart');
            wp_dequeue_script('wc-chosen');
            wp_dequeue_script('woocommerce');
            wp_dequeue_script('prettyPhoto');
            wp_dequeue_script('prettyPhoto-init');
            wp_dequeue_script('jquery-blockui');
            wp_dequeue_script('jquery-placeholder');
            wp_dequeue_script('fancybox');
            wp_dequeue_script('jqueryui');
        }
    }
}

Здесь возможно найдете больше информации Шпаргалка по WooCommerce

document.querySelector('.class').addEventListener('input', () => {
        // сохраняете в базу 
});