Moushe.ru

Блог обо всём

Создание магазина BearStore (5 часть)



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

1_thumb.jpg10

Задачи на сегодня:

1. Отключим языки и валюты

2. Создадим несколько страниц

3. Работаем с логотипом

4. Работаем с меню навигации

5. Добавим контакты и часы работы в шапку магазина

Приступим:

1. Так как у нас будет небольшой интернет магазинчик то огромный выбор валют и языков нам не нужен – значит будем отключать. Зайдём в админку нашего магазина и переходим по меню:

Система – Настройки – Изменить –Локализация – Валюта – Рубль (если у вас иная валюта, то выберите её) – нажимаем кнопку Сохранить.

Система – Локализация – Языки – ставим галочку напротив английского языка и жмём кнопку удалить.

Система – Локализация – Валюты – Ставим галочки напротив ненужных валют и жмём кнопку удалить.

2. Давайте создадим стандартные для большинства интернет магазинов страницы:

Оплата и доставка, Контакты.

Откроем админку – Каталог – Статьи – Добавить – Вводим заголовок Оплата и доставка, вставляем в статью этот текст:

Уважаемые покупатели! Мы осуществляем доставку по Москве и ближайшему Подмосковью.

Самовывоз:

Уважаемые покупатели, существует возможность самовывоза товара.

Адреса высвечиваются при оформлении заказа, к стоимости товара НЕ добавляется стоимость доставки.

Процедура проста: Вы делаете заказ, менеджер связывается с Вами, после этого можно подъезжать и забирать товар.

Доставка:

в пределах МКАД курьер до 10 кг: 250 руб

в пределах МКАД курьер свыше 10 кг: 500 руб

в пределах МКАД автотранспортом: от 800 до 1200 руб (в зависимости от района)

за МКАД: от 600руб (рассчитывается индивидуально)

Время:

Доставка осуществляется только в рабочие дни. При условии размещения заказа до 18-00 — заказ будет доставлен на следующий день.

Рабочие дни: понедельник — пятница.

Рабочие часы: с 10.00 до 18.30.

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

Формы оплаты:

1. Наличный расчет — деньги передаются непосредственно курьеру при доставке.

Дополнительная информация:

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

При необходимости дополняете текст нужной информацией,  переходим на вкладку данные и впишем в Seo Url это: oplata_dostavka, напротив Футера ставим галочку:

2

Откроем админку – Каталог – Статьи – Добавить – Вводим заголовок Контакты, вставляем в статью необходимый текст:

В моём случае это Адрес, телефон, карта яндекс, информация о фирме:

3

При необходимости дополняете текст нужной информацией,  переходим на вкладку данные и впишем в Seo Url это: contacts, напротив Футера ставим галочку:

4

После этого я удаляю ненужные статьи: Условия соглашения, Политика Безопасности, О нас.

Смотрим результат:

5

3. Найдём на фотостоках симпатичную картинку:

http://ru.freepik.com/free-vector/teddy-bears-with-hearts-of-valentine_686304.htm

Обрабатываем понравившуюся нам картинку, правим размеры, добавляем название магазина и тд:

logomy

Я использовал png формат из за поддержки прозрачности, если я захочу изменить фон шапки мне не придётся переделывать логотип.

Открываем админку – Система – Настройки – Изменить – Изображения – Логотип, выбираем нашу картинку – Сохранить.

Смотрим результат:

6

Из-за большого размера логотипа (190px x 300px) наш медведь “улетел” за пределы шапки, будем исправлять.

Откроем stylesheet.css и вместо этих строк (144-155):

#header {
height: 90px;
margin-bottom: 7px;
padding-bottom: 4px;
position: relative;
z-index: 99;
}
#header #logo {
position: absolute;
top: 33px;
left: 15px;
}

вставим эти:

#header {
height: 200px;
margin-bottom: 7px;
padding-bottom: 4px;
position: relative;
z-index: 99;
}
#header #logo {
position: absolute;
top: 10px;
left: 0px;
}

Смотрим результат:

7

Теперь всё отлично смотрится. Улыбка

4. Давайте удалим не нужные в меню навигации ссылки – корзина, оформление заказа и добавим необходимые доставка и оплата, контакты. Откроем файл header.tpl и вместо этих строк (88-89):

<a href="<?php echo $shopping_cart; ?>"><?php echo $text_shopping_cart; ?></a>|
<a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a>

