Как сделать лендинг с админкой

21.03.202319.04.2023 admin 0 Комментариев

ТОП-6 лучших CMS для лендинга

Главная задача лендинга – лидогенерация. Посадочные страницы используются для сбора контактов целевой аудитории, усиления эффективности рекламы и конвертации посетителя в реального клиента. В отличие от полноценного сайта лендинг максимально прост и лаконичен. Поэтому при его создании стараются минимизировать затраты, используя легкие и доступные CMS и конструкторы сайтов.

Классические CMS предлагают пользователям широкие функции, множество настроек, удобную организацию работы с сайтом и так далее. Также они зачастую бесплатны. Но не каждый новичок сможет разобраться в движке и быстро создать с его помощью лендинг. В этом случае на помощь приходят конструкторы сайтов – специальные сервисы для создания веб-страниц без навыков программирования. Они максимально упрощены, включают минимум необходимых модулей и визуальный редактор, однако предлагают скудные функции и однотипные шаблоны.

Сегодня мы рассмотрим лучшие системы для создания лендингов – 3 классические CMS и 3 конструктора сайтов.

Классические CMS

1. WordPress

WordPress – это самый популярный движок для создания сайтов в мире. При этом он совершенно бесплатный, от вас потребуется оплатить только домен и хостинг. Около трети сайтов всемирной паутины работают на этой CMS: блоги, новостные порталы и, конечно же, лендинги.

Для создания посадочных страниц можно использовать специальные бесплатные шаблоны. Разумеется, можете прописать стили вручную, но готовый шаблон намного проще настроить под любой проект. Останется лишь загрузить изображения и другие файлы, подготовить тексты, вставить нужные формы и указать контакты – лендинг готов к сбору заявок.

Если коснуться недостатков, то бесплатная CMS в первую очередь расплачивается за свою популярность. Сайты на WordPress часто становятся целью многих злоумышленников. Также движок достаточно требователен к ресурсам хостинга и может испытывать дефицит возможностей «из коробки» (скорее всего, потребуются различные плагины).

2. 1С-Битрикс

1С-Битрикс – это наиболее популярная платная CMS в России. Если видите сайт на платном движке, то в половине случаев это 1С-Битрикс. Система идеально подходит для создания небольших сайтов, например, визиток или лендингов. Можно выбрать готовое решение, а затем довести его до нужного состояния, или создать сайт с нуля с помощью специального конструктора буквально за несколько часов.

Стоимость использования движка – от 5,4 тыс. рублей. Вам доступно 5 тарифов. Если не хотите ограничений в количестве создаваемых сайтов (для лендингов это может быть важно) – используйте тариф «Стандарт» (15,9 тыс. рублей).

3. Joomla

Joomla является второй по популярности бесплатной CMS (после WordPress). Однако по сравнению со своим прямым конкурентом – это более сложный движок. С другой стороны, функциональность «из коробки» несравнимо богаче, поэтому не придется устанавливать массу дополнительных плагинов для реализации своих задумок. На Joomla удобно создавать небольшие сайты информационного характера, например, лендинги.

Несмотря на бесплатное использование, Joomla на порядок сложнее и запутаннее WordPress. Вполне возможно, потребуется специальная инструкция для создания сайта. Также движок требователен к ресурсам хостинга.

Квиз-лендинги и конструкторы, примеры и шаблоны

Квиз-лендинги – всевозможные опросники и тесты – помогают вовлечь пользователя, улучшить поведенческие факторы или узнать нужды потенциального клиента. Кто может пройти мимо призыва узнать о себе что-то новое?

Конструкторы лендингов

4. Tilda

Tilda – это один из самых популярных конструкторов сайтов. С его помощью вы сможете без лишних усилий создать хороший лендинг. Конструктор сфокусирован на типографике и визуализации контента. Благодаря этому посадочная страница будет отлично привлекать клиентов. Также для такого типа сайтов в конструкторе есть специальные блоки: отзывы, призывы к действию, преимущества, кнопки и другие. Сбор данных можно вести через 12 различных сервисов

Конструктор можно использовать бесплатно, но с ограничениями в блоках, без подключения своего домена, аналитики, SEO и других возможностей системы. Для простейших лендингов этого вполне достаточно. Тем не менее, платные тарифы от 500 рублей/месяц открывают широкие возможности для создания качественных лендингов, которые привлекут больше клиентов.

5. Ukit

