Помощь Текст на изображении

[Avalones]

Всем привет, знаю что вопрос очень простой и есть гугл, но я все облазил никак не могу разобраться, прощу вашей помощи. Итак, есть сайт на WP + WpBakery нигде не могу найти как сделать текст на изображении, без всяких анимаций, просто чтобы было фоновое изображение и в нужном месте текста кусок. Как тут:

Спойлер: Текст+изображение

Текст тут выделяется (т.е. его увидит поисковик) и при скролинге он остается на своем месте. Может плагин, аддон какой-то?

 

[NightHunter]

Насчёт плагинов не знаю, только слайдеры позволяют такое делать. Проще создать блок со своим кодом, и с помощью css, сделать так, как тебе нужно. Хотя, есть ещё вариант, использовать картинку в качестве бэкграунда. Создаёшь блок, в его настройках, указываешь изображение как фон, потом в этом блоке, создаёшь блок с текстом.

 

[Avalones]

Насчёт плагинов не знаю, только слайдеры позволяют такое делать. Проще создать блок со своим кодом, и с помощью css, сделать так, как тебе нужно. Хотя, есть ещё вариант, использовать картинку в качестве бэкграунда. Создаёшь блок, в его настройках, указываешь изображение как фон, потом в этом блоке, создаёшь блок с текстом.

Пробовал так, оно работает, но фон видно только по высоте текста, как только заканчивается текст фон тоже обрезается, а мне надо чтобы вся картинка была

 

[NightHunter]

Пробовал так, оно работает, но фон видно только по высоте текста, как только заканчивается текст фон тоже обрезается, а мне надо чтобы вся картинка была

Там же есть настройки фона и блока, типа во всю высоту...поиграйся

 

[Avalones]

Там же есть настройки фона и блока, типа во всю высоту...поиграйся

Спасибо, но я там все уже перепробовал, на всю высоту можно настроить только ряд, блок нельзя. А если ряд на всю высоту экрана, то это еще хуже)

P.S. Вроде Image Overlay подходит, но там тоже все сложно, надо вручную выставлять отступ от центра (потому что так оно по умолчанию) и на разных размерах экранов оно смотрится косо-криво. Может кто-то знает аддон для таких нужд

 

[Iga]

но фон видно только по высоте текста

Нужно для блока с фото задать height равную высоте картинки.
Как-то так в общем: Для просмотра ссылки Войди или Зарегистрируйся

А под конкретные разрешения уже отображение настраивать, если разваливается.

P.S. position: relative; тока лучше.

 

[EPol]

Пробовал так, оно работает, но фон видно только по высоте текста, как только заканчивается текст фон тоже обрезается, а мне надо чтобы вся картинка была

Ты задаешь фон для текста, создай div, помести в него текст, а для этого div'а уже указывай фон.

Ну или второй вариант, это использовать height (можно line-height) для текстового элемента.

Есть 3й вариант. Создай 2 дива, один с картинкой, второй с текстом, потом используй для дива с текстом position: absolute; и z-indexвыше чем у картинки)

 

[Avalones]

Ты задаешь фон для текста, создай div

Мы сейчас точно об визуальном редакторе WPBakery говорим? Я знаю как сделать это через код, но мне надо чтобы я мог каждый раз когда мне надо, добавить картинку и наложить на нее текст в нужном месте. Я ишу аддон к WPBakery чтобы можно было так сделать

 

[EPol]

Мы сейчас точно об визуальном редакторе WPBakery говорим? Я знаю как сделать это через код, но мне надо чтобы я мог каждый раз когда мне надо, добавить картинку и наложить на нее текст в нужном месте. Я ишу аддон к WPBakery чтобы можно было так сделать

А разве пользовательским кодом это не проще будет сделать? В любом случае ты можешь залезть в код и дописать стили для генерируемых элементов. Создай в пэйджбилдере два элемента, а потом через режим разработчика браузера (f12) определит для них стили, дальше уже можешь им дописать все, что хочешь.

 

[Iga]

Я знаю как сделать это через код

Тогда зачем всё усложнять какими-то лишними адонами, которые будут плодить ненужный код и запросы к php?
В WPBakery "Html вставка" туда готовый шаблон кода, подпиливаем под конкретную ситуацию - профит.