可自定义颜色的WordPress主题

时间:2019-08-05 10:59:43

标签: php wordpress bootstrap-4 wordpress-theming

我目前正在尝试将我制作的Bootstrap单页网站转换为WordPress主题。我需要帮助的部分是允许自定义颜色。特别是附加到引导程序的原色和辅助色。

我已经在functions.php中注册了主题定制器,但是我需要一种方法来实际更改页面上的颜色。

我曾考虑使用类似下面的内容,但是我有很多东西使用主色或辅助色,然后就拥有了所有自举程序。有没有简单/快速的方法可以解决这个问题?还是我被迫这样做?

function customize_css() {
    $primary = get_theme_mod('primary_colour', '#F0AEAA');
    $secondary = get_theme_mod('secondary_colour', '#2C3E50');
    ?>
        <style>
            /* PRIMARY COLOUR OVERWRITES */
            a {
                color: <?= $primary ?>;
            }
            .bg-primary {
                background-color: <?= $primary ?> !important;
            }

            /* SECONDARY COLOUR OVERWRITES */
            .bg-secondary {
                background-color: <?= $secondary ?> !important;
            }
        </style>
    <?php
}
add_action('wp_head', 'customize_css');

1 个答案:

答案 0 :(得分:1)

您的代码示例是显示背景颜色的最简单方法。

只需将代码放在主题中的functions.php文件中即可。

function customize_css() {
    $primary = get_theme_mod('primary_colour', '#F0AEAA');
    $secondary = get_theme_mod('secondary_colour', '#2C3E50');
    ?>
        <style>
            /* PRIMARY COLOUR OVERWRITES */
            a {
                color: <?= $primary ?>;
            }
            .bg-primary {
                background-color: <?= $primary ?> !important;
            }

            /* SECONDARY COLOUR OVERWRITES */
            .bg-secondary {
                background-color: <?= $secondary ?> !important;
            }
        </style>
    <?php
}
add_action('wp_head', 'customize_css');

万事如意!