💸 Как сделать бизнес проще, а карман толще?Как быстро создать страницу подписки?
Для тех людей, кто знаком с технологией создания страниц html или кто хоть мало-мальски разбирается в сайтостроении – такая задача не есть проблемой. Но подозреваю, что для новичков в Интернете создать статичную страницу – это архисложное задание. С чего начать? Неужели необходимо изучать html?
На это я скажу, что было бы неплохо, если бы вы понимали язык гипертекстовой разметки. Это знание пригодится вам ещё не раз. Тем не менее, у нас сейчас не курс по изучению html, задача перед нами следующая:
Как быстро создать страницу подписки?
Поэтому, если с нуля мы не умеем создавать html страницы, значит, воспользуемся уже готовыми шаблонами.
В качестве примера, возьмем мою страницу подписки для получения книги «Преврати свои мысли в источник дохода».
Для того, чтобы сделать нечто подобное и вам, скачайте вот этот архив на свой компьютер. Распакуйте его. В нем вы увидите два файла: index.html, style.css. и папку img. Для того, чтобы сделать на основе этого шаблона свою подписную страницу, вам нужно будет:
- В файле index.html заменить мой текст на свой.
- В этом же файле заменить код формы подписки.
- Заменить мои картинки в папке img на свои.
- Если есть необходимость изменить фон страницы, размер шрифтов, сделать это в файле style.css
Итак, я буду описывать, как это делается, но естественно, всех нюансов отобразить я не смогу. Вы должны понять сам принцип работы с шаблоном, понять, что, за что отвечает, и тогда вы сможете многие параметры изменять уже экспериментальным путем.
Самое первое, давайте уясним, роль документов архива. Файл index.html – это сама страница с текстом и кодом html. Папка img – папка для хранения картинок. Файл style.css – это таблица стилей. Назначение её в том, чтобы управлять кодом html.
Например, мне нужно изменить размер шрифта страницы. Как это можно сделать? Можно сделать в странице index.html, изменяя атрибуты каждой строки. А можно одним кликом в файле style.css.
Далее, папка и файлы должны размещаться на том же уровне (как в архиве), иначе вам придется менять в самом коде пути их размещения.
Qwertypay-Заработок в партнёрках!
Qwertypay – Агрегатор партнерских программ. Регистрируйся и зарабатывай!
Итак, с чего начинаем создание страницы подписки?
Открываем страницу index.html – с помощью веб редактора FrontPage, Dreamweaver или бесплатного kompozer. Поскольку дистрибутив FrontPage, Dreamweaver сравнительно большой, я думаю, что и для наших целей вполне хватит программы kompozer.
Поэтому скачиваем kompozer. (6.0 мб), русскую версию и инсталлируем.
Далее через пункт меню (File – open File) открываете файл index.html из скачанного архива subscribe.rar. Итак, страница загружена в программу и готова к редактированию. Но давайте прежде познакомимся с вкладками, которые стандартны для многих визуальных вебредакторов.
Первая вкладка Normal – здесь мы можем редактировать страницу, просто переписывая текст, изменяя размеры объектов (таблиц, картинок). Для этого нужно выделить нужный объект и, взявшись за его границы, изменить размер. До кода — доступ в этой вкладке мы не имеем. Однако нам этого пока и не надо. Вписываете свой текст, абзац за абзацем. Таким образом, у вас должна появится уже страница со своим текстом.
В общем, редактирование во вкладке Normal очень схоже с редактированием текста в Worde или с редактированием в визуальном редакторе блога. Думаю, что проблем у вас с этим не будет.
Во вкладке Normal вы можете также изменить цвет текста, размер шрифта и т.д. Замечу, однако, что в таком случае, вы не затрагиваете редактирование файла style.css. Но это вполне допустимо, так как вы имеете дело всего лишь с одной страницей, а не с многостраничным сайтом.
Тем не менее, кто знаком с каскадными таблицами стилей, вы можете изменить гиперстекстовую разметку с помощью файла style.css. Используем для этого кнопку Cascades
Здесь же на верхней панели, есть кнопки отмены предыдущих действий, так что вы всегда сможете вернуться к первоначальному варианту своего редактирования.
Итак, в принципе всю работу по подгонке шаблона под себя можно сделать во вкладке Normal
Как изменить и подставить нужные картинки? Если вас устраивает их место расположения в шаблоне, то все что вам нужно сделать это:
- вставить свою картинку в папку img.
- удалить мою картинку из шаблона.
- вставить своё изображение через пункт меню open.
Итак, у вас уже должны быть на странице новый текст и новое изображение. Скажу ещё, что в данном шаблоне картинка расположена в двухколоночной таблице. Левая колонка пустая. Это значит, что вы можете, при необходимости вписать в неё свой текст, при этом изображение с центра подвинется вправо. Или наоборот, вы можете картинку разместить в левом столбце, а правый заполнить текстом.
Если выделить объект и кликнуть по нему правой кнопкой мыши, то откроется выпадающее меню, для редактирования свойств объектов. В общем, это вам пригодится, если вы захотите поработать с шаблоном на более глубоком уровне. Если нет такой необходимости, оставляйте все как есть, просто заменяя информацию страницы на свою.
Вторая вкладка HTML TAGS – вряд ли вам пригодится на данном этапе знакомства с редактированием шаблона. Здесь вы визуально увидите имеющиеся в шаблоне теги, которым можно прописывать свои атрибуты.
Третья вкладка Source – нам понадобится для изменения кода формы подписки. Находим код начинающийся строкой <!-- SmartResponder.ru subscribe form code (begin) --> и заканчивающийся <!-- SmartResponder.ru subscribe form code (end) -->
Начало этого кода на 85 строке и окончание на 165. Вместо него вбиваете код своей формы подписки, который можно получить в своем аккаунте сервиса Смартреспондер.
Здесь же в Source меняем внешние ссылки, а также значения description, keywords. Прописываете новый title для своей страницы. Это строки 4,9 и 11.
Скажу, что просмотр кода в этой вкладке несколько неудобен, мал размером (издержки бесплатности). Поэтому для просмотра кода можете воспользоваться обыкновенным блокнотом или Notepad++. Тем не менее, все можно сделать и в komposer.
Как изменить фон цвет фона страницы? Открываете Cascades – вкладку background , кликаете на тег body, изменяете цвет, кликаете ok!.
Здесь же можно изменить размеры заголовков и т.д. Одним словом – экспериментируйте и изучайте. Все ваши действия будут отображаться в окне Normal.
Последняя вкладка – это вид вашей страницы в Мазиле, как она будет предоставлена в Firefox. Итак, сделав все необходимые изменения, сохраняете и проверяете страницу, как она смотрится в других вебраузерах. Вот и вся суть работы по подгонке шаблона под себя.
Если вы обратили внимание, подписка на аудио курс «Прибыльный блог» сделана точно также, как и эта, о которой шла только что речь. (P.S. Когда-то была... Сейчас другая.)
Итак, когда вы подогнали шаблон под себя, у вас должны быть все те же: файлы index.html, style.css и папка img.
Теперь вам нужно создать ещё одну папку, например, subscribe и перенести все свои три документа в эту папку. Затем закачать папку subscribe на сервер.
Ваша страница подписки должна открываться по ссылке https://vashsite/subscribe/ или https://vashsite/subscribe/index.html
В заключение скажу, что по такому же принципу редактируется любой другой шаблон подписки. Где его взять? Можно найти любую страницу подписки в Интернете, сохранить её на компьютер и затем заняться её редактированием, удаляя ненужные вам элементы, создавая свои, изменяя текст и т.п.
Ещё один вариант создания сногсшибательных страниц подписки — это приобрести так называемый "УДАРНЫЙ ПАКЕТ ГРАФИКИ". В вашем распоряжении будут десятки шаблонов-страниц, с великолепным дизайном, готовые элементы, графика.
Ну а саму рассылку можно создать на сервисе Смартреспондер
Бесплатная регистрация. Бесплатный аккаунт до 1000 подписчиков!
Автор: Игорь
Чистый звук в мире инфобизнеса
Игорь, расскажите, пожалуйста, как работать с сервисом Смартреспондер!!!
Пока на блоге нет информации об этом, мой совет, воспользоваться серией видеоуроков «Быстрый старт», которые есть в аккаунте Смартреспондера. Их вполне достаточно, чтобы понять принцип работы с сервисом.
Очень хорошо,что есть сайт, где всё написано доступным человеческим языком, понятным новичку.На большинстве сайтов, где что-то объясняют касающееся различных дополнительных фишек для расширения возможностей блога, человеку, несведущему в веб дизайне нечего делать.Он там всё равно ничего не поймёт.Большое спасибо Вам за отличные и понятные советы!
Для новичков все равно тяжко будет. Кто пытался обучать компьютерной грамотности старшее поколение, тот знает)
Было бы желание, нет ничего невозможного, в противном случае, такой человек сразу по определению — аутсайдер.
Отличная статья. Все просто и подробно.
Спасибо за подробности.Очень полезная статья.
Спасибо за статью,мне она как раз нужна.Открыла свой блог,вот ссылка:zdorblog.blogspot.com,школа выживания,заходите.
Для blogspot.com, вряд ли подойдут мои рекомендации, нужен автономный движок.
Для меня пока сложно в этом разбираться, но к этому надо идти, иначе никак. Придется многому научиться.
Спасибо... идеально
всё что нужно в данный момент...
Ещё раз огромное спасибо
Радости и успехов Вам......
С уважением.Ави.
Спасибо Вам огромное!
Именно то, что нужно.
Доступно и понятно. Отличная статья!
Примите мою благодарность!
Как в kompozer вставить видео, не используя код HTML (.flv)?
Не получится без кода. Любое видео — это код плеера и ссылки на местопребывание файла.
Но, если вы спрашиваете о том, есть ли кнопка вставить видео, на подобие «Вставить изображение», в той версии программы, что у меня, я её не нашел.
Я бы рекомендовал бы вставить код видео из You Tube или из другого видео сервиса, чем подгружать видео из своего хостинга.
Здравствуйте! Подскажите пожалуйста,как готовую страницу из kompozer вывести в интернет (залить на хостинг),какие следующие действия,что нужно для этого,только хостинг или обязательно программа Ftp?Уже копаюсь неделю никто конкретных ответов не дает,отвечают коротко и не понятно.
Её нужно сохранить отдельным файлом на компьютере. Затем через ftp-клиент (программу) закачать на хостинг. ftp-клиент открывает доступ к хостингу через протокол ftp. То есть вы можете зайти на хостинг и увидеть его изнутри, как на компьютере видите свои папки и файлы.
Но, эту процедуру, закачивание — можно сделать и через встроенный менеджер на самом хостинге. Просто через ftp-клиент делать проще. Вы работаете у себя на компьютере, не переходя на сайт хостера.
Процедура простая, нужно просто ftp-клиенту дать доступ на хостинг, указав свой пароль, логин и домен.
Теперь вам нужно создать ещё одну папку и перенести все свои три документа(файлы index.html, style.css и папка img) в эту папку.
Вопрос — какую папку создать. Как для текстовых документов или zip. Уточните, пожалуйста.
И как прописать дорогу к этой папке. А то я чего-то залила на сервер, а в баннер в сайдбаре не знаю, что написать.
Можно и не создавать, если правки были в папке subscribe. Её закачиваете на сервер. Тогда ваша подписная страница будет ваш сайт/subscribe
Или переименовываете её. Не суть. Важно, чтобы ваши отредактированные файлы index.html, папка img и style. css были в одной этой папке, которая будет закачана на хостинг в корневую папку. Дорогу прописывать не надо. Как только вы в адресной строке наберете ваш сайт/subscribe (если папка subscribe) вы должны попасть на страницу index.html
Здравствуй Игорь.
ПОдскажите с проблемой. Окно выпрыгивает, когда надо.
Но не отправляется подписка. Перекидыает на сервис, в котором генерировали код, и выдает ошибку, что не заполнено поле е-мейл.
Как побороть сию проблему?
Если вы о форме подписки на svet102, то там все правильно сделано. Все работает. Нужно вводить имя и емейл, потом жать на «подписаться». Если вы говорите о другой проблеме, то уточните.
Игорь, я вижу анонсы твоих статей теперь не через Фитбернер? Понимаю, что всех подписчиков надо собрать на Смартреспондер.Эта возможность доступна только платно? Голову ломаю... подписчики и Фит-ре и в Смарт-ре. Как навести порядок в списках? Как управлять? Тупик какой-то наступил. Может подскажешь что-то дельное.
Это два разных списка. Фидбернер — подписчики блога, получают все анонсы блога, а Смарт — это подписчики определенной рассылки, например «Прибыльный блог». Первые получают анонс автоматически, вторые — когда я захочу и необязательно все анонсы. Например, статью по рерайтингу я не буду отправлять подписчикам «прибыльного блога» и наоборот, подписчики рассылки «преврати свои мысли в источник дохода» — не получат моей статьи по блоггингу. Я считаю, что она им не нужна, поэтому не буду отправлять таковую. В общем такая чехарда получается ))
😳 Игорь, хельпь!!! НЕ открывается у меня по ссылке для проверки ничего(( страница не найдена 😎 Делал всё кропотливо и внимательно! Хельпь!!!
Что именно не открывается? У меня открывается ваша страница подписки. «Умная хозяйка», красиво сделано. Уберите пробел в адресе страницы. И немножко форму подписки можно подправить. Но для первого раза, хорошо.
Игорь, захотелось создать свою подписную страницу, а программа kompozer не скачивается: закончился срок хранения. 😥
Подскажете ссылочку, где взять? Или почтой архив пришлете? 😀
kompozer.net — официальный сайт. Там есть русская версия.
К моему огорчению не нашла русской версии.
Но спасибо и за английскую, Игорь. Немножко понимаю. 😀
Есть русская. Но эта программа несложная, тем более у меня в статье, как раз для английской написано.
Игорь, Вы пишете: «...Думаю, что проблем у вас с этим не будет. Если же есть, тогда вам нужен курс Античайник, чтобы ликвидировать свою компьютерную безграмотность...» 😮
Если можно, поясните, пожалуйста, как курс Дмитрия Комарова по заработку на YouTube сможет ликвидировать мою компьютерную неграмотность?
Дмитрий, сменил курс, а ссылка у Вас на предыдущий? 😀
Никак не может курс Дмитрия Комарова ликвидировать компьютерную безграмотность. Это я ошибся. Раньше у меня стояла ссылка на Античайник, но я с этой партнеркой уже не работаю. Решил изменить, а вместо переадресации на курс «с компьютером за 1 день», поставил не ту ссылку, получилось что на Комарова. Сейчас изменил. Спасибо, Галина, что обнаружили это. А то, действительно, казус получается.
Да уж, еще какой казус. 😛 Но Вы же в этом не виноваты.
Пожалуйста, Игорь, люди же должны помогать друг другу?
Вы нам про страницу подписки рассказали, а мы не упустили возможность и Вам приятное сделать.
Кстати, спасибо Вам за статью.
Благодаря ей я поняла, что могу взять подписную страничку ЛЮБОГО автора и переделать под себя. Есть такие форматы, что очень нравятся.
А Автор не будет претензии предъявлять, если свой экслюзив узнает в чужой подписке?
Правильно поняли, Галина. Любую страницу можно взять и переделать. Так и делают, когда продают всевозможные шаблоны.
Вряд ли автор будет предъявлять претензии, так как на вашей странице должна быть ваша картинка, ваш текст, а в верстку, кто заглядывает. И разве на верстку есть права? Или разве фрилансеры не пользуются готовыми шаблонами. Редко кто верстает страницу с нуля. Дорогое удовольствие.
Как минимум, идеи можно почерпнуть на других страницах и заглянув в код, увидеть их реализацию.
Игорь, добрый день! Меня очень заинтересовала Ваша деятельность, подскажите как с Вами связаться. Или напишите мне на почту. Благодарю)
Через форму обратной связи ))