Создаем сайт в Parallels Web Presence Builder

29 мая 2017 - Жукова Татьяна 7 комментариев
Просмотров: 3649

Добрый день, друзья!

В предыдущей статье мы с вами создали домен для вашего сайта и привязали его к хостингу и панели управления Plesk.

Сегодня мы будем непосредственно делать сайт в конструкторе Parallels Web Presence Builder.

Входим в панель Plesk.

вход в панель Plesk

Здесь мы видим созданный нами домен. В моем случае, это superclub.site

создание сайта

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

Если вы не сделаете это, то после публикации своего вновь сделанного сайта с большой долей вероятности увидите сообщение «Сайт надёжно припаркован и ожидает открытия».

Как удалить файлы парковочной страницы?

Нажав на ссылку «Папка сайта», вы попадете в директорию вашего сайта.

как удалить файлы парковочной страницы

Там вы увидите, что она не пуста — это и есть файлы парковочной страницы.

Выделяем их все и безжалостно нажимаем кнопку «Удалить».

удалить парковочную страницу

Вот собственно и все — мы избавились от парковочной страницы.

Теперь можем смело создавать свой сайт.

Как создать сайт в Parallels Web Presence Builder

Переходим во вкладку «Сайты и домены».

создать сайт

Нажав на кнопку «Создать сайт», мы запустим конструктор Parallels Web Presence Builder. Далее все очень просто, мы только следуем указаниям редактора. Первым делом нам будет предложено

выбрать тематику нашего сайта

Здесь 12 разделов, вы можете подобрать тот, который наиболее подходит к теме вашего сайта.

Если вам необходимо создать сайт магазина, то переходите в раздел «Розничные магазины» и выбираете, то направление, какое вам необходимо, например, магазин одежды, автозапчастей, цветов, мебели, игрушек и т.п. — выбор достаточно широк. Если вы хотите создать тематический блог (поклонников рок-группы, спортивной команды, кино, видеоигр), то вам в раздел «Увлечения и хобби». Если вы оказываете какие-либо услуги и хотите рекламировать их в интернете, то выбирайте соответствующие вашему профилю разделы: «Образовательные услуги», «Здоровье и спорт», «Строительство и жилье», «Досуг и развлечения» и т.д. Если вы создаете сайт организации или предприятия, ассоциации или фонда, политической партии или благотворительной организации, сайт города, поселка или деревни, то выбирайте раздел «Организации». В разделе «Личное» вы можете создать личный или семейный веб-сайт, блог о путешествиях, семейный фотоотчет о каком-то важном событии в жизни — помолвке и свадьбе, рождении ребенка и т.д.

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

Я для своего сайта выбрала тему «Личный или семейный веб-сайт»

выбор темы сайта

Заполняем информацию о владельце сайта

информация о владельце сайта

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

После нажатия на кнопку «Создать сайт» ваш шаблон будет сформирован автоматически. Вот какой получился у меня.

шаблон сайта

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

Нажмите на кнопку «Еще» и выберите «Начать заново».

начать заново

Вы снова окажетесь в панели выбора тематики сайта. Я решила вместо предыдущей тематики создать Стандартный блог, где можно писать обо всем. Вот результат:

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

Читайте также:  Как создать мобильную версию сайта в Parallels Web Presence Builder

Как видите, структура сайта у нас уже готова. У нас уже есть меню вверху страницы, место для логотипа (его можно убрать), баннер, который можно поменять, левый сайдбар, блог и несколько автоматически сформированных страниц, которые даже заполнены некоторой информацией — зависит от того, какую тему сайта вы выбрали. Все блоки, из которых состоит сайт, называются модули. Их можно легко редактировать, менять местами, просто захватывая и переставляя мышкой в нужное место.

Настройка сайта в Parallels Web Presence Builder

Переходим к настройке нашего сайта.  Основным инструментом управления сайтом является панель конструктора Parallels Presence Builder 12.0.8.

панель конструктора

Здесь все просто и понятно и больших пояснений не требует.

Начинаем с последней вкладки

Настройки

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

 

настройка сайта Parallels Web Presence Build

На подразделе «Языки» мы останавливаться не будем — понятно всем.

Следующий подраздел вкладки «Настройки» — «Другие». Здесь располагаются самые важные инструменты. Во-первых, тут можно автоматически оптимизировать сайт для мобильных устройств, во-вторых, встроить аналитику вашего сайта от Google (для чего это нужно и как это сделать, мы рассмотрим подробно в одной из ближайших статей). Здесь же можно будет сделать карту сайта и редактировать robots.txt для поисковых систем, подтвердить поисковым системам свое владение сайта. Обо всем этом мы также будем говорить более подробно чуть позже.

настройка сайта Parallels Web Presence Build

