fil_and
@fil_and
Делаю сайт гимнастики

Как сделать текст поверх картинки в динамических блоках на css в WP?

Здравствуйте, как сделать текст поверх картинки, если этот блок будет менять своё положение на странице?

Суть:
блог на Wordpress
по задумке, к посту загружается миниатюра, а на неё накладывается текст, выглядит это вот так (страница с постом)
5a4b6a7a9cb60949820320.png
загружаю картинку через это поле
5a4b6ac38710b989821782.png
вот так
5a4b6ada50a4c182958695.png
такая картинка одна и не будет менять своё положение, поэтому у текста заголовка position: absolute

Вопрос:
как реализовать наложение текста, когда таких постов много на странице?, Например тут
страница
5a4b6b5d008d3022748474.png
через backgrond-image нельзя же, потому что не вписать <?php the_post_thumbnail(); ?> в свойствах css, и position: absolute нельзя использовать. Тогда как?
  • Вопрос задан
  • 3331 просмотр
Решения вопроса 1
HeadOnFire
@HeadOnFire
PHP, Laravel & WordPress Evangelist
через backgrond-image нельзя же, потому что не вписать <?php the_post_thumbnail(); ?> в свойствах css, и position: absolute нельзя использовать

Можно, просто вместо функции the_post_thumbnail(), которая выводит html-код изображения (то есть весть тег IMG), используйте функцию the_post_thumbnail_url(), которая выводит только URL картинки:
<div class="post-head" style="background: url( <?php the_post_thumbnail_url(); ?> );">
    <h1><?php the_title(); ?></h1>
</div>

Ну а через класс .post-head уже дополнительные стили вешаете.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы