Создание шапки с анимацией в WordPress теме Atiframe

Автор Maksim Inshakov
Создание шапки с анимацией в WordPress теме Atiframe

так.

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

Вот — это минимум она и кнопку.

Что за программа, что поехали в принципе задачу нетривиальная сейчас мы с ней быстро справился вот добавил строку новую переноса я наверх. Сейчас замерь сколько здесь у нас отступ. И сверху до логотипа снизу кнопки 200 с копейками можем выровнять чтобы было ровно сделано маленько заполнять заряжает не вижу меня. Поэтому буду менять прям брови чтобы точное число прописать прошу здесь 180 сверху и снизу 180 такс. Теперь нужно background чтобы чтобы у нас не было белого фона под шапкой не отказалась я выберу какое — это просто любой цвет серый со слайдера вот 43 подойдёт выставлю и добавлю здесь картинку картинку фоновую я заранее подготовил. Вот она есть смотреть эта картинка здесь тренер торрент на свою подопечную тренируем. А я сделал без фона я заберу. Я потому, что здесь его можно сделать в самом получается их свойствах роллы можно добавить оверлей чтобы не быть голословной я посмотрю сколько дизайнер нарисовала. Чтобы не изобретать велосипед смотреть здесь есть тёмный фон дизайнера вот такого цвета 17 17 17 вот этот блок если она него два doubleclick делают, а здесь появляется ответ на который надо было закрашивать соответствия кстати могу его менять. Если вдруг такая нужда возникнет вот пожалуйста зелёный. Ну неважно. И вот картинка у картинки прозрачность 26 соответственно логичным предположить, что если бы сверху мы цветом эту картину прикрывали ты у нас была прозрачность 74 правильно правильно составляют цвет и ставлю здесь прозрач 74 видеть у нас в принципе тоже самое получилось картинка дали остальные свойства фона настроен без повторений позицию. Давайте центр сделаем Scroll прокручивать. Да можно в принципе кого поставить ковёр ковёр поставить так всё в принципе всё готово известно, что мы можем эту муку добавить анимацию например что-то не сильно броское скажет может быть свадебным об лучше своим Down чтобы у нас сверху уезжала допустим давай поставим 200 за. То есть 200 миллисекунд 1/5 часть секунды довольно быстро такса, что случайно надо будет сделать так добавляем. Теперь у нас есть логотипы картинка часов этим сольем где у нас вот — это там побольше, что напишу здесь WordPress фильм так не печатался не печатался да всё в порядке так добавить в принципе. Алла алиция выровнять по центру ссылку поставлен то здесь событие при клике по картинке я открыть кастомное. Ленку То есть открыть персональную ссылку посылку просто поставлю. Вот так. Вот потому, что если я пропишу адресу вот этот сайт. Димы там эти. Фрейда люди после того как себе шаблон установит импортную у них получится ссылка на мой сайт если не забуду её поменять так останется поэтому я пропишу относительный путь от просто слышу и она всегда будет ссылаться на главную страницу сайта на каком сайте она ни находилась картинки нужно сделать отступ для текста сделают примерно его 90 потому, что текст ещё свой будет доступ какой-то так не ходим не сделаю Martin t90 снизу. Теперь нужно добавить правой кнопкой нажимаю на картинке правые кнопки нажимаю и вот здесь есть изменю Element After добавляю тату, но здесь этой выборную. Фет у нас белого цвета 105 пикселей и extrabold так я его не знаю H4 наверное белый цвет 105 пикселей в принципе 105 прямые критично можно истолковать ты всё попал в тон жирный жирный она не будет потому, что потому, что в опциях тему. Я же мне не добавлял. Ну могу пойти сейчас добавить на вкладке typograph в опциях тема есть возможность подключить дополнительные парами дополнительные параметры шрифтов понесу толщину я возьму например. Ну просто чтобы резерв он не подключать ну возьму. Наталья ваш 5 поставлю он Extra Bold как интересно. А здесь есть Extra Bold italic onetwotrip футболке всё нормально. Вот так вот сделаю соответственно теперь при перезагрузке страницы от шрифт встанет жирнеет тоже здесь у него 800 толщина указано, что у нас ещё в принципе. Здесь всё верно можно ещё от в какой-то сделать свой рост есть условие отсюда досюда ещё 40 пикселей добавить например on 45 снизу поставлю добавлю кнопку снизу здесь Bottom Extreme на нём у нас. Что за проба написано почему пишется то есть не знаю с двумя н пишется или с одной поэтому куда-нибудь Google Translate сейчас забью и у меня есть плагин для английского языка называется смотреть программу для хром очень удобно расширение он сразу проверяет 31 буквы в принципе Google подсказал ошибки исправляет на Ford Focus забыл поставить. Ну неважно ссылку звёздочка. Просто теперь нужно строить собственный стиль. Так у нас белый шрифт белый шрифт 16 пикселей размером простуженный до состояния при наведении непонятно как делать если остаётся всё, что мне нужно скопировать так с Pixel background прозрачный здесь будет сделать оранжевую прозрачный заглавные буквы по центру. Всё верно такс такс такс такс Border Border здесь у нас здесь у нас также два пикселя. Кстати может у него надо посмотреть может больше.

0 комментариев
0

Читайте также