Ukit – еще один конструктор сайтов, который не требует навыков программирования. Выбираете шаблон, редактируете его, добавляете свою информацию и контакты – лендинг готов к приему заявок. Для продвижения достаточно следовать встроенному инструментарию, который подскажет, что и в каком порядке надо сделать. А благодаря «Индексу готовности» сможете увидеть, готов ли сайт к работе.

Стоимость использования конструктора – от 2,5 долларов в месяц. Всего доступно 4 тарифных плана, однако для создания простейших лендингов достаточно и самого дешевого. На нем будут не доступны цели в статистике, интернет-магазин, вставка собственного кода и создание собственных палитр.

6. Wix

Wix – это простой конструктор сайтов, в котором можете создать лендинг с нуля или при помощи любого из 500+ шаблонов. При создании страницы применяется метод drag’n’drop – перетаскиваете любые элементы сайта, просто зажав кнопку мыши. Оживить лендинг помогут фоновые видео, анимация, параллакс и другие эффекты. Если разбираетесь в программировании, то открытая платформа для разработчиков Corvid позволит существенно расширить функции конструктора.

Вы можете использовать шаблоны, создавать страницы и размещать лендинги на хостинге совершенно бесплатно. Премиум-планы необходимы для расширения возможностей – например, увеличения объема диска, пропускной способности, подключения домена и так далее.

Итак, мы рассмотрели различные системы для создания лендингов – классические CMS и конструкторы сайтов, бесплатные и коммерческие решения. Какой из них выбрать – зависит от располагаемого бюджета и целей, а также ваших возможностей. Создать сайт с нуля на CMS сложнее, но он будет более функциональным. Конструкторы намного проще, но с течением времени могут обходиться дороже, чем сайты на движках – ведь для них достаточно приобрести домен и хостинг.

Источник

Как сделать админку для лендинга

Когда лендингу нужна админка

Рано или поздно возникает необходимость в правках на сайте: сменился телефон, адрес, цены. данные устарели и их необходимо актуализировать. Чтобы каждый раз не искать новых фрилансеров для правок, можно сделать за один раз необходимую административную панель: по логину и паролю вы входите в кабинет с настройками своего сайта и сможете сменить любые (заранее предопределенные) данные.

Уверен, многое владельцы лендингов мечтают о такой возможности, не обладая необходимыми знаниями в редактировании html кода, умением работать с файловым менеджером на хостинге или по FTP. Да и вебмастера, пожалуй, не раз слышали от своих клиентов о необходимости внедрения в лендинг административной панели! Многие автоматически, не заморачиваясь, сразу же предлагают прикрутить лендинг к какой-либо распространенной cms (Joomla или WordPress), хотя на практике, делов там на 10-15 минут! Как же создать лендинг с административной панелью (админкой)?

Делаем админку для лендинга

Авторизация и кабинет администратора

Для начала нам необходимо создать кабинет, в котором администратор сайта сможет авторизоваться. Для этого открываем новую папку на хостинге в корне сайта admin и в ней два файла pass.php и index.php. Содержимое файла pass.php будет выглядеть следующим образом (содержать ваш логин и пароль для авторизации):

Содержимое файла index.php, в котором будет осуществляться авторизация администратора:

Итак, после удачной авторизации, администратор увидит элемент textarea, с содержимым файла настроек «../config/config.ini» и возможностью их отредактировать. После внесения необходимых правок, он может выйти из кабинета, нажав на ссылку ВЫЙТИ.

Файл настроек

Создадим папку config в корне сайта и в ней два файла .htaccess и config.ini В .htaccess запретим внешний доступ к файлу config.ini, хотя это и необязательно, ведь в нем не будет секретных сведений:

И в файле настроек config.ini мы должны описать переменные, которые хотим изменять на сайте, для примера я приведу самые динамичные:

Переменные на сайте

Теперь в необходимых местах сайта, мы можем вывести значения переменных. Наши цены из файла настроек будут выглядеть так:

Вместо телефонов на сайте пишем:

Вместо адреса электронной почты

Вместо физического адреса:

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

Специализируюсь на безопасности сайтов: защищаю сайты от атак и взломов, занимаюсь лечением вирусов на сайтах и профилактикой.

Наверняка у Вас есть вопросы, просьбы или пожелания. Не стесняйтесь спросить, я отвечаю всегда быстро.

Источник

Инструкция по установке и настройке лендинга

Для установки лендинга нужен хостинг и домен:

Как установить лендинг на хостинг

Настройка лендинга

На наших лендингах мы используем админ-панели двух типов: aPanel и Textolite.

