Создание сайта интернет-магазина на основе существующего сайта ООО “ПромТехноЛидер”

     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
    ВВЕДЕНИЕ
     Для достижения успеха в  любом бизнесе многое зависит от того, насколько эффективно компания доводит свою информацию до клиентов и партнеров.
     Создание интернет-сайта и размещение его в Интернете – один из альтернативных методов позиционирования компании и информирования своей целевой аудитории.
     Именно в Интернете многие ищут подробную, и свежую информацию, на основе которой можно получить представление об интересующей компании, стоимости товаров и услугах.
     Сейчас очень трудно представить крупную компанию без интернет-сайта. Наличие у компании хорошего сетевого представительства не только усиливает положительный образ фирмы, но и говорит в пользу надежности и основательности компании, создает определенный имидж и впечатление о ней.
     В настоящее время наиболее популярным видом виртуальной торговли является интернет-магазин. Интернет-магазин обычно содержит наглядный и красочный каталог предоставляемых товаров, с их достаточным описанием и указанием цены, что позволяет заинтересовать потенциального покупателя, помочь ему сделать выбор и, в итоге, совершить покупку.
     Преимущества интернет-магазина:
     * не требует затрат на аренду площади, найма продавцов и другого персонала;
     * доступ к виртуальным витринам магазина может получить любой покупатель, не зависимо от его места проживания;
     * интернет-магазин не имеет ограничений на виртуальную площадь; 
     * владелец интернет-магазина может сдавать в аренду свои виртуальные торговые площади так же, как и владелец обычного магазина;
     * срок и стоимость создания интернет-магазина несоизмеримо ниже, чем обычного розничного магазина;
     * потенциальный покупатель получает исчерпывающую информацию об интересующем его товаре или услуге без помощи посредников (продавца, менеджера и тд.);
     * интернет-магазин, работающий в режиме on-line, предполагает обратную связь с покупателем (форумы, чаты), что позволяет оперативно ответить на вопросы пользователей, провести маркетинговые исследования, получить отзывы и пожелания;
     * можно разместить сколь угодно много товаров или описать любое количество услуг;
     * возможность делать покупки, не выходя из дома, делают интернет-магазины еще более привлекательными для большого количества покупателей.
     Делая свой выбор в пользу открытия интернет-магазина, компания переходит на более высокий уровень развития своего бизнеса и делает свой ассортимент более доступным для широкого круга покупателей.
     В ходе выполнения данной дипломной работы необходимо разработать сайт интернет-магазина по продаже строительного инструмента, на основе имеющегося сайта-каталога ООО “ПромТехноЛидер”. В нем должен присутствовать необходимый перечень товара, информация о компании, сервисном центре, а также разработан интуитивно понятный пользователю интерфейс.
    Целью дипломной работы является создание сайта интернет-магазина на основе существующего сайта ООО “ПромТехноЛидер”.
    Объектом исследования является компания ООО “ПромТехноЛидер” и ее нынешний сайт.
    Предмет исследования – методы, технологии разработки интернет - сайта.
    Для достижения поставленной цели необходимо решение следующих задач:
    • сбора материала относящихся к исследуемому объекту;
    • формулировка требований к реализации проекта;
    • выбора технологии и программных средств реализации.
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
    1 АНАЛИЗ ПРЕДМЕТНОЙ ОБЛАСТИ
     1.1 Назначение и цели создания Web-приложения
     Интернет-магазин - это привычный каждому пользователю интернета web-сайт, представляющий информацию о товарах в удобном структурированном виде. 
     Интернет-магазины создаются с применением систем управления содержимым сайтов, оснащенных необходимыми модулями. Крупные интернет-магазины работают на специально разработанных или адаптированных типовых системах управления. 
     Система управления содержимым сайта интернет-магазина может быть коробочным товаром, самостоятельно устанавливаемым на хостинг-площадку, может быть частной разработкой web-студии, ей же обслуживаемой, или может быть программным сервисом, предоставляемым с помесячной оплатой.
     С технической точки зрения интернет-магазин - это совокупность web-витрины и торговой системы - фронт-системы и бэк-офиса. Web-витрина предоставляет интерфейс к базе данных продаваемых товаров (в виде каталога, прайс-листа), работает с виртуальной торговой тележкой, оформляет заказы и регистрирует покупателя, предоставляет помощь покупателю в онлайновом режиме, передает информацию в торговую систему и обеспечивает безопасность личной информации покупателя. Далее торговая система осуществляет автоматическую обработку поступающих заказов - резервирует товар на складе, контролирует оплату и доставку товара.
     В общем случае основные функции интернет-магазина - это информационное обслуживание покупателя, обработка заказов, проведение платежей, а также сбор и анализ различной статистической информации. Как было упомянуто выше, программный комплекс управления интернет-магазином позволяет формировать и интерфейс с покупателем, и функциональные возможности интернет-магазина, исходя из потребностей компании.
     Целью дипломной работы является разработка интернет-магазина по продаже строительного инструмента, который позволит подробно ознакомится с различными товарами, оценить их характеристики, а при необходимости и приобрести. При разработке необходимо чтобы каждый покупатель, независимо от возраста, смог без проблем получить необходимую ему информацию о товаре, а также и при необходимости приобрести его.
     На сайте необходимо реализовать систему купонов, благодаря которой можно приобрести товар со скидкой. Скидка автоматически учитывается при предварительном расчете стоимости.
     
     1.2 Анализ существующего сайта ООО “ПромТехноЛидер”
     Перед тем как проектировать новый сайт (интернет-магазин), стоит проанализировать существующий сайт-каталог компании ООО “ПромТехноЛидер” - http://ptlider.by/. Для этого я выбрал несколько страниц данного сайта: главная страница (рисунок 1.1), ручной инструмент (рисунок 1.2), и любую другую страницу.
     
     
