Диплом Интернет-магазин. Диплом. Разработка интернетмагазина с использование cms платформы
 Скачать 6.63 Mb.
|
|
4 Экспериментальный раздел 4.1 Инсталляция CMS WordPress на хостинг Первым этапом в разработке интернет-магазина будет инсталляция CMS WORDPRESS. У выбранного мною хостинг провайдера beget.ru по мимо ручной установки путём скачивания дистрибутива WORDPRESS и дальнейшей инсталляции в корневую папку web сайта, возможно установка в автоматическом режиме. Мы будет устанавливать CMS в автоматическом режиме. Для этого необходимо выполнить несколько не сложных действий. В первую очередь как показано на рис. 12 переходим в личный кабинет хостинг провайдера beget.ru и выбираем пункт CMS. Рис.12 Вторым шагом будет выбор нужной нам CMS в обширном списке имеющихся для установки в автоматическом режиме CMS. Выбираем CMS WORDPRESS как показано на рис.13 и начинаем установку. 55 Рис. 13 56 После чего как показано на рис.14 нам будет необходимо заполнить поля, которые нужны для установки. Рис.14 После данного действия установка будет завершена по истечению нескольких минут и нам будут предоставлена информация для входа в панель управления WORDPRESS как показано на рис.15. Рис.15 57 4.2 Панель управления WORDPRESS Для входа в панель управления на нужно пройти авторизацию рис.16 Рис.16 После входа в панель управления нам доступны все функций CMS WORDPRESS. Рис.17 Рис.17 58 4.3 Инсталляция плагина WooCommerce После успешной установки WordPress на хостинг и прохождения авторизации в панель управления CMS, нам необходимо в первую очередь установить плагин WooCommerce. Для этого необходимо в панели управления WordPress перейти в меню плагины, далее нажать добавить новый плагин, воспользовавшись поиском найти плагин WooCommerce как показано на рис.18 Рис.18 Далее выбираем плагин и начинаем установку, которая завершиться по истечению нескольких минут и будет сопровождаться соответствующим уведомлением об успешной установке как показано на рис.19 Рис.19 59 4.4 Инсталляция дизайна для интернет-магазина Для установки темы, то есть шаблона дизайна для нашего интернет- магазина, мы воспользуемся имеющимися в бесплатном доступе темы CMS WordPress, для установки необходимо перейти в раздел внешний вид рис.20, после чего выбрать темы. В появившемся окне появится список уже установленных стандартных тем, но нам необходима тема, более подходящая для интернет-магазина. Чтобы отобразить темы, более или менее подходящие для интернет-магазина, нужно воспользоваться фильтром тем и выбрать интернет-магазин. После чего выбираем понравившуюся тему и нажимаем установить, как показано на рис.21 Рис.20 Рис.21 60 Редактировать дизайн сайта, управлять блоками, меню навигаций и так далее возможно как встроенными функциями как показано на рис.22, так и путем редактирования стилей CSS как показано на рис.23 Рис.22 Рис.23 61 4.5 Добавление категорий и товаров После успешной установки темы (дизайна) для web-сайта всё готово для наполнения интернет-магазина контентом, а именно товарами и категориями для них. Для добавления товаров необходимо перейти в раздел товары как показано на рис.24, где будет отображаться весь список добавленных товаров в подробном виде, то есть будут отображены цены, категория в которую входит товар, метки, дата добавления товара, наличие товара. Тут же возможно отфильтровать товары по категориям для удобного просмотра, редактирования, и добавления товаров. После чего нам нужно нажать добавить товар как показано на рис.25 и заполнить всю необходимую информацию о товаре, а именно цену, количество остатка, название и описание товара, изображение товара, выбрать способы доставки и задать ещё много параметров для товара. Рис. 24 Рис.25 62 Для создания категорий товаров так же необходимо перейти в раздел товары и выбрать категорий как показано на рис.26. После чего будет как и в случае с товарами отображен подробный список созданных категорий. Далее нажимаем на добавить категорию и заполняем нужные нам поля, после создания той или иной категорий мы сможем перещать туда товары. Рис.26 63 4.6 Руководство пользователя Рассмотрим пример реализации разработанной системы. При наборе адреса магазина посетитель попадает на его главную страницу рис.27: на главной странице представлены каталог товаров, контактные данные магазина, а также специальные предложения. Появление товаров в данной категории определяется администратором системы. Рис.27 При нажатии на ссылку магазин в меню появляются подкатегории, а на странице – перечень товаров, входящих в категорию. Рис.28 Рис.28 64 При просмотре конкретной товарной позиции необходимо нажать на соответствующую ссылку, на странице с описанием товара доступно само описание, изображение и прочая информация. Рис.29 Рис.29 При нажатии кнопки «В корзину» товар добавляется к заказу. Рис.30 Рис.30 65 После окончания оформления заказа можно либо продолжить выбор покупок, либо оформить заказ. При необходимости дальнейшего оформления заказа нажимается кнопка «Оформить заказ». Рис.31 Рис.31 После заполнения всех форм на экране появляется сообщение об успешном оформлении заказа. 66 ЗАКЛЮЧЕНИЕ В заключении дипломной работы можно сказать, что разработанный Интернет – магазин с использование CMS WordPress позволит владельцу иметь возможность главным образом значительно увеличить продажи товаров и услуг, расширить число покупателей, даст возможность снизить временной период всего процесса от предоставления товара до его продажи, улучшить управление интернет-магазином, сократить расходы на аренду либо приобретение торговой площади и найма многочисленного персонала. В ходе произведенного анализа характерного алгоритма работы Интернет - магазина стало возможным выделить его основные функции и последовательность взаимодействия с пользователями, в дальнейшем была разработана структура и алгоритм работы данного интернет-магазина и выделены его главные функции. На сегодняшний день имеется огромное число технологий для разработки интернет-магазинов, для разработки высококачественного интернет-магазина необходимо использовать и применять новейшие современные инструменты для разработки. Данный Интернет - магазина был разработан на CMS платформе WordPress с использованием языка программирования PHP и СУБД MySQL. Главным образом в силу своей бесплатности и ряду других критериев данные инструменты являются наилучшим выбором. Целью дипломной работы являлась разработка интернет-магазина «Компьютерных комплектующих» на платформе CMS WordPress В ходе выполнения данной цели стало возможным решить следующие задачи: 1) произведен анализ предметной области 2) проанализированы новейшие технологии разработки интернет-магазина с использованием всевозможных CMS; 3) проанализированы особенности разработки нынешних интернет-магазинов с точки зрения взглядов проектирования дизайна интернет-магазина; 4) изучены современные инструменты разработки веб-приложений 5) произведена реализация необходимой функциональности; 6) в течении анализа самых широко известных CMS был сделан выбор в пользу WordPress, которая может в лучшей степени удовлетворить выбраны критерии при отборе и оценке; 7) произведено размещение интернет-магазина на хостинге. Все назначенные задачи были разрешены, цель достигнута. Разработанный интернет-магазин обладает перспективами дальнейшего развития и совершенствования. 67 СПИСОК ИСПОЛЬЗОВАННОЙ ЛИТЕРАТУРЫ 1) Разработка интернет-магазина // Электронная версия на сайте https://ru.wordpress.org/ 2) Общие сведения о CMS WordPress // Электронная версия на сайте https://ru.wikipedia.org/wiki/WordPress 3) Общие сведения о БД MySQL // Электронная версия на сайте https://ru.wikipedia.org/wiki/MySQL 4) Плагин WooCommerce // Электронная версия на сайте https://woocommerce.com/ 5) Общие сведения о языке программирования Java // Электронная версия на сайте https://ru.wikipedia.org/wiki/Java 6) Робин Никсон // создаём динамические веб-сайты с помощью PHP, MySQL, JavaScript, CSS и HTML5, 2016 г. - 768с. 7) Веллинг, Томсон // Разработка веб-приложений с помощью PHP и MySQL, 2017г. - 768 с. 8) Грачев, А. // создаём свой сайт на WorldPress, работа с CMS WorldPress - Питер, 2011г. - 282 с. 9) Гаевский, А. Ю. // 100% самоучитель по созданию Web-страниц и Web- сайтов: HTML и JavaScript - Москва: 2008г. - 457 с. 68 ПРИЛОЖЕНИЕ А Техническое задание Основание для разработки – защита выпускной квалификационой работы. Целевая аудитория: потенциальные клиенты, владельцы персональных компьютеров. Назначение - Розничная продажа через интернет-магазин компьютерных комплектующих. Языковая версии: Русский Требования к дизайну: стиль сайта простой, легкий, удобный. Требования к структуре интернет-магазина: интернет-магазин должен включать в себе следующие страницы и разделы: 1) Главная; 2) Магазин; 3) Новости IT; 4) О нас; 5) Доставка и оплата. Обязательный элемент для всех страниц – логотип, корзина покупателя на видимом месте. Требования к навигации интернет-магазина: в навигации интернет-магазина должны присутствовать: 1) панель с «хлебными крошками»: возможность перехода в основной раздел сайта на любой странице сайта, возможность вернутся на предыдущую страницу сайта на любой странице, за исключением главной; 2) доступность любой страницы сайта с использованием не больше трех кликов; 3) наличие ссылок на социальные сети в шапке сайта; 4) навигация должна соответствовать общим требованиям к оформлению и верстке сайта Требования к программному и аппаратному обеспечению сайта: Выбор технических решений обусловлен особенностями требований к веб-ресурсу: 1) веб-сервер Apache не ниже версии 2.2.22 с модулем Rewrite, необходимым для перенаправления страниц; 2) в качестве системы управления базами данных используется MySQL 5.5.25 или выше; 3) взаимодействие с базами данных осуществляется с помощью PhPMyAdmin 3.5.2 или выше; 69 4) хостинг с PHP 5.3.29 или выше; 5) дисковая квота на хостинге 150 Мб или выше; 6) наличие зарегистрированного и корректно настроенного домена. Требования к защите информации, безопасности и сохранности данных: Основные требования к информационной безопасности в системе ограничиваются реализацией механизма управления и контроля доступа к данным. То есть, веб-ресурс должен предусматривать базовую защиту от основных видов атак: межсайтового скриптинга (XSS), SQL-инъекций, CSRF- уязвимостей. Требования к SEO-оптимизации: для улучшения оптимизации сайта должны быть выполнены ряд требований: 1) Валидность и кроссбраузерность кода. 2) Отсутствие скрытых элементов с текстом в шаблоне сайта. 3) CSS-стили и JavaScript-скрипты - должны быть в отдельных файлах .css и .js. 4) Формирование URL страниц сайта должно осуществляться с использованием оптимизированных и лаконичных URL. Это обеспечивает удобство сохранения ссылок пользователями и улучшает рейтинг сайта с позиции поисковых систем, то есть также служит методом SEO-оптимизации сайта. Структуру оптимизированного URL необходимо представлять в виде иерархии. 5) Сайт должен пройти проверку подлинность в поисковых системах Google и Yandex. Требования по кроссбраузерности: пользовательский интерфейс должен идентично отображаться в следующих браузерах настольных и мобильных операционных систем: 1) Internet Explorer 11; 2) Mozilla Firefox версии 50.2. и выше; 3) Safari версии 5 и выше; 4) Google Chrome версии 50 и выше; 5) Opera версии 40 и выше; 6) Яндекс. Браузер версии 16.9 и выше; 7) Microsoft Edge версии 38 и выше; 8) Mobile Chrome версии 30 и выше. Все основные элементы управления и навигации веб-ресурса должны поддерживать сенсорные экраны. 70 ПРИЛОЖЕНИЕ Б Программный код Web-страниц INDEX.PHP /** * Front to the WordPress application. This file doesn't do anything, but loads * wp-blog-header.php which does and tells WordPress to load the theme. * * @package WordPress */ /** * Tells WordPress to load the WordPress theme and output it. * * @var bool */ define( 'WP_USE_THEMES', true ); /** Loads the WordPress Environment and Template */ require( dirname( __FILE__ ) . '/wp-blog-header.php' ); WP-MAIL.PHP - ?РНР /** 71 * Получает сообщение электронной почты из почтового ящика пользователя для добавления как * WordPress пост. Сведения о подключении к почтовому ящику должны быть * настройка В разделе Параметры > запись * * @WordPress пакет */ / * * Убедитесь, что WordPress bootstrap запущен, прежде чем продолжить. */ требуется( имя_каталога( __файл__ ) . '/РГ-нагрузка.на PHP' ); / * * Этот фильтр задокументирован в wp-admin / options.РНР */ если ( ! apply_filters ('enable_post_by_email_configuration', true ) ) { wp_die (__('это действие было отключено администратором.'), 403 ); } $mailserver_url = get_option ('mailserver_url' ); если ... mail.example.com ' = = = $mailserver_url / / пустой ($mailserver_url ) ) { wp_die (__('это действие было отключено администратором.'), 403 ); } /** * Пожары, чтобы позволить плагину сделать полное поглощение почты по электронной почте. * * @с 2.9.0 */ do_action ('wp-mail.на PHP' ); / * * Получите класс POP3 для доступа к почтовому ящику. */ require_once (ABSPATH . WPINC . '/class-pop3.на PHP' ); / * * Проверьте наличие новых сообщений только через этот интервал. */ если ( ! определено ('WP_MAIL_INTERVAL' ) ) { define ('WP_MAIL_INTERVAL', 300); / / 5 минут 72 } $last_checked = get_transient ('mailserver_last_checked') ); если ( $last_checked ) { wp_die (__('притормози ковбой, не нужно так часто проверять новые письма!' ) ); } set_transient ('mailserver_last_checked', true, WP_MAIL_INTERVAL ); $time_difference = get_option ('gmt_offset') * HOUR_IN_SECONDS; $phone_delim = '::'; $протокол POP3 = новый протокол POP3(); если ( ! $pop3 - >connect (get_option ('mailserver_url'), get_option( 'mailserver_port'))||! $pop3 - >пользователь (get_option ('mailserver_login' ) ) ) { wp_die( esc_html( $протоколов POP3->ошибка ) ); } $count = $pop3 - >pass (get_option ('mailserver_pass' ) ); если (false = = = $count ) { wp_die( esc_html( $протоколов POP3->ошибка ) ); } если (0 === $count ) { $для POP3->выход(); wp_die (__("кажется, нет никакой новой почты.' ) ); } for ($i = 1; $i < = $ count; $i++ ) { $message = $pop3 - >get ($i ); $bodysignal = false; $ boundary = "; $charset = "; $содержание = "; $content_type = "; $content_transfer_encoding = "; 73 $post_author = 1; $author_found = false; foreach ($message как $строка ) { / Сигнал тела. если (strlen ($line ) < 3 ) { $bodysignal = true; } if ($bodysignal ) { $содержание. = $линия; } еще { if (preg_match ('/Content-Type: /i', $line ) ) { $content_type = trim ($line ); $content_type = substr ($content_type, 14, strlen ($content_type ) - 14 ); $content_type = explode ( ' ;', $content_type ); если ( ! пустой( $content_type[1] ) ) { $charset = взорвать ( ' = ' , $content_type[1] ); $charset = (! пустой ($charset[1]))? отделка ($charset[1]):"; } $content_type = $content_type[0]; } if (preg_match ('/Content-Transfer-Encoding: /i', $line ) ) { $content_transfer_encoding = trim ($line ); $content_transfer_encoding = substr ($content_transfer_encoding, 27, strlen ($content_transfer_encoding ) - 27 ); $content_transfer_encoding = explode ( ' ;', $content_transfer_encoding ); $content_transfer_encoding = $content_transfer_encoding[0]; } 74 if (($content_type = = 'multipart / alternative') & & (false !== strpos ($line, ' граница="' ) ) && ( " == $граница ) ) { $boundary = trim ($line ); $граница = взорваться( '"', $границей ); $boundary = $граница[1]; } if (preg_match ('/Subject: / i', $line ) ) { $предмет = "Трим" ( $строка ); $предмет = функцию substr( $заголовок, 9, функция strlen( $объект ) - 9 ); // Захватывает любой текст в теме перед $phone_delim в качестве темы if (function_exists ('iconv_mime_decode' ) ) { $subject = iconv_mime_decode ($subject, 2, get_option ('blog_charset' ) ); } еще { $subject = wp_iso_descrambler ($subject ); } $subject = explode( $phone_delim, $subject ); $subject = $subject[0]; } /* * Установите автора, используя адрес электронной почты (From или Reply-To, последний используемый) * в противном случае используйте администратора сайта. */ если ( ! $author_found & & preg_match ( '/^(From|Reply-To): /', $line ) ) { if (preg_match ('/[a-z0-9_.- ] +@[a-z0-9_.- ] +(?!.*<) / i', $line, $matches ) ) { $author = $matches[0]; } еще { 75 $author = trim ($line ); } $author = sanitize_email( $author ); if ( is_email ($author ) ) { / * переводчики: почтовый адрес электронной почты автора */ Эхо '<Р>' . sprintf (__('Author is %s'), $author). ''; $userdata = get_user_by ('электронная почта', $author ); если ( ! пустой( $данных ) ) { $post_author = $userdata - > ID; $author_found = true; } } } if (preg_match ('/Date: / i', $line)) {//формы '20 Mar 2002 20: 32: 37 +0100' $ddate = str_replace ('Date:',", trim ($line ) ); $ddate = preg_replace ('!\с.(\*+\) \s*$!', ", $ddate ); / / удалите строку часового пояса в скобках, если она существует, так как это путает strtotime $ddate_U = strtotime ($ddate ); $post_date = gmdate ('Y-m-d H:i: s', $ddate_U + $time_difference ); $post_date_gmt = gmdate ('Y-m-d H:i: s', $ddate_U ); } } } // Установить $post_status на основе $author_found и возможности publish_posts автора 76 if ($author_found ) { $user = новый WP_User( $post_author ); $post_status = ($user->has_cap ('publish_posts' ) ) ? 'опубликовать' : 'в ожидании'; } еще { // Автор не найден в БД, установите статус ожидающий. Автор уже админ. $post_status = 'в ожидании'; } $subject = trim ($subject ); if ($content_type = = 'multipart / alternative' ) { $content = explode ('--'. $ граница, $содержание ); $content = $content[2]; // Сопоставление без учета регистра содержимого-передача- кодирование. если ( функция preg_match( '/содержание-передача-кодирование: кавычки-печатаемый/я', $содержание $делим ) ) { $content = взорвать ($delim[0], $content ); $content = $content[1]; } $содержание = strip_tags( $контента, '<ИМГ><п><БР><я><б><у><них><сильный><удар><шрифта><охватывают>< див>' ); } $содержание = "Трим" ( $контент ); /** * Фильтрует исходное содержимое письма. * * Дайте Post-By-Email расширения плагинов полный доступ к контенту, либо * необработанное содержимое или содержимое последнего цитируемого раздела для печати. 77 * * @с 2.8.0 * * @ param string $content исходный контент электронной почты. */ $content = apply_filters ('wp_mail_original_content', $content ); если ( ложь !== stripos ($content_transfer_encoding, 'quoted-printable' ) ) { $content = quoted_printable_decode( $content ); } if (function_exists ('iconv')&&! пустой( $кодировку ) ) { $содержание = с iconv( $charset, то get_option( 'blog_charset' ), $содержания ); } // Захватывает любой текст в теле после $phone_delim в качестве тела $содержание = взорваться( $phone_delim, $содержания ); $content = пустой ($content[1])? $content[0]: $content[1]; $содержание = "Трим" ( $контент ); /** * Фильтрует содержимое сообщения, отправленного по электронной почте перед сохранением. * * @с 1.2.0 * * @ param string $content содержимое электронной почты. */ $post_content = apply_filters ('phone_content', $content ); $post_title = xmlrpc_getposttitle( $content ); если ( $post_title == " ) { $post_title = $subject; 78 } $post_category = array (get_option ('default_email_category' ) ); $post_data = compact ('post_content', 'post_title', 'post_date', 'post_date_gmt', 'post_author', 'post_category', 'post_status' ); $post_data = wp_slash( $post_data ); $post_ID = wp_insert_post( $post_data ); if (is_wp_error ($post_ID ) ) { Эхо "\п" . $post_ID - >get_error_message(); } / По какой-то причине мы не могли отправить сообщение. Лучше перейти к следующему письму. if (пустой ($post_ID ) ) { продолжать; } /** * Пожары после публикации сообщения, отправленного по электронной почте. * * @с 1.2.0 * * @param int $post_ID идентификатор сообщения. */ do_action ('publish_phone', $post_ID ); Эхо " \n ". _("Автор:"). ' esc_html ($post_author). ''; Эхо " \n ". __ ('Posted title:'). ' esc_html ($post_title). ''; если ( ! $pop3 - >удалить ($i ) ) { Эхо '<Р>' . функции sprintf( / * переводчики: %s: ошибка POP3 */ 79 __ ('Oops: %s' ), esc_html( $протоколов POP3->ошибка ) ) . ''; $протоколов POP3->сброс(); выход; } еще { Эхо '<Р>' . функции sprintf( / * переводчики: %s: идентификатор сообщения */ _("Миссия завершена. Сообщение на %S удален.' ), '<сильный. '> $я. ' ) . ''; } } $для POP3->выход(); WP-ACTIVATE.PHP ?РНР /** * Подтверждает, что ключ активации, отправленный по электронной почте после подписания пользователем * up для нового сайта соответствует ключу для этого пользователя, а затем отображает подтверждение. * * @WordPress пакет */ define ('WP_INSTALLING', true ); / * * Настройка среды WordPress. */ 80 требуется( имя_каталога( __файл__ ) . '/РГ-нагрузка.на PHP' ); требуется( имя_каталога( __файл__ ) . '/wp-blog-header.на PHP' ); если ( ! is_multisite() ) { wp_redirect( wp_registration_url() ); умереть(); } $valid_error_codes = массив ('already_active', 'blog_taken' ); list ($activate_path ) = взорвать ('?', wp_unslash ($_SERVER ['REQUEST_URI'] ) ); $activate_cookie = ' wp-активировать-' . COOKIEHASH; $key = "; $result = null; если ( isset и (переменная $_GET['ключ'] ) && isset и( $_POST, где['ключ'] ) & & переменная $_GET['ключ'] !== $_POST ['key'] ) { wp_die (__('обнаружено несоответствие ключевого значения. Пожалуйста, перейдите по ссылке в письме активации.'), __( 'Произошла ошибка при активации ), 400 ); } elseif (! пустой( $_GET ['key'] ) ) { $key = $_GET ['key']; } elseif (! пустой ($_POST ['key'] ) ) { $key = $_POST ['ключ']; } если ( $ключ ) { $redirect_url = remove_query_arg( 'ключ' ); 81 if ($redirect_url !== remove_query_arg (false ) ) { setcookie ($activate_cookie, $key, 0, $activate_path, COOKIE_DOMAIN, is_ssl (), true ); wp_safe_redirect ($redirect_url ); выход; } еще { $result = wpmu_activate_signup( $key ); } } если ( $результат === значение null && использования isset( $их помощью[ $activate_cookie ] ) ) { $key = $_COOKIE[ $activate_cookie ]; $result = wpmu_activate_signup( $key ); cookie посредством setcookie( $activate_cookie, ' ', Time () в - YEAR_IN_SECONDS, $activate_path, COOKIE_DOMAIN, is_ssl(), правда ); } если ($result === null | | (is_wp_error ($result ) & & 'invalid_key' = = = $result - >get_error_code() ) ) { status_header (404 ); } elseif ( is_wp_error ($result ) ) { $error_code = $result - >get_error_code(); если ( ! in_array ($error_code, $valid_error_codes ) ) { status_header (400 ); } } nocache_headers(); 82 if (is_object ($wp_object_cache ) ) { $wp_object_cache - >cache_enabled = false; } // Исправить заголовок страницы $wp_query - >is_404 = false; /** * Срабатывает до загрузки страницы активации сайта. * * @с 3.0.0 */ do_action ('activate_header' ); /** * Добавляет крючок действия, специфичный для этой страницы. * * Запускает {@see 'wp_head'}. * * @since MU (3.0.0) */ функция do_activate_header() { /** * Срабатывает до загрузки страницы активации сайта. * * Запускает действие {@see 'wp_head'}. * * @с 3.0.0 83 */ do_action ('activate_wp_head' ); } add_action ('wp_head', 'do_activate_header' ); /** * Загружает стили, относящиеся к данной странице. * * @since MU (3.0.0) */ функция wpmu_activate_stylesheet() { ?> |