Как сделать для сайта корзину
Как сделать корзину на сайте интернет-магазина и увеличить средний чек
Дата публикации: 2017-02-28
От автора: если вам нужно увеличить средний чек в интернет-магазине, то одно из наиболее простых и логичных решений, которые приходят в голову, — это создание онлайн-корзины для покупателя. С ее помощью человек сможет приобрести не один товар, а сразу несколько за раз. Решение кажется банальным, однако, многие предприниматели до сих пор не пришли к нему. Прочитайте эту статью, если хотите узнать, как сделать корзину на сайте интернет-магазина быстро и правильно.
В любом более-менее крупном обычном магазине посетителю на входе предлагается специальная тара, куда он сможет складывать свои покупки. Еще в ХХ в. это решение было введено для клиентов не только для удобства переноса товаров, но и для стимулирования совершения как можно большего числа покупок. Согласитесь, как-то глупо зайти в магазин, взять корзину и переносить в ней одну маленькую пачку чипсов? Обязательно, так или иначе, добросишь чего-нибудь запить.
Примерно таким же образом действует и корзина в интернет-магазине. Она значительно упрощает процесс приобретения нескольких товарных позиций и увеличивает средний чек. Разумеется, фактор «давления» на покупателя существенно ниже по сравнению с офлайн-точками за счет отсутствия физической необходимости переносить товар и ходить с пустой тарой перед другими людьми, однако, он все же присутствует.
Находитесь на самом старте создания онлайн-проекта? Тогда лучше начните с базовых курсов по разработке интернет-магазина. Уже более-менее знаете толк в этой теме? Тогда переходим непосредственно к созданию веб-корзины для сайта.
Бесплатный курс по PHP программированию
Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC
В курсе 39 уроков | 15 часов видео | исходники для каждого урока
Пошаговая инструкция по созданию корзины
Существуют разные версии корзин, однако, мы рассмотрим разработку классического модуля для интернет-магазинов, созданного на базе PHP. Как правило, его размещают на видном месте — в шапке сайта в правом верхнем углу. Маленькая корзина представляет собой своеобразный индикатор, показывающий, сколько товаров, и на какую сумму вы собираетесь приобрести.
Итак, пошаговая инструкция по тому, как создать корзину для интернет-магазина:
1. Откройте файл под названием header.php. Он находится в корневой папке вашего сайта. Далее вставьте в верстку базовые значения нашей будущей корзины:
2. Чтобы корзина обладала простым и гармоничным видом, добавьте в файл style.css следующие стили:
После этого уже можете взглянуть на визуальные изменения во внешнем виде интернет-магазина.
3. Теперь нам с вами нужно углубиться в системную структуру корзины. В связи с тем, что модуль корзины не является отдельной страницей, дополнительный контроллер под нее можно не создавать. Внешний вид уже отображен в шаблоне, поэтому разработку views не делаем. Ограничимся лишь проработкой параметра model.
Для этого зайдите в папку application, а затем в models. После этого создайте файл с названием cart.php. В него добавляете следующее содержание:
Бесплатный курс по PHP программированию
Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC
В курсе 39 уроков | 15 часов видео | исходники для каждого урока
Эта модель позволить обновлять данные, содержащиеся в содержимом модуля корзины. Пока что хватит лишь функции добавления товара, однако, на будущее необходимо разработать специальные интерфейсы, чтобы была возможность удалить определенный товар или же очистить корзину целиком.
Таким образом, мы получили готовую базу Application_Models_Cart. Теперь необходимо ее активировать.
4. Перед этим давайте еще внесем изменения в атрибут href для более правильной работы модуля:
Теперь ссылка будет иметь следующий вид: //примерсайта.ru/catalog?in-cart-product-id=1
При нажатии на эту ссылку система mvc перенаправит руководство в раздел application/controllers/catalog.php. В свою очередь, здесь мы тоже внесем небольшие поправки.
5. Вставьте следующий код для нужного нам сценария:
В принципе, на этом можно остановиться. Основа нашего модуля корзины для интернет-магазина готова. Единственное что — давайте еще отдельно заострим внимание на строке Lib_SmalCart::getInstance()->setCartData(), которая была указана в представленном выше коде. Слабо разбирающиеся в ООП люди явно не поймут, в чем заключается ее основная роль в общей структуре, поэтому давайте разберем каждый отдельный кусочек кода:
Lib_SmalCart — позволяет создать модуль класса SmalCart, который расположен в разделе lib.
getInstance() — с помощью этой команды происходит вызов каждой отдельной функции. Основная ее задача — отсеять повторные попытки образования экземпляра того же класса.
setCartData() — позволяет упорядочить информацию о продуктах из корзины и записать сессию в cookies. В свою очередь, это гарантирует пользователям сохранение данных о заказе даже при случайных переходах на другие сайты или вовсе при закрытии страницы браузера.
Чтобы иметь более четкое представление касательно работы корзины, снова откройте файл в разделе lib под названием smalcart.php. После проделанных ранее операций все основные точки соприкосновения станут уже более понятны и логичны. Стоит отметить, что, если cookies будут отключены, тогда механизм работать должным образом не сможет. Связано это с тем, что передача идентификатора сессии осуществляется как раз-таки благодаря этим cookies.
Кстати, если вы профессионально решили заниматься созданием интернет-магазинов или же сайтов разных направленностей, тогда рекомендуем ознакомиться с этим 30-дневным курсом. В нем содержатся фундаментальные знания по разработке адаптивных онлайн-проектов с целью их дальнейшей монетизации. Если хотите на один или даже несколько уровней повысить свою квалификацию, тогда обязательно изучите приведенный выше курс.
Ну как вам? Материал был полезен, и чтение прошло не зря? Тогда поделитесь статьей со своими друзьями и коллегами в социальных сетях. Быть может, кто-то из них как раз не может найти качественное решение этой проблемы.
Спасибо, что читаете наши статьи. С каждым разом мы стараемся преподнести контент в еще более интересном и полезном ключе. Всего доброго, до новых встреч!
Бесплатный курс по PHP программированию
Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC
В курсе 39 уроков | 15 часов видео | исходники для каждого урока
Хотите узнать, что необходимо для создания сайта?
Посмотрите видео и узнайте пошаговый план по созданию сайта с нуля!
Создайте корзину с PHP и MySQL
Russian (Pусский) translation by Yuri Yuriev (you can also view the original English article)
В этом еженедельном уроке screencast + мы научимся создавать собственную корзину покупок с PHP и MySQL. Вы увидите, что всё не так сложно, как кажется.
Предварительный просмотр скринкастов
Шаг 1
Начнём со структуры папок:
Структура
Шаг 2
Начнем с разметки html, а затем её оформления. Откройте index.php и скопируйте/вставьте код:
Как вы видите, наша страница имеет две колонки: основной столбец и sidebar. Теперь пройдём в CSS. Откройте файл style.css и пропишите код:
Вот как теперь выглядит наша страница продуктов:
Полный скринкаст
Шаг 3
Прежде чем перейти к части PHP/MySQL, нам нужно создать базу данных. Откройте phpMyadmin и выполните следующие действия:
Для экономии времени я экспортировал свою таблицу, чтобы вы просто запустили следующий запрос:
Шаг 4
До извлечения данных из базы данных я сделаю index.php шаблон для списка продуктов и корзины. Поэтому добавьте следующий код в начало страницы index.php:
Для этого нам нужно включить файл; добавьте эту строку в index.php между div с id «main»:
Теперь у нас полный index.php:
Давайте создадим соединение с MySQL. Откройте connections.php и пропишите следующее:
Шаг 5
Пропишем разметку для страницы продуктов. Откройте её и введите следующее:
Давайте посмотрим на страницу:
Как видите, это довольно уродливо. Давайте добавим этот CSS.
Выглядит намного лучше, не так ли? Внизу указан полный код style.css:
Шаг 6
Прежде чем извлечь продукт из базы данных, давайте удалим последние две строки из нашей таблицы (были нужны только для того, чтобы увидеть, как она будет выглядеть). Удалить это:
Отлично! Теперь в том месте, где были строки таблицы, введите следующий код PHP:
Если вы укажете одну из ссылок для добавления в корзину, увидите в нижней части страницы, что id передан.
Шаг 7
Давайте сделаем anchor работу, добавив следующий код в начало нашей страницы:
Проверим, установлена ли эта переменная сообщения и вызовите её на страницу (введите этот код под заголовком страницы H1):
Вот полная страница products.php.
Вот сообщение об ошибке, если id недействителен
Шаг 8
Вернёмся к index.php и пропишем sidebar. Добавьте следующий код:
Посмотрите на картинку снизу:
Шаг 9
Наконец, откройте cart.php и введите код:
Он похож на код из index.php и products.php, поэтому я не буду объяснять всё снова. Вы заметили, что количество теперь отображается не в форме, а в поле ввода (чтобы мы могли изменять количество). Кроме того, таблица заключена в form tag. Чтобы получить общую стоимость элементов, мы умножаем количество конкретного продукта (из сеанса) id на его цену. Это повторяется в каждом цикле.
Шаг 10
Наконец, нам нужно заставить форму работать. Поэтому добавьте этот код в начало страницы cart.php.
Вот заполненный cart.php
Надеюсь, урок вам понравился. Если появятся вопросы, посмотрите более подробный видеоурок!
Корзина для интернет магазина php
Здравствуйте уважаемые читатели блога LifeExample, сегодня мы продолжим создавать интернет магазин с помощью PHP и реализуем еще несколько его модулей собственными руками. В прошлой части урока мы реализовали такие компоненты как каталог, карточка товара, и ЧПУ, а также сделали задел для системы наполнения каталога. Сегодня мы будем заниматься разработкой маленькой корзины для интернет магазина.
Пока я не начал описывать рабочий процесс, хочу выразить благодарность первым комментаторам, задающим толковые вопросы, а также тем людям, которые отсылают свои вопросы на мой контактный адрес. Спасибо, за то, что вы есть, и за то, что помогаете мне своими вопросами найти силы не опускать руки, по данному проекту и продолжать его развитие.
Еще хочу заметить, весь код, который я представляю, не претендует на 100% правильность и в ваших силах найти в нем ошибки и оптимизировать, так как вы считаете нужным. Целью данного проекта является не дать вам готовую «болванку» интернет магазина, а научить всех желающих мыслить и самостоятельно разрабатывать PHP программы. Теперь давайте перейдем к процессу разработки нашей системы.
Предлагаю сразу скачать материалы по данному уроку, для наглядности наших дальнейших действий.
Приступим. Какой же интернет магазин без корзины, в которую можно положить товар? Правильно, таких магазинов не существует, поэтому сейчас мы разработаем скрипт для маленькой корзины.
Маленькая корзина для интернет магазина
Под термином маленькая корзина, я понимаю тот интерфейс представления отложенных для покупки товаров, который, как правило, размещается в шапке сайта.
Маленькая корзина служит своеобразным индикатором для посетителей, по которому пользователь может ориентироваться в количестве отложенных товаров и итоговой сумме заказа.
С первого взгляда, кажется, что нет ничего проще, чем реализовать подобную вещь, с помощью сессии, но существует ряд подводных камней. Например, если поставить задачу: чтобы при возврате пользователя на сайт корзина была наполнена теми же товарами, что и на момент его выхода. В этом случае просто сессией не обойдешься.
Существует несколько способов решения данной задачи:
В большинстве случаев второй вариант подходит лучше первого, поэтому мы его и разработаем. Т.е. в итоге у нас корзина должна работать в связке session + cookies
Приступим, отрываем header.php и вставляем в верстку вывод нашей корзины:
Можете посмотреть на то, как изменился внешний вид сайта. Теперь давайте углубимся в структуру системы и начнем создавать нужные файлы.
Так как компонент маленькая корзина для интернет магазина не является отдельной страницей, то контроллера для нее мы создавать не будем, внешнее представление у нас уже есть в общем шаблоне, поэтому и отдельного views она тоже иметь не будет, а вот model все-таки придется сделать.
В папке \application\models\ создадим файл cart.php с таким содержанием:
Данная модель будет обновлять информацию о содержимом корзины. Пока нам достаточно иметь только функцию добавления товаров, но на будущее создадим интерфейсы для функций удаления товаров и отчистки корзины.
Все данные о продуктах из корзины, у нас будут храниться в массиве $_SESSION в виде ассоциативного массива, ключами которого будут ID продуктов, а значением – количество этих продуктов в корзине. Такой минимализм сыграет нам на руку при передаче этой информации в куки.
Теперь у нас есть модель Application_Models_Cart, и логично предположить, что она должна, откуда-то вызываться. Вызываться модель будет из контролера каталога. Почему каталога? Потому, что ссылки ‘В корзину‘ у нас расположены на странице каталога, завязанной на файлах view-controler-model относящихся к компоненту catalog. А еще и потому, что пока переходить на страницу большой корзины мы не будем. При нажатии на данные ссылки, мы должны оставаться на странице каталога, а информация в маленькой корзине должна изменяться.
В результате получим ссылку вида
При клике пользователя на данную ссылку, mvc-система передаст управление в application /controllers/catalog.php. Куда мы сейчас вставим нужный код обработчика данного события:
Так как мы пока не знаем что такое AJAX и без перезагрузки страницы никак не сможем обойтись, мы просто возвращаемся на страницу каталога, для того чтобы увидеть изменения в корзине. (Об основах AJAX можно прочесть тут.)
На этом можно было бы остановиться, если бы не стояла задача сохранения информации при возвращении пользователя после закрытия браузера. Самое время вернуться к пропущенной строчке:
Стоит предупредить, что далее людям, мало разбирающимся в ООП, будет сложно понять код построчно, но в рамках общего смысла не будет ничего сложного. Что же происходит в этой строке:
Помните первым шагом в этой статье мы в header.php вставили код:
Так вот, теперь вы наверняка понимаете, откуда берется данный массив $smal_cart и можете заметить, что логическая цепочка обмена информации замкнулась.
Стоит заметить, что при отключенных куках, данный механизм функционировать не будет, ровно также как и любой механизм, использующий сессии, так как идентификатор сессии для ее корректной работы хранится и передается все теми же кукмами.
Всем тем, кому требуются более тщательные объяснения, советую писать вопросы в комментариях, либо мне на e-mail.
Сегодня мы добавили немало кода, который требуется обмозговать и переварить, прежде чем преступать к следующим частям магазина. Надеюсь, что у вас не возникнет трудностей с пониманием данной статьи “Корзина для интернет магазина php”. Если вы еще не подписались на e-mail или rss рассылку, не стесняйтесь — подписывайтесь. Скачать листинг данного урока можно по ссылке:
Читайте также похожие статьи:
Чтобы не пропустить публикацию следующей статьи подписывайтесь на рассылку по E-mail или RSS ленту блога.