Рисунок 1.1 – Главная страница сайта
Источник: []
     
     Главная страница представляет собой стандартный вид интернет ресурса. На ней представлена информация о компании, боковое меню, слайдер и контактная информация. Присутствует поиск по сайту.
     
Рисунок 1.2 – Ручной инструмент
Источник: []
     
     Как видно на рисунке 1.2 информация о товарах представлена в виде таблицы со следующей информацией: артикул товара, фото, наименования. Отсутствуют цены на товар, возможность просмотра изображения товара, а также возможность его покупки с помощью данного сайта.
     
     
     
Рисунок 1.3 – Прайсы
Источник: []
     Следующей страницей для анализа была выбрана “Прайсы”, рисунок 1.3. На ней представлены прайс-листы с полным перечнем товаров и ценами на них. К сожалению последнее редактирование их, как и остального содержимого сайта было в 2015 году. После нажатия на иконки происходит скачивание Exel-файла.
     С помощью онлайн-сервиса анализа сайтов sitechecker.pro мной был сделан анализ работы сайта компании ООО “ПромТехноЛидер” http://ptlider.by. Исходя из полученных результатов можно судить о некорректной работе сайта и наличия ошибок (рисунок 1.4).
     
     
     
Рисунок 1.4 – Результаты анализа
Источник: []

Анализ мобильной версии сайта (рисунок 1.5) показал о наличии большого количества проблем, как с отображением, так и с работы мобильной версии.



Рисунок 1.5 – Анализ мобильной версии текущего сайта
Источник: []
     
     Подводя итог результатов анализа текущего сайта компании ООО “ПромТехноЛидер” можно сказать о следующем: не адаптивный дизайн, наличии большого количества различных ошибок, некорректной работе самого сайта, отсутствия возможности онлайн-покупки товаров. Создание нового сайта (интернет-магазина), новой структуры, а также простого и понятного любому пользователю интерфейса, должно решить эти проблемы.
     
     1.3 Требования к реализации проекта
     Исходя из анализа текущего сайта ООО “ПромТехноЛидер” можно определить некоторые требования к разрабатываемому интернет-магазину:
