У меня есть компонент, созданный плагином, который отображает список статей из пользовательского типа сообщения. С каждой статьей связан класс post-id. Я не могу переопределить файлы плагина в дочерней теме на l oop внутри шаблона, который генерирует список, поэтому мне нужно создать функцию в функциях. php. Мне нужно заменить div внутри статьи новым div, стилизованным под настраиваемое поле (палитру цветов), созданное с помощью расширенного плагина настраиваемого поля, который динамически связан с каждой статьей.
loop {
display: flex;
width: 100%;
}
article {
width: 200px;
height: 200px;
background: red;
margin:20px;
display:flex;
justify-content:center;
align-items:center;
}
.overlay {
width:150px;
height:150px;
}
<article class="portfolio-item post-53">
<div class="overlay" style="background-color:#000"></div>
</article>
<article class="portfolio-item post-65">
<div class="overlay" style="background-color:#000"></div>
</article>
<article class="portfolio-item post-70">
<div class="overlay" style="background-color:#000"></div>
</article>
function insert_custom_div() {
$args = array(
'meta_key' => 'new_color',
'post_type' => 'portfolio-item'
);
$posts = get_posts($args);
foreach ($posts as $post):
$color_picker_custom_field = get_field('new_color', $post->ID);
if ($color_picker_custom_field) {
?>
<script>
jQuery( document ).ready( function() {
jQuery('article').append('<div class="overlay post-<?php echo $post->ID; ?>" style="background-color:<?php echo $color_picker_custom_field; ?>"></div>');
});
</script>
<?php
}
endforeach;
}
add_action('wp_head','insert_custom_div');