Если на вашем лендинге установлена админка aPanel, то, как правило, там есть и визуальный редактор Textolite. Сначала заходим в aPanel — там можно перейти в Textolite.

Textolite — это визуальный редактор, с помощью которого можно менять видимый текст в лендинге. Если нужно редактировать невидимый текст, просто выберите режим редактирования HTML/PHP и найдите в тексте нужный фрагмент. Можно использовать поиск по тексту CTRL+F5.

Просмотрите небольшое видео и убедитесь, насколько удобно редактировать лендинг через визуальный редактор Textolite.

Как редактировать исходный код в лендинге

Для редактирования заголовков (title, h1, description) и других элементов необходимо использовать режим редактирования кода HTML/PHP в Textolite. Также можно редактировать файлы сразу на хостинге.

Если вам нужно поменять телефон на сайте, то нажимаете горячие клавиши CTR+F (поиск) и вводите в строку поиска то, что хотите изменить: +7 (915) 575-42-07. Можно искать фрагментами, чтобы не вводить полную фразу. Вместо исходного номера телефона нужно вписать свой и сохранить файл. Таким же образом меняются все тексты на сайте. В данном режиме нужно быть внимательным, чтобы не удалить лишнее.

Важно! Если редактируете исходный код, проверьте, не установлено ли в вашем браузере расширение для автоматического онлайн перевода страниц. Данное расширение может поломать код.

Где указать почту в лендинге, если у вас Textolite

Для того чтобы заявки с лендинга приходили на ваш почтовый ящик, вам необходимо указать ваш E-Mail в файле call.php, post.php, send.php, mail.php или в другом похожем (зависит от вида сайта). Для админки aPanel почта указывается в админке — в интеграциях.

Если заявки с лендинга не приходят на почту

Если вы все сделали согласно инструкции, а заявка не пришла на вашу почту, следуйте следующим рекомендациям:

Если сайт выдает ошибку «Нет индексного файла», выберите в панели управления:

WWW — WWW домены — выберите ваш домен — сверху кнопка Изменить — Строчка индексная страница: добавьте через пробел index.htm — «Сохранить».

Как заменить изображения на лендинге

Изображения лучше заменить на компьютере или на самом хостинге.

После внесения любых правок (перед проверкой изменений на сайте) не забудьте удалить кеш в браузере (в настройках или комбинацией клавиш CTRL+F5) или проверяйте лендинг в режиме «Инкогнито».

Как вставить любой код в лендинг

Если вам нужно вставить код в лендинг (например, от Яндекс.Метрики, рекламный код, скрипты, код для квиза Marquiz и т.д.) воспользуйтесь визуальным редактором. В режиме HTML/PHP найдите тег и перед этой строкой вставьте нужный код.

Спасибо за прочтение! Желаем Вам как можно больше заказов!

Источник

Nest Admin — панель управления для сайтов (landing page)

Панель подключается легко, работает на PHP и JavaScript. Не требует базы данных. Все что вам надо, это залить свой проект в папку с Nest и вмонтировать в ваш сайт скрипт. Дальше нужно все поместить на PHP сервер. Открыть панель, панель обращается к любим элементам на странице по id, классу, тегу.

Nest, не переписывает страницу, он сохраняет данные в формате json и при загрузке страницы их монтирует на нужное место в DOM дерево. Это сделано для того чтобы минимизировать сложность интеграции и ошибки. id нужно писать с решеткой #id, class c точкой.

Процесс подключения панели Nest к шаблону страницы

Идеальный условия для использования Nest Admin

У вас есть заказ, создать простой, но красивый landing page, и чтобы пользователь сам мог его обновлять.
Бюджет заказа небольшой, и следовательно, писать панель администратора, даже простую с нуля, не вкладываться в суму и сроки.

Лучший вариант использовать CMS, типа WordPress, но есть тут одна проблема, в CMS очень много лишнего, в контексте данной задачи. Ковыряться в шаблонах CMS чтобы подогнать их под креативный, специфический дизайн, получиться дольше, нежели самому сделать шаблон.

В таких случаях поможет панель типа Nest. Вы делаете шаблон, как душе угодно, подключаете скрипт в те страницы, которые будут управляться и к блокам что будут под управлениям Nest. Задаете семантические и логически понятные id, типа header, content, footer, logo. Именно по ним Нест будет ориентироваться.

Читают сейчас

Редакторский дайджест

Присылаем лучшие статьи раз в месяц

Скоро на этот адрес придет письмо. Подтвердите подписку, если всё в силе.

Средняя зарплата в IT

