качество и надёжность с 2008 года

8 (800) 200-25-11

Техническая поддержка support@komtet.ru —

круглосуточно и без выходных дней

load-whois

Онлайн-касса

для интернет-магазина

Подключите ваш интернет-магазин

к онлайн-кассе в соответствии с 54-ФЗ

Главная Техническая библиотека Блоги WordPress Пример создания сайта на WordPress

Пример создания сайта на WordPress

Пример создания простого сайта на WordPress, с добавлением статьи, меню, форума и интернет-магазина — лёгкая и доступная пошаговая инструкция для новичков в WordPress.

Для инструкции по созданию сайта мы выбрали последнюю версию WordPress 3.2.1 на день написания данной статьи. Для создания сайта на WordPress на нашем виртуальном хостинге рекомендуется выбирать тариф не ниже «Профи». Рекомендуется получить бесплатный тестовый доступ, так как предполагается, что осуществлена автоматическая установка русской версии WordPress из Панели управления хостингом КОМТЕТ.

Установка WordPress

Мы рекомендуем выполнять установку WordPress из Панели управления хостингом. Автоинсталлер позволяет не только установить русскую версию WordPress, но и выбрать несколько популярных плагинов. Установка простая, не требует профессиональных знаний и занимает всего несколько минут. 

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

Итак, мы установили WordPress. Прежде всего перейдем в панель администратора для управления сайтом (административный раздел, далее: админпанель) WordPress, который находится по адресу:

http://имя_домена//wp-admin

Далее, приступим к созданию сайта поэтапно:

  • создание статей;
  • создание меню;
  • создание форума;
  • создание интернет-магазина.

Создание статей (страниц) в WordPress

  1. В левом меню нажимаем на «Страницы», после чего «Добавить новую»:

    129.jpeg

  2. Далее вводим заголовок и текст статьи, назовем еще для примера «Статья №1».

  3. В колонке справа нажимаем «Опубликовать»:
    92.jpeg

  4. Для полноты картины создадим еще 2 статьи (назовем их «Статья №2», «Статья №3»), таким же образом, повторяя пункты 1-3. В итоге у нас получится:
    97.jpeg
    С помощью этих статей в дальнейшем мы создадим пример подменю.

Создание меню в WordPress

Теперь приступим к созданию меню и подменю, в которых будут отображаться наши статьи.

  1. Переходим в правой колонке на «Внешний вид» - «Меню»:
    95.jpeg

  2. Здесь вводим имя нашего меню, например «Новое меню», и нажимаем кнопку «Создать меню»
    96.jpeg

  3. В блоке «Области темы» выбираем из выпадающего списка наше меню «Новое меню»
    98.jpeg
    Не забываем нажать кнопку «Сохранить» в данном блоке.

  4. В блоке «Страницы» отмечаем галочкой наши статьи и нажимаем «Добавить в меню»:
    99.jpeg

  5. Также можно добавить пункт в нашем меню на сторонний ресурс. Это делается в блоке «Произвольные ссылки»:
    100.jpeg
    В поле «URL» пишем имя сайта, в поле «Текст» — как будет называться данный пункт меню.

  6. В итоге справа, в блоке нашего меню мы получаем следующий результат:
    101.jpeg
    Это наши пункты меню, с привязкой на указанные страницы сайта.

  7. Как упоминалось ранее, сделаем из «Статья №2» и «Статья №3» меню и подменю. В WordPress подменю создаются предельно просто — для этого нужно удерживая левой кнопкой мыши нужный нам пункт меню (например, «Статья №3») перетащить на другой пункт меню (например, «Статья №2»):
    102.jpeg
    И у нас получится, что «Статья №3» будет подменю пункта «Статья №2».

  8. Теперь осталось только сохранить все сделанные нами изменения для данного меню. Нажимаем:
    103.jpeg

  9. Переходим по адресу нашего сайта и видим созданное нами меню:
    105.jpeg
    При нажатии на пункты меню мы будем переходить на соответствующие страницы сайта.

Теперь перейдем к созданию наиболее распространенного функционала на сайте, а именно:

  • форум;

  • электронный магазин.

Так как публикация плагинов в WordPress имеет специфический характер (на одном примере нельзя описать установку для всех плагинов, есть только общий принцип), то мы рассмотрим  статьи с конкретными примерами, а именно:

 

Создание электронного магазина, с использованием плагина WP e-Commerce 3.8.5

