создание динамического фонового изображения в WordPress

Question

Я пытаюсь получить динамическое фоновое изображение в WordPress. Моя цель состоит в том, чтобы пользователь мог изменять фоновое изображение с помощью панели инструментов WordPress. Я использую плагин Advanced Custom Field.

Я прочитал сайт Advanced Custom Field, но ничего не нашел по фоновым изображениям на нем.

Пример кода будет полезен.

Спасибо

Answer 1

ACF не предоставляет отдельного поля для фонового изображения, но вы можете использовать простое поданное изображение и использовать его для установки фонового изображения.

для этого определяют поле изображения из меню ACF. и вставьте этот код на свою страницу, куда вы хотите поместить фоновое изображение

<div style="background-image: url(<?php echo get_field('background'); ?>);"><div>

Как вы можете видеть, вы можете использовать свойство css background-image , чтобы установить фоновое изображение, здесь оно извлечет изображение, сохраненное в поле 'background', и поместит его в качестве фонового изображения.

PS: - вы должны заменить имя поля 'background' на имя вашего поля.

Answer 2

вы можете выводить динамические стили в заголовке вашей страницы, используя хук wp_head. Вот пример (добавьте это в ваши functions.php):

function my_inline_styles() {
    $body_bg_image="/wp-content/uploads/myimg.jpg"; //here you would get your value from ACF
    ?>
<!-- start my dynamic styles-->
<style type="text/css">
    body {background-image: url('<?= $body_bg_image ?>')};
</style>
<!-- end my dynamic styles-->
    <?php
}
add_action('wp_head', 'my_inline_styles');

Я бы порекомендовал вставить их в верхний колонтитул вместо нижнего колонтитула, чтобы обеспечить раннюю загрузку этих стилей.