AdBlock похитил этот баннер, но баннеры не зубы — отрастут

Минуточку внимания

Комментарии 34

У вас в требованиях указан PHP сервер (кстати, зачем?), почему бы тогда не организовать авторизацию средствами PHP?

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

но чтобы шаблон был один у всех

почти любая — это огромная куча файлов и ненужного функционала
95% сайтов — это обычные визитки, состоящие из: главная, контакт, impressum, agb
4 главных пункта + 1 пункт по продукту или еще 2-3 страницы в подменю

важно быстро менять текст в текстовых блоках шаблона без знания хтмл

беда всех цмс в том, что их визуальный редактор не показывает разметку как она будет выглядеть потом на странице с применением стилей к всяким псевдокодам в квадратных скобках или как там оно называется

поэтому вот такие редакторы и появились https://habrahabr.ru/company/textolite/blog/241399/

всем бы хорош, но я так и не понял, как там делать мультиязычный и чтобы шаблон был один и тот же

Добавлю еще немножко: Ребята, вы конечно молодцы, что решили создавать opensource проект, но ваш проект плох во всем. Он плох с точки зрения безопасности, он плох с точки зрения кода, ну можно было бы перед тем, как публиковать проект, хотя бы форматирование кода сделать, весь js запаковать в один файл и убрать исходники сторонних библиотек. Я так и не понял что дает ваша CMS кгмммм… редактированием одной страницы через CKEDITOR?

У вас инструкция по установке занимает гораздо больше места, чем описание возможностей.

В целом такой подход может быть успешно использован для статичных небольших сайтов, для лендингов, как вы и предлагаете. Но только в том случае, если верстка не будет в будущем изменяться. Даже при небольших изменениях верстки есть неплохой шанс, что селекторы поменяются и какие то изменения отвалятся. Искать и восстанавливать контент из JSON файла будет еще тем удовольствием.

Безопасность надо править, то что у вас в save.php совершенно недопустимо.

Комментарий для развития — выбросить и набраться опыта работы с чужими движками. Нормальными.
Или присоединиться к нормальным разработкам.
Неприемлимо.
От слова совсем.
1 — обещанной простоты нет. Да, у нас нет базы, но мы кучу телодвижений делаем, которых на норм ЦМС не нужны.
2 — одна.сплошная.дыра. И нет, ЭТО не правится. У меня в простенькой ЦМС (тоже «убийца вордпресса») класса три или четыре отвечают за простейшие вопросы безопасности. Если вы закроете этот ляп с публично известным паролем и проверкой пароля в браузере, то дальше вас встретит… ну например XSRF. А потом различные инъекции. И так далее.
3 — полученная страница будет паскудно индексироваться ибо как я понял собирается в ЖС а не на бекэнде.
4 — не вынесены отдельно зависимости, композер тут для галочки «и вообще». Сюда-же — почитайте про стандарты оформления кода, да хоть PSR.
5 — плохо оформлено и задокументированно. Демки нет, документация отстает от текущей версии и т.п. Ну это у всех бывает, у меня еще хуже, но я пока боюсь в паблик выкатывать)
Вообще продолжать можно много. Но к счастью на написание этого вы потратили часа полтора, так что пожалуй остановлюсь)
Из хорошего:
1 — узнал для себя OrnaJS. Пока не колупал, но выглядит забавно.
2 — вы молодец что сразу в паблик) Да, поделку свою оценили выше чем она того стоит, но при этом считая что это код а не мусор — выложили в паблик. Это хорошо.

ПС: Еще раз повторюсь — найдите себе наставника. Вашу бы энергию…
ППС: походу я один плюс поставил?

ППС: походу я один плюс поставил?

2 — вы молодец что сразу в паблик) Да, поделку свою оценили выше чем она того стоит, но при этом считая что это код а не мусор — выложили в паблик. Это хорошо.

Вот я год назад хотел опубликовать пример своего «убийцы вордпресса» (несколько тысяч строк кода, несколько интересных решений), часа 4 сочинял описание, а когда уже всё было готово — перечитал текст, посмотрел ещё раз примеры исходного кода и понял что не готово моё творение для хабра… Сейчас тот код почти полностью переписан под 7ю версию php и на нём уже работают пару сайтов, но я всё же не решаюсь пока хвастаться…

Быть может на новый год напьюсь и наберусь смелости =)

P.S я даже вместо CKeditor свой собственный WYSIWYG-редактор запилил…

Источник

Как настроить или установить

Как сделать лендинг с админкой