В подразделе «Соц.сети» вы сможете добавить копию своего сайта в Facebook, если вы там зарегистрированы. Пользу этого шага объяснять не нужно, и очень жаль, что нет интеграции с российскими соцсетями, в частности, Вконтакте, потому что все-таки для нашей страны именно она является наиболее популярной. Но это больше, чем ничего! К тому же, возможность поделиться с информацией вашего сайта с российским соцсетями у этого конструктора все же имеется. Но об этом немного позднее.

настройки сайта Parallels Web Presence Build

Подраздел «Владелец» мы так же разбирать не будем, тут все понятно. Тем более, если вы раньше заполнили информацию о владельце, то она у вас уже заполнена. Если нет, то здесь вы сможете ее изменить.

Далее переходим к вкладке

Дизайн

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

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

шаблон сайта Parallels Web Presence Build

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

Далее переходим к разметке сайта.

Parallels Web Presence Build дизайн

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

Подраздел схема позволяет изменить цветовую схему вашего сайта.

Parallels Web Presence Build

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

Читайте также:  Как начать работать в конструкторе Parallels Web Presence Builder

редактор Parallels Web Presence Build

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

панель Parallels Web Presence Build

Перейдя в подраздел «Цвета», мы можем изменить цвет уже каждой области страницы в отдельности.

панель Parallels Web Presence Build

Выбираем цвет фона сайта, подложки, контента, колонтитулов, панелей. Задаем цвет текста и ссылок в каждой области. Вы все будете видеть и корректировать в визуальном режиме.

настройка сайта Parallels Web Presence Build

Поэкспериментируйте! Фоном любой области можно сделать не только сплошной цвет из выбранной схемы, но и градиент, узор и даже изображение. Можно применить встроенные, а можно и загрузить свои. Все зависит от вашей фантазии.

Также «поиграйте» со шрифтами, углами и границами в соответствующих подразделах. В итоге вы создадите свой неповторимый дизайн сайта, которого нет ни у кого.

Создание страниц сайта в Parallels Web Presence Builder

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

создать страницу сайта

Создаем новые страницы с помощью кнопки «Добавить страницу», или редактируем имеющиеся, изменив названия в правой части этого блока. Причем, когда вы впишете имя вашей страницы в первом окошке, второе и третье заполнятся автоматически. Не ленитесь сразу же изменить описание и ключевые слова страницы, чтобы помочь поисковым системам в дальнейшем найти ваш сайт.

Так же здесь предусмотрена возможность сделать скрытую страницу, например, страницу результатов поиска на вашем сайте или страницу ошибки. Позже мы рассмотрим подробнее, как это сделать.

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

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

Модули в Parallels Web Presence Builder

Ну, и последняя вкладка, самая интересная — Модули.

Parallels Web Presence Build

модули

Здесь встроено 20 модулей:

  • Текст и графика — позволяет добавлять контент на ваш сайт
  • Видео — не требует комментариев.
  • Слайд-шоу — позволяет создавать слайдеры на вашем сайте. Пример такого слайдера можно посмотреть на этом сайте.
  • Галерея изображений —  так же не требует пояснений. Хочу только обратить внимание, что добавление фото через галерею позволяет показывать его в увеличенном режиме без использования всяких плагинов. То есть на странице эта фотография будет маленькой, а при нажатии на нее будет увеличена до полного размера.галерея Parallels Web Presence Build
  • Блог — позволяет создать блог на вашем сайте. Конечно, у него будет меньше возможностей, чем в блогах на WordPress, например, но тем не менее, создать можно.
  • Онлайн-магазин — без проблем. Функция электронной торговли предоставляется Ecwid, провайдером SaaS-решений, который обеспечивает надёжное хранение и обработку всех ваших данных, включая каталоги товаров, изображения, заказы и платежи клиентов. Подробно о создании магазина рассмотрим в другой статье.
  • Корзина для онлайн-магазина — тут все понятно.
  • Карта. С помощью этого модуля вы можете разместить карту с указанием определенного места, например, места нахождения вашего бизнеса
  • Комментарии. Функция комментирования работает на основе внешнего сервиса Disqus, поэтому, чтобы её включить, вам необходимо зарегистрировать учётную запись Disqus, а затем указать код сайта в настройках модуля.
  • Контактная форма. Если вы хотите, чтобы посетители могли отправлять вам сообщения с сайта, вы можете добавить этот модуль. В нем вы можете настроить адрес получателя, текст кнопок, необходимые поля. Кроме того имеется возможность включить защиту от спам-сообщений «reCAPTCHA».
  • Поделиться. Чтобы ваши посетители могли с лёгкостью делиться содержимым вашего сайта в социальных сетях или сервисах закладок, вы можете вставить панель с социальными кнопками. Вот тут как раз присутствует возможность поделиться записями в российских социальных сетях: Вконтакте, Одноклассники и другие.
  • Лента Твиттера. Чтобы поместить на сайт ленту Твиттера, нужно добавить этот модуль.
  • Amazon aStore. С помощью данного модуля вы можете добавить на свой сайт все или только некоторые товары с сайта Amazon.com, а также с помощью настроек модуля подстроить вид магазина на вашем сайте так, как вы того желаете. Ваш магазин будет содержать всю информацию о товарах от Amazon.com, а также обзоры, отзывы и т.д. Добавить данный магазин на сайт вы можете бесплатно.
  • Рекламный блок. Если вы участвуете в программе обмена баннерами или других рекламных онлайн-кампаниях, вам пригодится возможность разместить на своём сайте рекламный блок. После вставки рекламного блока на страницу он будет автоматически добавлен на все страницы сайта.
  • Поиск. Данный модуль позволяет производить поиск по вашему сайту. После вставки панели поиска на страницу она будет автоматически добавлена на все страницы сайта. По умолчанию панель поиска работает на базе поискового механизма Google. Если вы хотите использовать другой поисковой механизм, например, Яндекс, вы можете получить на Яндексе код поискового скрипта и вставить его в модуль.
  • Меню. По умолчанию основное меню сайта находится под или над баннером. Оно автоматически обновляется каждый раз, когда вы добавляете, изменяете, переносите или удаляете страницы. С помощью этого модуля вы можете добавить меню так же в нижний колонтитул и/или в боковую панель.
  • Строка навигации — это цепочка ссылок, показывающая путь от главной до текущей страницы сайта, так называемые «хлебные крошки», которые улучшают юзабилити вашего сайта.
  • Баннер
  • Логотип сайта
  • Скрипт. С помощью этого модуля вы можете добавить скрипт, написанный на PHP, JavaScript или VBScript, на любую страницу вашего сайта. Таким образом реализована возможность добавления на сайт функций, которых нет в данном конструкторе. Ну, к примеру, сделать кнопку «Вверх» для длинных страниц.