* Подбор оптимальной цветовой палитры и общего дизайна будущего сайта;
* Компактность и оптимальная иерархия меню;
* Наличие каталога товаров и описание их характеристик;
* Возможности онлайн-приобретения различный товаров;
*  Присутствие адаптивного дизайна для стационарных и мобильных устройств.






















2 ВЫБОР СРЕДЫ РАЗРАБОТКИ ИНТЕРНЕТ-МАГАЗИНА
     2.1 Обзор технологий CMS WordPress
     WordPress —система управления содержимым сайта (CMS) с открытым исходным кодом. Написана на PHP, в качестве базы данных использует MySQL. 
     Сфера применения — от блогов до достаточно сложных новостных ресурсов и даже интернет-магазинов. Встроенная система «тем» и «плагинов» вместе с удачной архитектурой позволяет конструировать практически любые проекты.
     Одной из главных особенностей «Wordpress» является структура организации базы данных. Гибкость и функциональность связей позволяют создавать и выводить на страницу материал любого вида с любыми параметрами.
     Встроенная система «тегирования» создает дополнительные связи для материалов сайта, что при необходимости, позволяет оперировать всеми записями, соответствующими определенным условиям.
     В системе управления контентом «Wordpress» предлагается гибкая схема организации структуры сайта на основе таксономии. Таксономия – механизм, позволяющий создавать произвольное количество связей между объектами содержимого сайта и ассоциировать их с «Ключами записей», «Категориями записей» или «Категориями ссылок».
     «Категории», «Ключевые слова» и «Ссылки» могут представлять плоские или иерархические списки, либо сложные структуры, где элемент может иметь несколько «родителей» и несколько дочерних элементов. С помощью подобной схемы одними и теми же компонентами системы управления контентом возможна организация различных вариантов структуризации, обработки, редактирования и вывода содержимого.
     Основными функциональными особенностями Wordpress являются: публикация статей, защита от спама в комментариях, интегрированная лента дружественных блогов, управление страницами, паролирование записей и страниц, дополнительные поля, простая установка, настройка и обновление скрипта. Осуществляется поддержка 10 уровней пользователей с разными правами доступа, поддержка нескольких категорий и подкатегорий, запрограммированные публикации, полная поддержка веб-стандартов, для работы использует PHP и MySQL, полностью бесплатен.
     При выборе для создания сайта системы «Wordpress», мы можем сразу заметить следующие ее преимущества:
     - простота в установке и настройке;
     - наличие удобного, настраиваемого административного интерфейса;
     - легкость при непосредственном создании сайта;
     - в дальнейшем, простое управление сайтом и его редактирование;
     - наличие простого и удобного консоля;
     - поддержка «тем», позволяющих легко менять как внешний вид, так и способы вывода данных;
     - наличие громадных библиотек «тем» и «плагинов»;
     - наличие системы контроля безопасности сайта;
     - наличие системы автосохранения набираемого в редакторе текста, для предотвращения потери информации из-за программного или аппаратного сбоя;
     - наличие инструмента автоматического обновления до белее свежей версии;
     Wordpress — это полностью бесплатная, свободно распространяемая система программ, написанных на скриптовом языке РНР. В ней применяются и CSS-стили, позволяющие мгновенно менять внешний вид сайта, доступно множество готовых тем — наборов стилей для оформления текста и страницы в целом, плюс необходимые графические элементы дизайна, наборы скриптов и специальных дополнений — виджетов, помогающих создать на сайте меню, удобную систему рубрик, архивы записей, поиск по сайту и прочие дополнительные удобства. Темы весьма разнообразные, выглядят солидно и профессионально. Каждая тема состоит из нескольких файлов-шаблонов, которые разрешается редактировать для изменения оформления сайта или создания своих собственных тем. Кроме стандартного набора возможностей, прописанных в той или иной теме, WordPress позволяет усложнять оформление и функциональные возможности за счет тех или иных дополнений — плагинов. Плагины пишутся уже не столько разработчиками «Wordpress», сколько сторонними программистами. 
     Система «Wordpress» имеет следующий ряд возможностей:
     - шаблонный дизайн графического оформления страниц создает гибкость, простоту редактирования и дает возможность установить стандарт выполнения любых шаблонов для данной системы управления;
     - создание чистого HTMLкода при помощи графического редактора текста;
     - возможность подключать плагины, с уникально простой системой их взаимодействия с основным кодом;
     -возможность в реальном времени осуществлять мониторинг уязвимостей и изменений в потенциально-опасных файлах;
     - возможность встроенными средствами защитить определенные папки веб-сервера, от посещения пользователями, путем полного запрета доступа конкретным подсетям или установки режима авторизации;
     - возможность ограничения доступа к интерфейсу администратора по спискам разрешенных IPадресов;
     - возможность редактирования непосредственно самого PHP кода;
     - встроенный редактор ЧПУ, делающий ссылки на записи сайта более привлекательными для роботов поисковых систем;
     - возможность создания современного динамического многофункционального сайта с ярким внешним видом на совершенно любую тематику; 

    2.2 Веб-приложение phpMyAdmin
    PHPMyAdmin — веб-приложение с открытым кодом, написанное на языке PHP и представляющее собой веб-интерфейс для администрирования СУБД MySQL. PHPMyAdmin позволяет через браузер и не только осуществлять администрирование сервера MySQL, запускать команды SQL и просматривать содержимое таблиц и баз данных. Приложение пользуется большой популярностью у веб-разработчиков, так как позволяет управлять СУБД MySQL без непосредственного ввода SQL команд, предоставляя дружественный интерфейс.
    На сегодняшний день PHPMyAdmin широко применяется на практике. Последнее связано с тем, что разработчики интенсивно развивают свой продукт, учитывая все нововведения СУБД MySQL. Подавляющее большинство российских провайдеров используют это приложение в качестве панели управления для того, чтобы предоставить своим клиентам возможность администрирования выделенных им баз данных.
    Приложение распространяется под лицензией GNU General Public License и поэтому многие другие разработчики интегрируют его в свои разработки, например XAMPP, Denwer, AppServ, Open Server. Проект на данный момент времени локализован на более чем 62 языках. 
    Начиная с версии 3.0.0, phpMyAdmin присоединился к инициативе GoPHP5 и отказался от поддержки совместимости с устаревшими версиями PHP и MySQL. Для работы phpMyAdmin 3.0.0 и выше, требуется наличие PHP 5.2 и MySQL 5. Для использования старых версий PHP и MySQL, продолжает развиваться вторая ветка скрипта (2.x), однако её поддержка ограничивается закрытием найденных уязвимостей, новых функций в неё не добавляется.
    
    
    
    
    2.3 Локальный сервер OpenServer
    Open Server Panel — это портативная серверная платформа и программная среда, созданная специально для веб-разработчиков с учётом их рекомендаций и пожеланий. 
 	Программный комплекс имеет богатый набор серверного программного обеспечения, удобный, многофункциональный продуманный интерфейс, обладает мощными возможностями по администрированию и настройке компонентов. Платформа широко используется с целью разработки, отладки и тестирования веб-проектов, а так же для предоставления веб-сервисов в локальных сетях. Хотя изначально программные продукты, входящие в состав комплекса, не разрабатывались специально для работы друг с другом, такая связка стала весьма популярной среди пользователей Windows, в первую очередь из-за того, что они получали бесплатный комплекс программ с надежностью на уровне Linux серверов.
    Удобство и простота управления безусловно не оставят вас равнодушными, за время своего существования OpenServer зарекомендовал себя как первоклассный и надёжный инструмент необходимый каждому веб-мастеру (рисунок 2.1.).
    
Рисунок 2.1 – Набор инструментов OpenServer
Источник: []
    
    Open Server представляет из себя так называемый WAMP комплекс, суть которого можно понять из расшифровки этой аббревиатуры:
   1. Windows — операционная система, для работы в которой предназначен данный локальный сервер
2. Apache — web-сервер, который «поднимается» при запуске программы Open Server
3. MySQL — очень популярная система управления базами данных, которая является обязательным условием для работы многих движков сайтов, в том числе таких популярный, как Joomla и WordPress
4. PHP — интерпретатор серверного языка программирования, на котором написано большинство CMS и создано множество других веб-приложений.

   2.4 Плагин WooCommerce
   WooCommerce — бесплатный плагин для электронной коммерции, с помощью которого можно продавать всё, что угодно, и делать это красиво. Разработанный для гибкой интеграции с WordPress, WooCommerce — это любимое во всём мире решение, которое обеспечивает полный контроль и владельцам магазинов и разработчикам.
   С беспредельной гибкостью и доступом к сотням бесплатных и премиум расширений WordPress, WooCommerce сейчас обеспечивает функционирование 30% всех онлайн-магазинов — больше чем любая другая платформа.
   Так как WooCommerce это бесплатный плагин, он может быть установлен из каталога бесплатных плагинов WordPress (рисунок 2.2).
   Во-первых, нам необходимо войти в панель управления WordPress, вписав имя пользователя и пароль.
   Во-вторых, следовать данным этапам для установки WooCommerce:
1. Нажать Плагины в левой части меню вашей панели управления WordPress.
2. На странице плагинов нажать кнопку Добавить новый.

Рисунок 2.2 – Установка WooCommerce
Источник: собственная разработка автора
3. Вводим WooCommerce в строку поиска плагинов.
4. Находим плагин WooCommerce в результатах поиска и нажимаем кнопку Установить (рисунок 2.3).

Рисунок 2.3 – Установка WooCommerce
Источник: собственная разработка автора
5. Происходит  процесс установки плагина WooCommerce. Как только установка будет завершена, нажимаем кнопку Активировать (рисунок 2.4).

Рисунок 2.4 – Активация WooCommerce
Источник: собственная разработка автора
     После завершения установки, мы увидим приветственное сообщение от WooCommerce с просьбой о запуске Помощника установки. Это самый легкий путь для настройки WooCommerce, для запуска нажимаем фиолетовую кнопку (рисунок 2.5). 

Рисунок 2.5 – Помощник установки
Источник: собственная разработка автора
     Прочитав еще одно приветственное сообщение от команды WooCommerce и нажимаем кнопку Вперед! для начала установки (рисунок 2.6).

Рисунок 2.6 – Настройка плагина WooCommerce
Источник: собственная разработка автора
     На данном этапе WooCommerce уведомит о создании главных страниц (витрина, корзина, оформление заказа и мой аккаунт) для интернет-магазина на WordPress. Эти страницы необходимы для корректной работы WooCommerce. Ознакомившись с информацией и нажимаем кнопку Продолжить.
     Произведя настройку необходимых компонентов можно приступать к наполнению сайта товарами (рисунок 2.7).

Рисунок 2.7 – Завершение настройки
Источник: собственная разработка автора
     2.5 Тема StoreFront
     Storefront - это красивый шаблон для создания профессионального и стильного интернет – магазина. Работает данная тема с использованием популярного плагина woocommerce. Без этого плагина тему можно использовать для организации любых типов проектов.
     Дизайн простой и понятный. Необходимо отдельно рассмотреть функциональную административную панель. С ее помощью можно полностью проконтролировать весь онлайн бизнес. Каталог с нужными товарами находится в сайтбаре, расположенном слева. В макете предусмотрено место для слайдера (рисунок 2.8).
Важные характеристики:
o Работает тема с самыми популярными версиями движка вордпресс.
o Простая и легкая замена логотипа. Логотип может быть, как в виде картинки, так и в виде контента.
o Кроссбраузерность.
o Можно создать двухколоночный интернет – проект.
o Можно использовать javascript сжатие для быстрой загрузки созданного проекта.
o Разработан с применением технологий html5 и css3.
o Подробная документация, которая поможет с установкой и настройкой.
o Исходный код прокомментирован. Это поможет быстро найти необходимый фрагмент кода.
o Будет корректно работать на любых мобильных приложениях.

Рисунок 2.8 – Тема StoreFront
Источник: собственная разработка автора
    2.6 Обоснование выбора инструментов для разработки
    Версия WordPress используемая для разработки сайта, выбрана самая актуальная на момент разработки 4.9.6 (рисунок 2.9). 
    
    
Рисунок 2.9 – Версия CMS WordPress
Источник: собственная разработка автора
    Так же выбор данной CMS обоснован тем, что нынешний сайт разработан на такой же системе управления содержимым, правда более старой версии. Поэтому внедрение нового сайта будет облегчено за счёт более простого интегрирования контента.
    В качестве плагина будущего интернет-магазина был выбран WooCommerce и активной темы StoreFront.
    Основные преимущества плагина WooCommerce: 
* гибкая планировка дизайна макета;
* поддержка css и javascript сжатия для быстрой работы сайта;
* хорошо прокомментированы файлы css и php;
* использование возможностей современной технологии css3;
* проверка валидности w3c xhtml 1.0 transitional;
* оптимизированный код файлов для поисковых систем;
* корректная работа в любом интернет-браузере;
* поддержка мобильных и планшетных веб-устройств.
    Так же для отображения некоторых функций и элементов использовались некоторые сторонние виджеты: Logo Slider, Meta Slider, Поиск товаров, Фильтр товаров, Корзина. Производилась настройка и корректировка кода PHP для некоторых модулей будущего интернет-магазина.
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    3 РАЗРАБОТКА ИНТЕРНЕТ-МАГАЗИНA
    3.1 Логическая структура Web-приложения
     Логическая структура интернет-магазина строительного инструмента представлена в соответствии с рисунком 3.1. 

     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
Рисунок 3.1 – Логическая структура интернет-магазина
Источник: собственная разработка автора
     Логическая структура web-приложения отображает то, как именно связаны между собой страницы одного сайта. При разработке интернет-магазина promtehnolider.by максимальная связь страниц достигнута при помощи постоянного отображения главного меню сайта, благодаря этому навигация по сайту не вызывает никаких затруднений. 
     Главная страница сайта имеет определённую структуру, представленную в соответствии с рисунком 3.2.

     
Рисунок 3.2 – Структура главной страницы
Источник: собственная разработка автора
    
    3.2 Физическая структура Web-приложения
    Физическая структура Интернет-ресурса отображает структуру папок и файлов, хранящихся на удаленном сервере. Файлы сайта в данный момент расположены на на локальном сервере с адресом http://promtehnolider.by/. Доступ к файлам сайта возможет только после ввода пароля, который известен разработчику проекта.
     Файлы на сервере расположены по тематическим директориям и имеют определенную структуру, представленную в соответствии с рисунком 3.3.

    
    
    
Рисунок 3.3 – Расположение файлов
Источник: собственная разработка автора
    База данный разрабатываемого интернет-магазина имеет следующий вид, рисунок 3.4.
    
    
    
Рисунок 3.4 – База данных
Источник: собственная разработка автора
     Страница каталогов товаров имеет следующею структуру согласно с рисунком 3.5.

     
Рисунок 3.5 – Структура страниц каталога
Источник: собственная разработка автора
     
