 | Раздел аккаунта "ГЕНЕРАТОР ОКОН " |
| Создание всплывающих PopOver-окон для подписки на Ваши рассылки |
|
В этом разделе мы решили предложить для владельцев
коммерческих пакетов аккаунта возможность быстро и буквально «на лету»
создавать всплывающие окна для их сайтов. Всплывающие popover-окна являются эффективным
и давно зарекомендовавшим себя инструментом для увеличения потока подписчиков
со страниц Ваших сайтов.
Суть всплывающего окна заключена в том, что помимо текста
веб-страницы Вашего сайта выпадает еще и небольшое окно, выполненное в виде
слоя. В это окно обычно интегрируется небольшой текст и форма подписки на Вашу
серию писем или почтовую рассылку. Это окно можно в любой момент закрыть, если посетителю оно
не понравится, или же он может подписаться на Вашу рассылку и затем продолжить
знакомиться с содержимым Вашей веб-страницы. Таким образом, Вы можете увеличить
количество подписчиков, попадающих в Ваш подписной лист от 3 до 5 раз!
И хоть многие говорят, что всплывающие окна это мол нехорошо и т.п., но
статистики их применения и использования на сайтах говорят совершенно об
обратном. Главное не переборщить с всплывающими окнами и ни в коем случае не
давать там тупую прямую рекламу. Напишите там соблазнительное приглашение
подписаться на ценную информацию, обозначьте основную выгоду этого предложения
и укажите сразу на кого это рассчитано. Именно так Вы добьетесь благодаря
PopOver (всплывающим) окнам наилучших результатов по привлечению подписчиков в
Ваш целевой список!
Раздел «ГЕНЕРАТОР ОКОН» состоит из трех рабочих зон, каждая
из которых выполняет свою роль в свой отрезок времени:
- Первый модуль «Настройки всплывающего
(PopOver) окна». В этом модуле Вы сначала вставляете html-код
содержимого окна, то есть то, что там внутри будет расположено, а затем
задаете все остальные настройки окна.
| Обратите
внимание! Для подготовки содержимого всплывающего окна Вы
можете предварительно воспользоваться каким-либо html-редактором.
Например, Вы можете подготовить содержимое окна в редакторе Macromedia
Dreamweaver. Если Вы интегрируете
внутрь всплывающего окна форму подписки, то обязательно сначала сгенерите
html-код формы подписки в разделе «ГЕНЕРАТОР ФОРМ», а затем уже вставляйте
этот код в html-редакторе под текстом, который приглашает подписаться на
Вашу рассылку или несколько рассылок. |
• HTML-код содержимого окна. Когда содержимое всплывающего окна
будет подготовлено Вами, включая форму подписки, то скопируйте весь
html-код содержимого окна в буфер (CTRL+C), потом перейдите в раздел
«ГЕНЕРАТОР ОКОН» и вставьте содержимое в поле «HTML-код содержимого окна»
(CTRL+V);
Остальные настройки PopOver-окна:
• Размеры окна. В этих полях Вы задаете ширину и высоту
всплывающего окна в пикселях. Если Вы выберите галочкой чекбокс «автоопр.»
(автоопределение), то тогда ширина и высота окна будут автоматически
подобраны нашей системой в соответствии с содержимым popover-окна, которое
Вы вставили в поле «HTML-код содержимого окна»;
• Стиль окна. Здесь Вы выбираете цвет фона окна, а так же толщину и
цвет окантовки всплывающего окна;
- Заголовок окна. В текстовом поле Вы можете задать надпись,
которая будет выведена в заголовке всплывающего окна. Также Вы можете
указать цвет фона и выравнивание надписи в заголовке окна.
• Шрифт заголовка. Здесь укажите название, размер, цвет и стиль
шрифта заголовка для всплывающего окна;
• Надпись кнопки "X". В этом поле задайте надпись,
которая будет отображаться внутри кнопки для мгновенного закрытия
всплывающего окна. Изначально там указан символ "X", но Вы
можете там указать «Закрыть» или что-то в этом роде;
• Эффекты кнопки "X". Здесь Вы задаете свойства для
кнопки закрытия всплывающего окна, такие как цвет самой кнопки и цвет кантика вокруг кнопки;
• Шрифт кнопки "X". Здесь укажите название, размер, цвет
и стиль шрифта кнопки для закрытия всплывающего окна;
• Шрифт внутри окна. На всякий случай Вы можете задать название, размер,
цвет и стиль шрифта внутри области всплывающего окна. Если Вы не будете
указывать конкретные шрифты при верстке содержимого окна, то тогда это
поможет задать стиль шрифта для всего содержимого popover;
• Конечное положение PopOver-окна на странице. Здесь Вы выбираете
зону, к которой будет происходить привязка расположения popover окна при
всплывании. Это может быть центр окна броузера, или же любая из его сторон
или углов. Выберите соответствующий зоне экрана радиобутон и именно там
будет располагаться окно при всплывании;
• Выравнивание содержимого PopOver-окна. А вот этими радиобутонами
Вы задаете выравнивание того, что находится внутри самого всплывающего
окна, относительно его границ. Выберите соответствующий зоне окна радиобутон
и именно туда будет смещено содержимое всплывающего окна;
• Отступ от границ страницы. В этих четырех полях Вы можете
задавать отступ в пикселях от краев окна броузера для любой из выбранных
позиций окна. Например, если Вы выбрали расположение popover-окна по
центру экрана, то смешения будут
считаться именно от центра экрана и
т.п.;
• Появление окна. Здесь Вы указываете сначала скорость с которой
будет popover-окно
выплывать из-за экрана в свою конечную позицию, а затем Вы указываете в
секундах сколько нужно подождать после загрузки содержимого страницы, на
которую интегрируется popover-окно, перед тем, как появиться. Мы
рекомендуем давать посетителю Вашей страницы какое-то время (5-10 секунд
или более), чтобы хотя бы немного ознакомиться сначала с ее содержимым
прежде, чем обратить внимание на всплывающее окно;
• Тень от окна. Если Вы хотите задать эффект отбрасываемой тени от
всплывающего окна на основное содержимое веб-страницы, то пусть данный
чекбокс будет включен. Так же, здесь Вы можете указать любой требуемый
цвет тени, которую будет отбрасывать окно, а так же размер тени в
пикселях;
• Эффект появления. Из данного списка Вы выбираете откуда и каким
образом будет всплывать окно. Это может быть выезд с указанной скоростью с
какой-то стороны экрана броузера, а может быть просто мгновенное появление
на нужном месте;
• Эффект закрытия. Помимо того, как Вы указываете то, как выпадет
окно, Вы можете в этом списке выбрать и то, как оно будет закрыто. Это
может быть отъезд окна в выбранном направлении или же его мгновенное
закрытие.
- Второй модуль «Внешний вид
всплывающего окна». Как и генератор форм, генератор всплывающих окон
отображает Вам результат в реальном времени. То есть, как только Вы
вносите любые изменения в настройках popover-окна они мгновенно
отображаются нашей системой в этом втором модуле раздела «ГЕНЕРАТОР ОКОН».
Фактически это модуль, в котором осуществляется предпросмотр того, как
выглядит popover-окно.
Если Вы заходите посмотреть как popover будет всплывать, то Вам просто
необходимо нажать на кнопку «Протестировать», которая находится внизу
второго модуля. Тут же есть чекбокс «в новом окне», который мы рекомендуем
Вам всегда держать включенным при проверке. Это позволит Вам тестировать
popover-окно в новом окне броузера и не загораживать настройки popover;
- Третий модуль «HTML-код
сгенерированного всплывающего окна». Насколько Вы понимаете, в третьем
последнем модуле Вам будет просто отображаться результат генерации popover-окна в виде html-кода, который Вам
нужно будет вставить на страничку своего сайта, а так же java-script файла, который Вам
необходимо будет сначала сохранить себе на компьютер, а затем загрузить
его в тот же каталог на хостинге, где и будет располагаться страничка с
html-кодом popover.
Итак, как только Вы настроили полностью всплывающее окно, протестировали
его и убедились, что все работает нормально, то:
• Первое действие. Выделите и скопируйте в буфер обмена html-код всплывающего
окна (CTRL+C);
• Второе действие. Перейдите в свой любимый html-редактор, откройте
там страничку Вашего сайта, на которую Вы хотите вставить всплывающее
окно. Вставьте html-код popover из буфера
обмена (CTRL+V) на html-страницу
своего сайта сразу же перед закрывающим тегом </body>;
• Третье действие. Сохраните веб-страничку сначала себе на
компьютер;
• Четвертое действие. Сохраните себе на компьютер (в ту же папку,
где хранятся все веб-странички Вашего сайта) файл popover.js из раздела «ГЕРЕРАТОР ОКОН»;
• Пятое действие. Теперь скопируйте измененную веб-страницу и файл popover.js на свой хостинг.