вставим эти:

<a href="oplata_dostavka">Оплата и доставка</a>|
<a href="contacts">Контакты</a>

Смотрим результат:

8

5. Откроем header.tpl и после этих строк (80-82):

<?php echo $language; ?>
<?php echo $currency; ?>
<?php echo $cart; ?>

вставим эти:

<div id="contacts">
Наш адрес:<br>
г. Москва ТК “Савёловский”<br>
ул. Сущёвский вал 5 стр. 1А<br>
Павильон F-51
</div>
<div id="mobile">
<div id="big_mobile"> +7 (925) 206 20 98</div>
<div id="mini_mobile">справочная служба</div>
<div id="big_mobile"> +7 (925) 206 20 98</div>
<div id="mini_mobile"> отдел продаж</div>
<div id="middle_mobile"> c 10:00 до 21:00</div>
</div>

(потом измените под себя, когда расположим блоки в нужном месте шапки)

Смотрим результат:

9

Откроем stylesheet.css и после этих строк (144-155):

#header {
height: 200px;
margin-bottom: 7px;
padding-bottom: 4px;
position: relative;
z-index: 99;
}
#header #logo {
position: absolute;
top: 10px;
left: 0px;
}

вставим эти:

#header #contacts {
position: absolute;
top: 60px;
right: 200px;
font-size: 18px;
}
#header #mobile {
position: absolute;
top: 50px;
right: 500px;
text-align: center;
}
#big_mobile {
font-size: 18px;
}
#mini_mobile {
font-size: 14px;
padding-bottom: 10px;
}
#middle_mobile {
font-size: 16px;
color: #b3b747;
}

Смотрим результат:

10

В следующем уроке чуть уменьшим шапку, а то сейчас у нас очень много пустого пространства, добавим пару иконок и будем работать с центральной частью шаблона. На сегодня всё, до встреч.