Страницы “Каталог товаров”, “Сервисный центр”, “Контакты”, “Корзина”, “Мой аккаунт” имеют структуру в соответствии с рисунком 3.6.

     
Рисунок 3.6 – Структура страниц 
Источник: собственная разработка автора
     Каждая директория предназначена для хранения файлов определенного типа, каждый из которых выполняет определенную функцию:
     - файл wp-config.php – содержит информацию, необходимую для подключения к базе данных. Это: имя базы данных, имя пользователя и пароль для доступа.
     - файл sidebar.php – данный файл выводит боковые колонки, в которых отображается меню и другая вспомогательная информация.
     - файл header.php – файл шаблона отвечает за вывод шапки сайта.
     - файл page.php – файл, который отображает структуру страницы.
     - файл comments.php – шаблон для отображения комментариев на страницах.
     - файл footer.php – отвечает за отображение подвала сайта;
     -файл index.php – отвечает за вывод главной страницы WordPress, обратите внимание: главная страница может быть, как динамичной, так и статичной, это нужно учитывать при верстке шаблона;
      - файл .htaccess – содержит настройки для web-сервера Apache, который обеспечивает нормальную работу хостинга. Если данный файл отсутствует или неработоспособен, то становится невозможным переход по ссылкам записей на блоге, при этом выдается код 404 «Страница не найдена»;
     - в папке wp-admin содержатся файлы, предназначенные для административной панели;
     - в папке wp-includes хранятся служебные файлы системы;
     - в папке wp-content – содержится данные о плагинах, расширениях, а также темах, используемых в CMS Wordpress.
     - в папке wp-snapshots содержатся резервные копии сайта.
     Структура шаблона сайта представлена на рисунке 3.7.

      
     Рисунок 3.7 – Структура шаблона сайта
     Источник: собственная разработка автора
    
     3.3 Создание страниц, категорий товаров и меню интернет-магазина
     Для создания страниц будущего сайта переходим в консоль управления WordPress. Выбираем пункт Страницы, Добавить новую (рисунок 3.8).


    
Рисунок 3.8 – Создание страниц сайта
Источник: собственная разработка автора
    Вводим название будущей страницы. Наполняем необходимым содержимым(текст, картинки и т.д), после чего нажимаем на кнопку Опубликовать (рисунок 3.9).
    
    
    
Рисунок 3.9 – Наполнение контентом страницы
Источник: собственная разработка автора
    После создания всех страниц интернет-магазина создаем меню. Путем добавления необходимых страниц в меню получилось следующая его структура (рисунок 3.10).
    
    
     Рисунок 3.10 – Структура меню
     Источник: собственная разработка автора
    Для создания категорий товаров в консоли управления переходим во вкладку Товары, Категории и добавляем новую категорию. Вводим название, описание, прописываем ярлык. Также, для наглядности, устанавливаем миниатюру наше категории (рисунок 3.11).
    
    
Рисунок 3.11 – Создание категории товаров
Источник: собственная разработка автора
    На данный момент общее количество категорий 8. В дальнейшем в процессе наполнения интернет-магазина они будут дополнены и разбиты на подкатегории (рисунок 3.12).
    
     
    
Рисунок 3.12 – Категории товаров
Источник: собственная разработка автора
   Добавление товаров осуществляется следующим образом:
* в консоли выбираем вкладку Товары, Добавить новый;
* прописываем название товара;
* добавляем описание;
* устанавливаем цену, артикул и принадлежность к категории;
* задаем изображение и нажимаем кнопку Опубликовать (рисунок 3.13).


Рисунок 3.13 – Добавление товара
Источник: собственная разработка автора
    Товар на сайте представлен в виде его наименования, цены, изображения, описания и характеристик (рисунок 3.14)
    
Рисунок 3.14 – Отображение на сайте
Источник: собственная разработка автора

    3.4 Описание структуры и формата страниц
    Главная страница интернет-магазина promtehnolider.by состоит из шапки сайта, на которой расположен логотип компании ООО “ПромТехноЛидер”, горизонтального Меню, Виджета поиска товаров, Корзины, Категорий товаров, Подвала. Внешний вид представлен на рисунке 3.15.
    
     Рисунок 3.15 – Главная страница
     Источник: собственная разработка автора
     Главная страница сайта содержит следующие элементы:
