Неісчезающая форма підписки без плагіна

Номер статті: 184

Неісчезающая форма підписки без плагіна
Сьогодні пропоную вам дізнатися, як зробити внизу всіх сторінок вашого сайту незникаючу форму підписки без плагіна, або містить будь-яку іншу інформацію. Робиться все це через CSS, тобто вставимо невеликий код в файли шаблону.

Для вирішення подібних проблем багато блогери використовують сторонні плагіни і скрипти. Навіщо? Все робиться гранично швидко і кодом.

До справи. За підсумком я оформив дану смужку підписки таким чином (дивіться низ скриншота):

Неісчезающая форма підписки без плагіна

Клік для збільшення

Частина 1: вставляємо каркас

Щоб виконати вставку коду, не потрібно роками вивчати створення сайтів. Наступний код потрібно вставити прямо перед закриває тегом . На WordPress це швидше за все буде файл footer.php. На інших двигунах або html-одностранічнік: шукайте те місце, де виводиться "підвал" сайту.

Поясню що до чого (всі назви довільні):

Частина 2: вносимо правки в файл стилів CSS

Найскладніше позаду. Тепер просто описуємо властивості елементів:

Тут для класу .linefooter (це наша смужка) ми задали фіксовану позицію, не залежно від промоткі екрану. Також задали ширину в 100% (щоб врахувати будь-який дозвіл екрана) і висоту в 26px. Будь-який з параметрів можете змінювати самі (крім position). Я лише показав один із прикладів використання.

Для наших контейнерів .footbox1 і .footbox2 задано розташування / обтікання зліва і справа. Можете додавати інші параметри CSS на розсуд.

Кнопка "Закрити"

Хто дочитав - молодець. Ось вам код кнопки "Закрити", для якої не потрібно підключати ніякі скрипти або плагіни. Просто вставили і вона працює до перезавантаження сторінки:

Замість слова "Закрити" можна використовувати картинку. Вкажіть стандартний тег img з шляхом до потрібного вам зображення.

Післямова

У статті запропоновано мій варіант реалізації поставленого завдання. Той, хто володіє навичками верстки може придумати абсолютно інше рішення. Кожному своє.

Не скажу, що дана штука відразу принесла мені купу передплатників: як і раніше в день по кілька чоловік на пошту підписуються. Тут ще момент: я зробив її сірого кольору, в стиль сайту. Зазвичай подібні форми підписки роблять яскравіше, щоб відразу кинулося в очі. Пробуйте.

Тепер мої статті, де також розповідається про прикрасу форми підписки сайту:

Якщо виникнуть проблеми з налаштуванням, то не забувайте про сторінку Послуги. Виклав максимально просто. Якщо торкатися CSS, то неодноразово піднімалися на блозі теми з описом параметрів і їх застосуванням. Погортайте і знайдете.

Вітання. Мене звуть Віталік.

Віддячити Z888279575784 R109400923968 або ЯД 41001651742138

Я в Twitter @mojWP. Дивись на Youtube. Читай RSS блогу.

WP-R.ru Магазин WordPress
Преміальні плагіни і шаблони для CMS WordPress. Прокачай свій сайт. WMSN.ru Рідер RSS-стрічок
Стеж за виходом нових статей на популярних блогах вебмастер / SEO в одному місці.

Як просувати рубрику WordPress - інструкція та практичні поради щодо оптимізації. Для Вебстудіо і розробників - кілька корисних хаков для популяризації вашого бренду. Вся правда про хостинг Beget - мій відгук на його роботу і функціонал виходячи з досвіду. Як заробляти на download-трафив - ділюся своїм багаторічним досвідом і даю підказки.

Мої безкоштовні плагіни

Я використовую і раджу

SEO плагін WordPress

Рекомендую для максимальної настройки свого сайту під SEO-вимоги.

Мій надійний хостинг, перевірений за роки роботи. Рекомендую.

Схожі статті