Позвольте клиентам обновлять их сайты на лету
Сегодня мы собираемся изучить, как настроить веб-сайт, который может быть легко отредактирован через Ваш iPhone и мобильное приложение thePagelime. Pagelime - это невероятно удобное приложение в работе СМS, которое делает процесс редактирования веб-сайта настолько легким, насколько это возможно.
Основы Pagelime
Pagelime уникален в том, что он позволяет вам проектировать и кодить свой веб-сайт сначала в простом HTML, а потом добавлять Pagelime CSS, что по сути завершает процесс создания страницы. Как только ваш сайт закончен, вы можете просто добавить класс “class=cms-editable” к тем элементам, которые в будущем намереваетесь редактировать. Об остальном позаботится Pagelime.
Пример использования
Для этой статьи я и возможно вы являемся веб-дизайнером, который делает веб-сайты для местных фирм, юридических фирм, ресторанов, и т.д. Таким образом, у нас уже есть опыт работы и 6-7 готовых сайтов.
Я решил использовать Pagelime, потому что мой клиент не часто хочет изменять содержимое, но когда он это делает (давайте назовем его Поваром Тони), то желает быть полностью независимым от меня. Дело в том, что мне пришлось побороться за этот заказ с другими конкурентами и выиграл я как раз на том, что предложил Тони редактировать содержимое его страниц через iPhone. Само собой, Тони был впечатлен. Это происходит редко!
Углубляемся в тему!
На домашней странице нашего шаблона мы можем видеть, что есть довольно много областей на странице, который я хотел бы сделать редактируемыми.
Вот пример сообщения о приветствии:
<div class="headingrow"> <h1>Welcome to our website</h1> <p>Lorem ipsum dolor sit…</p> </div>
Тег p сделаем редактируемым через Pagelime. Поскольку мы используем мобильное приложение, то давайте добавим атрибут title.
<p id="welcome" class="cms-editable" title="Welcome Text">Lorem ipsum dolor sit…</p>
Следующая часть:
<div class="subheadingrow"> <h2>Employee of the month - Jenny Smith</h2> <img class="leftalign"src="/images/home-image-sample1.gif" alt="" /> <p>Tasty and fullfiling, … </p> </div>
Заголовки в основном контенте тоже должны быть редактируемыми.
<h2 id="eomtitle" class="cms-editable" title="EOM Headline">Employee of the month - Jenny Smith</h2> <img id="eomimg" class="leftalign cms-editable" title="EOM Image" src="/images/home-image-sample1.gif" alt="" /> <p id="eomtext" class="cms-editable" title="EOM Text">Tasty and fullfiling, … </p>
В конце концов, сделаем редактируемым и изображение:
<img id="changer" class="cms-editable" title="Changing Image" src="/images/changer.png" />
Это не затрагивает дизайн сайта и его реализацию. Теперь, если мы откроем веб-приложение в Pagelime, то увидем следующий результат:
После этого я представил первую версию сайта заказчику. После того, как мы установили ему мобильное приложение Pagelime, он без труда заходил в систему с помощью своего email и пароля и видел следующее:
Он мог отредактировать сайт, управлять изображениями, документами, видами, использовать инструменты Google, и даже сделать новые страницы по шаблону.
Клик на Edit Site отображала совсем другую картину, где Тони вибырал то, что хотел отредактировать:
Экран показывал все области, о которых мы говорили ранее.
После редактирования страницы, моему заказчику предлагалось сделать превью изменений. Он был в восторге!
Теперь мы хотели обновить изображение.
Это дает нам предварительный просмотр изображения, которое мы изменяем. Теперь мы можем выбрать изображение. Можем загрузить его прямо с телефона.
Теперь мы можем посмотреть превью и опубликовать изменения…
После всех изменений…
… таким образом, мы отредактировали весь сайт — с одного телефона! Тут не нужно обладать какими-то техническими знаниями, а денег можно снять больше.
Теперь вы знаете, как это делается. Удивите своих клиентов!
Источник: http://feedproxy.google.com/~r/ruseller/CdHX/~3/opFfsf_VMEo/lessons.php
Дайджест новых статей по интернет-маркетингу на ваш email
Новые статьи и публикации
- 2024-04-22 » Комментирование кода и генерация документации в PHP
- 2024-04-22 » SEO в России и на Западе: в чем основные отличия
- 2024-04-22 » SEO для международного масштабирования
- 2024-04-22 » Как использовать XML-карты для продвижения сайта
- 2024-04-22 » Цифровой маркетинг: инструменты для продвижения и рекламы в 2024 году
- 2024-04-22 » Что такое CSS-модули и зачем они нам?
- 2024-04-17 » 23 сервиса для эффективного экспресс-аудита любого сайта
- 2024-04-08 » Яндекс переходит на новую версию Wordstat
- 2024-04-08 » Яндекс интегрировал в свой облачный сервис эмпатичную нейросеть
- 2024-04-08 » Новая версия нейросети Claude превзошла по мощности аналоги Google и OpenAI
- 2024-04-08 » Как пользоваться GPT 4 и Claude бесплатно и без VPN
- 2024-03-13 » Стратегии SEO на 2024 год
- 2024-03-13 » Как использовать анимацию с помощью JavaScript-библиотеки GSAP
- 2024-03-13 » Использование GSAP 3 для веб-анимации
- 2024-03-13 » Cогласование топографической съёмки с эксплуатирующими организациями
- 2024-02-19 » Теряются лиды? Как настроить сквозную аналитику
- 2024-02-17 » Мерч и IT: на что обратить внимание в 2024 году
- 2024-02-16 » Копируем с RSync: основные примеры синхронизации файлов
- 2024-02-15 » Лучшие noCode AI платформы для создания диалоговых ботов
- 2024-02-14 » Факторы ранжирования Google 2024 — исследование Semrush
- 2024-02-12 » Перенос сайта на другой хостинг
- 2024-02-05 » В России сформирован реестр хостинг-провайдеров
- 2024-02-04 » Использование SSH для подключения к удаленному серверу Ubuntu
- 2024-02-03 » Подключаемся к серверу за NAT при помощи туннеля SSH. Простая и понятная инструкция
- 2024-02-02 » Настройка CI/CD для Gitlab-репозитория: схемы и гайд по шагам
- 2024-02-01 » GitLab CI Pipeline. Запуск сценария через SSH на удаленном сервере
- 2024-01-29 » Introduction to GitLab’s CI/CD for Continuous Deployments
- 2024-01-26 » Настройка GitLab CI/CD
- 2024-01-25 » Установка shell gitlab runner
- 2024-01-25 » Установка и регистрация gitlab-runner в docker контейнере
"Интернет не меняет бизнес-модели, он способен лишь дать новые мощные инструменты уже существующим." |
Мы создаем сайты, которые работают! Профессионально обслуживаем и продвигаем их , а также по всей России и ближнему зарубежью с 2006 года!
Как мы работаем
Заявка
Позвоните или оставьте заявку на сайте.
Консультация
Обсуждаем что именно Вам нужно и помогаем определить как это лучше сделать!
Договор
Заключаем договор на оказание услуг, в котором прописаны условия и обязанности обеих сторон.
Выполнение работ
Непосредственно оказание требующихся услуг и работ по вашему заданию.
Поддержка
Сдача выполненых работ, последующие корректировки и поддержка при необходимости.