o Главная;
o Каталог товаров;
o Сервисный центр;
o Контакты;
o Корзина;
o Мой аккаунт;
     Блок «Каталог товаров» содержит каталог всех товаров, и разделов в соответствии с рисунком 3.16.
     
     
Рисунок 3.16 – Каталог товаров
Источник: собственная разработка автора
     На данной странице отображаются товары интернет-магазина. Для того что бы просмотреть подробную информацию о товаре, необходимо нажать по названию товара. Откроется страница выбранного товара, представленная в соответствии с рисунком 3.17.

     Рисунок 3.17 – Описание товара
     Источник: собственная разработка автора
     Блок «Сервисный центр» представлен в соответствии с рисунком 3.18. На данной странице находится информация об сервисном центре компании ООО “ПромТехноЛидер” и его услугах.
     
Рисунок 3.18 – Сервисный центр
Источник: собственная разработка автора
     На странице “Контакты” располагается контактная информация о ООО “ПромТехноЛидер” (рисунок 3.19).
     
Рисунок 3.19 – Контакты
Источник: собственная разработка автора
     Все страницы интернет-магазина содержат некоторые одинаковые элементы - «шапку» страницы, представленную в соответствии с рисунком 3.20.


Рисунок 3.20 – “Шапка” сайта
Источник: собственная разработка автора
     «Шапка» располагается вверху сайта и содержит, помимо описанных ранее кнопок, кнопку “Корзина” и “Поиск”, представленную в соответствии с рисунком 3.21. 

     Рисунок 3.21 –Поиск и Корзина
     Источник: собственная разработка автора
     Для того что бы посмотреть товар в корзине, необходимо нажать на «Корзину», после чего откроется список в соответствии с рисунком 3.22.


Рисунок 3.22 – Корзина покупок
Источник: собственная разработка автора
     При заказе товара можно использовать купон, предоставляющий скидку и выбрать метод доставки, и ознакомится с окончательной суммой к оплате.
     Мобильная версия интернет-магазина promtehnolider.by (рисунок 3.23).
     
Рисунок 3.23 – Мобильная версия сайта
Источник: собственная разработка автора
     
     
     
     
     
    ЗАКЛЮЧЕНИЕ
    В ходе выполнения дипломной работы был разработан новый интернет-магазин по продаже строительного инструмента promtehnolider.by. За основу был взят имеющийся сайт компании ООО “ПромТехноЛидер” – ptlider.by.
    Данный интернет-магазин предназначен для продажи различного строительного инструмента через интернет. Областью применения данного Web-приложения выступает интернет-торговля.
    Создание данного интернет-магазина позволит продвигать и продавать товары, уменьшить издержки на рекламу и приобрести дополнительный рынок сбыта своего товара, расширить клиентскую аудиторию и, как следствие, увеличить прибыль компании ООО “ПромТехноЛидер”.
    При разработке сайта были проанализированы современные веб-технологии, позволяющие создавать интерактивные веб-страницы. Наиболее подходящим для выполнения поставленной задачи оказался пакет WordPress 4.9.6.
    Разработанный сайт удовлетворяет всем требованиям, поставленным на этапе постановки задачи. При разработке сайта были использованы готовые модули меню, новостного слайдера и HTML вставки.
    Основные результаты дипломной работы:
* проведен анализ текущего сайта ООО “ПромТехноЛидер”;
* проведен обзор инструментов для разработки сайтов;
* разработан интернет-магазин promtehnolider.by;
* разработана иерархия меню интернет-магазина;
* упрощена визуальная подача контента.
    Как дальнейшее совершенствование веб-сайта представляется возможным разработка различных модулей, добавление категорий, а так же увеличение количества товаров. Так же возможны доработки интерфейса сайта с целью дальнейшего повышения его информативности, привлекательности и удобства использования.
    
     
     
     
     
     
     
     
     
    СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     ПРИЛОЖЕНИЕ
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     

     7
     
     
.......................