У попередньому уроці ми розповіли, як створити красиву і унікальну форму підписки на кожній сторінці. Тепер її потрібно вставити на сайт і прив'язати до сервісу розсилок. Про це і піде мова.
Зовнішній вигляд
Тепер необхідно трохи попрацювати над зовнішнім виглядом форми. В першу чергу вкажемо її розміри і додамо фон. Після останніх лапок, але перед символом> вставляємо тег style і вказуємо його атрибути. Наприклад: поставимо ширину 250 пікселів, висоту 450, а колір фону світло-блакитний.
Тепер наш код виглядає наступним чином:
Зверніть увагу, колір зазвичай задається в шістнадцятковому форматі. Дізнатися код кольору можна в програмі Photoshop, натиснувши інструментом «піпетка» на вподобаному кольорі, а потім на квадратику активного кольору в нижній частині бічної панелі. У вікні внизу після символу # і буде цей код.
Текст-заклик
Далі йде наш текст-заклик передплатити розсилку. Просто поставимо його в тег заголовка і вирівняємо по центру форми:
Підпишись на розсилку
При бажанні можна також змінити шрифт, колір, розмір тексту.
оформляємо поля
Для вирівнювання поля на середину форми в цьому прикладі був використаний тег left зі значенням 40. Це означає, що лівий край поля для введення розташований в 40 пікселах від краю всієї форми. Ваша форма буде іншого розміру, тому і значення цього параметра Вам знадобиться інше.
зробити кнопку
Назва, очевидно, Ви можете поставити те, яке більше подобається. Також для всіх елементів можна поставити і інші елементи дизайну - поля, відступи, товщину рамки і багато іншого.
На завершення не забуваємо поставити закриває тег нашої форми:
Вид нашого коду
Після всіх цих нескладних дій наш код придбав ось такий вигляд:
Підпишись на розсилку
Розміщуємо код на сайт
Залишилося тільки помістити нашу форму підписки на сайт. Для цього заходимо в панель управління WordPress і вибираємо в меню «віджети». Знаходьте там віджет «текст» і перетаскуєте в те місце, куди хочете помістити форму передплати. Потім потрібно скопіювати код, що і вставити його в текстове поле віджета. І ось, форма підписки з'явилася на сайті.
Правда, скористатися їй поки не можна. Тому, як прив'язати форму підписки до сервісу Smartresponder, присвячений наступний урок.
Якщо Ви бажаєте розвивати свій сайт за спеціально розробленою для цього програмою, станьте студентом нашого Тренінг-Центру.
Діліться інформацією з друзями.
Якщо ви знайшли помилку, то виділіть її та натисніть клавіші Shift + Enter або натисніть сюди. щоб проінформувати нас.