23 Комментария

  1. Точно нужно удалять ? а то у меня корзина после этого пропала

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      10.04.2014 at 23:11

      Можете просто отключить, корзина пропасть не должна если вы конечно не удалили валюту выбранную по умолчанию.

  2. Кирилл

    12.04.2014 at 04:04

    Подскажи пожалуйста как сделать выпад подкатегорий примерное как на сайте

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      12.04.2014 at 10:49

      Google Chrome — наводим курсор на выпадающее меню — ПКМ — просмотреть код элемента и смотрим CSS стили подстраивая под свой магазин.

  3. Васик

    13.04.2014 at 12:50

    Спасибо за полезную статьи!

  4. Алексей

    15.04.2014 at 21:10

    Владислав, спасибо за то, что Вы делаете!

    У меня вопрос — хочу удалить статьи: — о нас, — политика безопасности — выдает в админке следующее:

    «Эту страницу нельзя удалить, поскольку она назначена Условиями соглашения по-умолчанию!»

    Что посоветуете?

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      15.04.2014 at 23:38

      Админка — Система — Настройки — Изменить — Опции — Условия использования аккаунта: не выбрано и Условия оформления заказа: не выбрано — Сохранить — удаляйте эти страницы.

  5. Алексей

    16.04.2014 at 11:16

    Владислав, спасибо!

    Продолжаю следить за Вашими темами!

  6. Михаил

    20.04.2014 at 10:51

    А сделайте пожалуйста подробный урок о том, как сделать так, чтобы админу приходило нормальное письмо с информацией о заказе в таком же формате как и юзеру, во время покупки, только с соответствующим текстом для админа. А то сейчас админу приходит какое-то ущербное письмо с недостающими данными о заказе и пользователе. Неплохо бы чтобы в письме и админу и юзеру была ссылка на url товара и картинка товара. Речь идет о версии opencart 1.5.5.1.1

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      20.04.2014 at 21:46

      На myopencart.com (форум) и так есть материалы по этой теме, и довольно подробные.

  7. не срабатывают ссылки (Seo Url) в меню ! какие настройки надо сделать? Включить ЧПУ?

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      16.06.2014 at 21:38

      Да и переименовать htaсcess

  8. Владислав, добрый день!

    шаг 4
    ссылки «Контакты» и «Оплата и доставка» появляются в меню, но если по ним перейти появится это:

    Not Found
    The requested URL /oplata_dostavka was not found on this server.
    Подсказка Денвера
    Вы ошиблись при наборе URL в браузере. Вероятнее всего, сервер пытается найти файл M:/home/sait.ru/www/oplata_dostavka, которого не существует.
    В случае использования CGI-скриптов, корректные пути к CGI-директориям следующие:
    URL Куда указывает
    http://***/cgi-glob/script.cgi /home/cgi-glob/script.cgi
    http://***/cgi/script.cgi /home/***/cgi/script.cgi
    http://***/cgi-bin/script.cgi /home/***/cgi-bin/script.cgi

    ( .htaccess — вроде имя правильно, Включить ЧПУ: да )

    Пожалуйста, посоветуйте, как решить проблему?

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      20.09.2014 at 10:56

      Возможно вы для статей заполнили SEO URL одним словом, а в header прописали другое слово или допустили ошибку.

  9. Владислав, здравствуйте еще раз! Спасибо за быстрый ответ!
    1)на сей раз, вместо Денвера использовал ОпенСервер
    2)установил ВиКю Мод, чётко по инструкции, сделал .htaccess(без.тхт), удалил readme.md
    3)повторил всё пошагово без отклонений, SEO URL в статьях и в коде одинаковы, проверил.

    проблема осталась та же — «Контакты» и «Оплата и доставка» видно на панели, но они не срабатывают — пишет ошибку #404 Object not found!
    Лезу в админпанель, включаю ЧПУ, чищю куки. всеравно не срабатывает.
    Мне очень, очень хочется чтобы оно работало, должен быть способ.

    Заранее спасибо!

    • да, забыл. может проблема в моей версии ocStore-1.5.5.1.2??

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      20.09.2014 at 20:30

      У вас OpenCart установлен в корень localhost или в дополнительную папку? Если в доп. папку то внимательно смотрите readme.txt и .htacess там указано что и куда необходимо дописать.

  10. путь к сайту такой
    C:\OpenServer\domains\localhost\15511
    в таком положенни не срабатывают ссылки «Контакты» и «Оплата и доставка»

    Делаю эксперимент:

    1)вырезаю все файлы из папки 15511 и вставляю уровнем выше
    C:\OpenServer\domains\localhost\ — Так сайт не раотает вообще)

    2)копирую все файлы сайта из 15511 и вставляю уровнем выше в localhost\
    т.е. по факту 2 комплекта файлов в папках 15511 и localhost\
    Так работают все ссылки, на вид все идеално(улыбка на лице), но таким образом я лишь маскирую проблему.

    Открываю .htaccess вижу это

    RewriteBase /
    RewriteRule ^sitemap.xml$ index.php?route=feed/google_sitemap [L]
    RewriteRule ^googlebase.xml$ index.php?route=feed/google_base [L]
    RewriteRule ^download/(.*) /index.php?route=error/not_found [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} !.*\.(ico|gif|jpg|jpeg|png|js|css)
    RewriteRule ^([^?]*) index.php?_route_=$1 [L,QSA]

    (Я вижу, что в строках есть ссылки на базы гугл. Я нахожусь в Китае, тут сервисы гугл забанены. может проблема в этом? — Мысли вслух)

    в интернете есть множество модификаций файла .htaccess, которые предлагают копировать и вставить либо же вставить и в определенных строках дописать путь к своему сайту(я вписываю http://localhost/15511/ т.к сервер локальный)
    Я пробовал всё, что смог найти но результата нет.(возможно, я не правильно это делаю из-за отсутствия определенных навыков.)

    Владислав подскажыте плиз, есть ли шанс это всё наладить?
    что мне нужно для этого сделать? Спасибо!

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      21.09.2014 at 14:47

      # If your opencart installation does not run on the main web folder make sure you folder it does run in ie. / becomes /shop/

      Допишите ниже это:

      RewriteBase /15511/

  11. Добрый вечер. Аналогичная проблема с Виктором. Все проверил, ошибок нет. Выдает точно такое же сообщение.

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      26.09.2014 at 21:03

      Ответ Виктору видели? Делайте тоже самое.

  12. Оксана

    14.11.2016 at 21:17

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

Добавить комментарий

Your email address will not be published.

*

CAPTCHA image
*

© 2016 Moushe.ru При копировании материалов, ссылка на нас обязательна!

Вверх ↑



Яндекс.Метрика