Skip to content

Fix_Template: передача media-параметров

US - us - Boneless Sofa quiz v1

image.png

Выбираем пункт “manage landing”

image.png

Режим “Split” для одновременного просмотра кода и визуальной части

В дальнейшем можно продолжать работу в режиме Visual, но сейчас рассмотрим этот вариант, чтоб увидеть как отображается на коде замена элемента

image.png

На визуальной части выбираем элемент, который нужно заменить и прожимаем его - автоматически в коде подсвечивается путь к выбранному элементу

image.png

Прожимаем элемент еще раз и выбираем “Edit image”

telegram-cloud-photo-size-2-5314729872699625236-x.jpg

Выбираем подгрузку с ПК

telegram-cloud-photo-size-2-5314729872699625238-w.jpg

Выбираем нужный media-элемент и подгружаем его

telegram-cloud-photo-size-2-5314729872699625249-w.jpg

telegram-cloud-photo-size-2-5314729872699625259-w.jpg

Готово, новый элемент отображается, “хвост” в пути к картинке изменился (обращаем на это внимание для самопроверки) - фото подгружено успешно ✅

telegram-cloud-photo-size-2-5314729872699625264-w.jpg

По такому же принципу продолжаем работу ( можно в режиме Visual, как удобнее)

Заменим фотографию на ледне (алгоритм действий повторяется)

image.png

image.png

image.png

image.png

image.png

Замена скрытых media-элементов, передающихся на оффер

Вводим в поисковик по коду сommand+F - “Hidden element”, для того чтоб быстрее добраться до фрагмента, который хранит в себе нужные нам фото

image.png

Общий вид фргамента:

image.png

Обращаемся в конец пути нужного фото, в данном случае, productName и заменяем в style = “display: none” на style = “display: block”

telegram-cloud-photo-size-2-5314729872699625989-x.jpg

telegram-cloud-photo-size-2-5314729872699625990-y.jpg

В режиме Split начнет отображаться фото, которое подтягивается на оффер - prize.jpg, по такому же принципу заменяем его на нужное

telegram-cloud-photo-size-2-5314729872699625994-w.jpg

image.png

image.png

telegram-cloud-photo-size-2-5314729872699626002-w.jpg

telegram-cloud-photo-size-2-5314729872699626003-w.jpg

image.png

После смены картинки снова обращаемся в конец пути и заменяем style = “display: block” на style = “display: none” и сохранить изменения

image.png