Теперь приступим к созданию электронного магазина. Для описания создания магазина наш выбор пал на плагин WP e-Commerce 3.8.5 не случайно. Данный плагин является чрезвычайно простым и удобным для создания и настройки интернет-магазина. Еще один его плюс — плагин полностью русифицирован.

Итак, задача — создать магазин со структурой:

Магазин сайта:

- Инструменты;

– Молоток;

– Пила;

- Продукты.

Приступаем:

  1. Устанавливаем плагин WP e-Commerce 3.8.5, в результате чего у нас в левой колонке админпанели появляется новый блок:
    116.jpeg

  2. Переходим в раздел «Категории».

  3. В поле «Название» вписываем «Магазин сайта» и в самом низу страницы нажимаем кнопку «Добавить новую категорию товаров».
    119.jpeg

  4. На этой же странице добавляем 2 категории «Инструменты» и «Продукты», указывая для них в поле «Родительская» категорию «Магазин сайта»:
    120.jpeg

  5. Итого у нас должно получиться 3 категории (1 родительская и 2 дочерних):
    121.jpeg

  6. Теперь переходим в левом меню на «Товары» и нажимаем кнопку «Добавить».

  7. В первом поле указываем имя товара, например «Молоток».

  8. В нижестоящем окне заполняем описание товара.

  9. В блоке справа «Категории» указываем категорию для данного товара, а именно «Инструменты»:
    123.jpeg

  10. В нижестоящем блоке «Управление ценой» указываем стоимость товара, например 200:
    124.jpeg

  11. Остальные блоки заполняем по усмотрению, после чего нажимаем кнопку «Опубликовать».

  12. Аналогично (пункты 6-11) добавляем товар «Пила».

  13. В итоге мы создали заданную структуру интернет-магазина.

  14. Теперь необходимо опубликовать магазин на нашем сайте WordPress. Для этого переходим в раздел «Внешний вид» - «Меню» основной консоли:
    95.jpeg

  15. В блоке «Категории» отмечаем галочкой родительскую категорию «Магазин сайта» и нажимаем кнопку «Добавить в меню»:
    126.jpeg
    Не забываем сохранить меню:
    103.jpeg

  16. Теперь разместим корзину товаров, чтобы покупатели могли оформить свой заказ. Для этого переходим в левой панели на «Внешний вид» — «Виджеты», находим там блок с названием «Корзина» и перетаскиваем, зажав левую кнопку мыши, в виджет «Область подвала 1»:
    127.jpeg

  17. Готово. Мы добавили на сайт интернет-магазин, который открывается по соответствующему пункту меню:
    128.jpeg

Примечание: по данному электронному магазину: по умолчанию цена в магазине указывается в $, поэтому если нужно использовать другую валюту, то это делается так:

  1. Переходим в левом меню консоли админпанели на «Параметры» — «Магазин»:
    130.jpeg

  2. Выбираем здесь для Типа валюты: Russia (Russian Ruble), а также позицию, на которой будет находится знак валюты — Локальное нахождение валюты: 100 RUR:
    131.jpeg

  3. Нажимаем кнопку «Обновление».

Итог создания сайта на WordPress

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

Другие документы на эту тему

Пример создания сайта на WordPress. Добавляем форум

Простой пример добавления на сайт WordPress форума — лёгкая и доступная пошаговая инструкция для новичков в WordPress.

Пример создания сайта на WordPress. Добавляем интернет-магазин

Простой пример установки на сайт WordPress интернет-магазина — лёгкая и доступная пошаговая инструкция для новичков в WordPress.

Виртуальный хостинг Perl/PHP/Python/Ruby

Тарифные планы «Виртуальный хостинг» — от размещения статических HTML-страниц, до поддержки PHP, Python, CGI скриптов (Shell, Perl), SSI, Ruby. В рамках тарифных планов предоставляется доступ к серверам баз данных MySQL или PostgreSQL.

Автоматическое обновление WordPress до последней версии

Как обновить WordPress до последней версии.

Скидка 30% на SSL-сертификаты!
Клиентам — домены в подарок!
Бесплатный тест виртуального хостинга
Перенос сайта — бесплатно
Все акции
На сайте КОМТЕТ используются cookie-файлы, данные о IP-адресе и местоположении посетителей. Если, прочитав это сообщение, вы остаетесь на нашем сайте, это означает, что вы не возражаете против использования этих технологий.