Читайте также:  Лучший плагин для оптимизации сайта

Любой из этих модулей вы можете разместить на своем сайте в том месте, где посчитаете нужным.

Принцип добавления модулей

Конструктор сайтов построен по модульному принципу. Для добавления какого-либо элемента на сайт, необходимо выбрать соответствующий модуль в меню и перенести его на страницу.

Чтобы добавить модуль только на текущую страницу, выберите его на вкладке Модули и перетащите в любую область страницы, помеченную маркером «Контент». Такие области находятся внутри основного блока содержимого и в каждой боковой панели.

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

Чтобы добавить модуль на все страницы (сквозной модуль), выберите его на вкладке Модули и перетащите в любую область страницы, помеченную текстом «На всех страницах». Такие области расположены сверху и снизу основного блока содержимого, в боковых панелях, верхнем и нижнем колонтитулах:

В меню сквозного модуля можно дополнительно указать, где он будет отображаться: Показывать везде, Только на главной или Везде, кроме главной:

Ну вот, собственно и все! Осталось только добавить необходимый контент на страницы вашего сайта и нажать кнопку «Опубликовать» в правом верхнем углу страницы. Все, можете переходит на сайт и гордиться проделанной работой!

Если у вас есть какие-то вопросы, то вы можете задать их в комментариях.


Посмотрите другие статьи из этой рубрики:




Хотите быть в курсе новостей блога?

Подпишитесь на бесплатную рассылку новых статей
Ваш e-mail:

7 комментариев

  • Спасибо! Очень важное и нужное руководство для новичков. Одно из самых полных в Рунете!

  • Здравствуйте!
    Подскажите пожалуйста где взять скрипт кнопки Вверх !
    Спасибо большое.

  • Как зайти в код сайта, чтоб добавить или поправить сам код???
    Если Parallels Web Presence Builder не имеет FTP доступа

    • Софья, а что мешает сделать это через хостинговую панель Parallels? Прямо под названием Вашего домена расположена ссылка на папку сайта. Жмете на нее и попадаете в менеджер файлов. Любая папка или файл открываются и легко можно внести изменения.
      Другой вопрос, что это мало что даст. Например, index.html вы можете править сколько угодно, но эти правки сохранятся лишь до того момента, пока вы не нажмете кнопку «Опубликовать». Parallels WPB тут же вернет все назад — так, как это нужно ему.
      А что конкретно Вы хотите поправить и почему не можете это сделать средствами самого конструктора?

  • Привет,спасибо за подробный обзор,я тоже пользуюсь данной панелью и не мог найти подробной инфы о ней,а теперь все понятно.Спасибо

  • Михаил, спасибо за отзыв! рада, что информация кому-то полезна!

Есть что сказать? Оставьте комментарий!

%d такие блоггеры, как: