Як створити інтернет-магазин

189
  • Прописуємо URL магазину і створюємо пункт меню
  • Налаштування версій сторінок для друку в Виртуемарте
  • Налаштовуємо вигляд сторінок категорій і товарів в VirtueMart
  • У попередній статті цієї серії ми розглянули глобальні налаштування VirtueMart (компонента інтернет магазину для Joomla), розташовані на вкладці «Загальні». Сьогодні ми буде розбиратися з його зовнішнім виглядом і функціоналом, щоб заточити це розширення під ваші конкретні завдання.

    Як створити інтернет-магазин

    Для того, щоб провести настройку, потрібно зайти в адмінку цього компонента (в адмінці Джумлы вибрати з верхнього меню «Компоненти» — «VirtueMart») і відкрити групу меню «Налаштування», де вибрати аналогічний пункт. На вкладці «Безпека» важливою опцією є поле «Site URL», у якому повинен бути прописаний адреса (URL) вашого магазину.

    Прописуємо адреса для магазину VirtueMart і створюємо пункт меню для переходу в нього з сайту

    При зміні доменного імені (див. докладніше про домени) вашого ресурсу, наприклад, при перенесенні його з локального сервера Denwer або ОпенСервер на реальний хостинг, ви можете заздалегідь змінити адресу (URL) вашого магазину на базі Виртуемарт в полі «Site URL», а вже потім здійснювати перенесення файлів на хостинг (читайте про резервне копіювання і перенесення).

    Якщо ви цього не зробите, то при спробі зайти в адмінку VM вас буде перекидати за старою адресою, прописаному в полі «Site URL» на вкладці «Безпека» глобальної конфігурації цього компонента.

    Розірвати це замкнене коло можна, отримавши доступ до файлів вашого проекту по FTP і відкривши на редагування файл administrator/components/com_virtuemart/virtuemart.cfg.php.

    Знайдіть у цьому файлі рядки:

    // these path and url definitions here are based on the Joomla! Configuration
    define( ‘URL’, ‘http://vash-sait.ru/’ );
    define( ‘SECUREURL’, ‘http://vash-sait.ru/’ );

    і пропишіть там поточний Урл вашого інтернет магазину (скорочено — ЇМ). Збережіть зроблені зміни і тепер ви зможете без проблем заходити в адмінку VM.

    Ще однією важливою опцією настройки на вкладці «Безпека» є полі «Дозволити адміністрування через магазин користувачам, не допущеним в панель адміністрування». Після активації цієї опції відвідувачі, які володіють відповідними правами, отримають можливість додавати предмети продажу і адмініструвати ЇМ безпосередньо з зовнішнього інтерфейсу (Front Page) Joomla.

    Для цього їм буде доступна посилання в головному модулі Виртуемарт, після того, як вони пройдуть авторизацію на сайті ІМ.

    На основі цього посилання, скопійованої з головного модуля, можна створити пункт меню, що дозволяє отримати доступ до управління інтернет-магазином людям, не допущеним в адмінку Джумлы (наприклад, користувачам з правами автора, видавця чи редактора).

    Для створення цього пункту потрібно вибрати в адмінці з верхнього меню пункти «Меню» — «Назву потрібного меню» і натиснути на кнопку «Створити», розташовану вгорі відкритого вікна.

    Як створити інтернет-магазинЯк створити інтернет-магазин

    З усіх можливих варіантів і типів потрібно буде вибрати в самому низу списку варіант «Зовнішнє посилання».

    У вікні, вам потрібно буде задати назву для цього пункту, в полі «Посилання» — вставити посилання, скопійований в головному модулі Виртуемарта, а в полі «Доступ» — вибрати варіант «Спеціальний», щоб цей пункт не було видно звичайним відвідувачам вашого НИМ (його зможуть побачити тільки користувачі з правами доступу вище простого зареєстрованого користувача — читайте детальніше по наведеній трохи вище лінком).

    Як створити інтернет-магазинЯк створити інтернет-магазин

    В результаті, в меню вашого сайту з’явиться відповідний пункт, видимий тільки авторизованим користувачам починаючи з «Автора» і вище, і дозволяє їм потрапити в адмінку VirtueMart з видимої частини веб-сайту (Front Page) :

    Як створити інтернет-магазинЯк створити інтернет-магазин

    Налаштування версій сторінок для друку в Виртуемарте

    Переходимо на вкладку «Сайт» глобальних налаштувань VM. Перші три поля дозволяють вам вибрати, чи відображати кнопки PDF, E-mail (використовується для того, щоб відвідувач міг відправити посилання на який-небудь товар комусь ще) і Друк.

    При натисканні на кнопку «Друк» користувачеві буде представлена та ж сама веб-сторінка, але вже без підключення шаблону. Якщо придивіться до URL в адресному рядку версії сторінки для друку, то ви побачите там звернення до файлу index2.php, а не просто index.php.

    http://vash-sait.ru/index2.php?page=shop.product_details&category_id=44&flypage=flypage-ask.tpl&product_id=284&option=com_virtuemart&Itemid=8&pop=1&tmpl=component

    Саме завдяки цьому не відбувається підключення шаблону Joomla (тут про шаблони і теми багато чого написано) при виведенні сторінки для друку. Цей файл index2.php лежить в кореневій папці хоста. Але додавання кнопки «Друк» на всі сторінки може мати і негативні сторони.

    Справа в тому, що в цьому випадку в індексі пошукових систем будуть з’являтися дублі вебсторінок магазину – самі сторінки і їх версії для друку. З одного боку це навіть добре, оскільки співвідношення корисного тексту та іншого коду у версіях для друку дуже високий, по відношенню до звичайних вебстраницам, т. к. у їх коді відсутні ділянки описують шаблон, що накладається на контент.

    Такі версії для друку при інших різних умовах можуть підніматися досить високо в пошуковій видачі і, відповідно, залучити більше відвідувачів на ваш магазин, але є кілька нюансів, які нівелюють всі плюси.

    По-перше, користувач, який перейшов на таку версію для друку з пошукової видачі Яндекса або Google, скоріше за все, не зможе зрозуміти де він знаходиться і у нього не буде можливості здійснювати переходи на інші веб-сторінки вашого сайту, т. к. система навігації зазвичай вбудовується в шаблон Joomla, який на даних вебстраницах не підвантажується.

    Дану проблему можна вирішити, додавши на аскетичні версії сторінок посилання на повнофункціональний документ, з підключеним шаблоном. Це можна зробити, додавши потрібні посилання в вибраний вами шаблон оформлення сторінки товару (flypage), знайти який і змінити ви зможете підключившись до вашого ресурсу по протоколу FTP і відкривши на редагування потрібний вам файл шаблону flypage з директорії:

    components/com_virtuemart/themes/default/templates/product_details

    Додаткові посилання для навігації на сторінках для друку можна додати і в шаблон категорій товару VirtueMart, файли яких ви зможете знайти в папці

    /components/com_virtuemart/themes/default/templates/browse

    Так само у справі спрощення навігації може допомогти встановлення галочки в полі «Показувати панель навігації вгорі списку товарів» на вкладці «Сайт» налаштувань адмінки виртуематра. Ця панель навігації буде видно і на вебстраницах для друку, і зможе допомогти відвідувачеві в навігації по вашому магазину.

    Як створити інтернет-магазинЯк створити інтернет-магазин

    На наведеному вище малюнку червоною лінією підкреслена як раз ця сама панель навігації. Червоним кольором виділені посилання на повнофункціональну версію магазину (з підключеним шаблоном) і на список всієї продукції магазину (карту сайту). Обведені синім посилання на попередній і наступний товар, активуються теж з налаштувань адмінки VM. Як це зробити — читайте у цій же статті трохи нижче.

    Але залишається ще один негативний момент — пошуковики дуже погано ставляться до дублювання контенту у своєму індексі. При великій кількості таких дублів відношення пошукових систем до вашого ресурсу може істотно погіршитися. Щоб уникнути такої ситуації ви можете заборонити індексацію версій сторінок для друку з допомогою файлу robots.txt.

    Детально ознайомитися з можливостями robots.txt можна по наведеній посиланням. У файлі robots.txt потрібно додати правило для всіх пошукових роботів, яке буде забороняти індексацію пошуковими системами вебсторінок, які формуються на основі файлу index2.php.

    Це правило буде виглядати приблизно так:

    Disallow: /index2.php?page=shop

    Повернемося в адмінку VirtueMart і розглянемо призначення поля «Показувати кількість товарів», яке служить для включення відображення кількості продукції в категоріях. Воно буде відображатися як в головному модулі, так і безпосередньо при заході в категорії.

    Кількість продукції буде відображатися відразу після назви категорії в дужках (для правильного відображення вам, можливо, знадобиться внести зміни, описані в статті, про вирішення проблем в VirtueMart.

    Як створити інтернет-магазинЯк створити інтернет-магазин

    У налаштуваннях адмінки VM з випадаючого списку поля «Зображення товару без картинки» ви можете вибрати файл зображення, який буде відображатися в тому випадку, якщо у продукту не буде завантажено його фото. Галочку в полі «Показувати емблему магазину» краще не ставити, інакше внизу буде показуватися емблема Виртуемарта і посилання на ресурс його розробників.

    Налаштовуємо в шаблоні зовнішній вигляд сторінок категорій і товарів в VirtueMart

    Тут зосереджені дуже важливі, на мій погляд, налаштування, керуючи якими ви зможете повністю змінити зовнішній вигляд свого інтернет-магазину. Ви зможете вибрати загальний вид відображення товарів у категоріях, наприклад, в вигляді таблиці (прайс листа) або у вигляді блоків на основі контейнерів DIV. У разі вибору блочного відображення у вас буде можливість вибрати, скільки предметів в одному ряду буде відображатися. Але про все по порядку.

    У випадаючому списку першого поля «Виберіть шаблон для магазину» за умовчанням мається тільки один шаблон default. Але ми можемо його налаштувати на свій розсуд. Для цього потрібно натиснути на посилання «Налаштування» під цим випадаючим списком. В результаті, ви потрапите у вікно з налаштуваннями умолчательного шаблону:

    Як створити інтернет-магазинЯк створити інтернет-магазин

    Якщо після прописаного шляху до файлу конфігурації шаблону є напис зеленого кольору «Доступний для запису», то все добре і можна приступати до настроювань. Але якщо напис червоного кольору і говорить про неможливість зробити запис у конфігураційний файл шаблону, то потрібно буде отримати доступ до файлів вашого проекту — за протоколом FTP пройти по шляху, вказаному у наведеній вище рядку і змінити, з допомогою програми FIleZilla, права доступу до цього файлу на 666 (можна і на 777, якщо число 666 вас сильно бентежить).

    Якщо вам не зовсім зрозуміло, що таке права доступу, то можете прочитати про це в наведеній статті.

    У налаштуваннях шаблону VirtueMart з випадаючого списку «Product List Style» можна вибрати, яка буде розмітка у списку продукції в категоріях. У першому варіанті для їх виводу використовується таблична верстка.

    У другому варіанті — список буде відображатися у вигляді таблиці (прайс-лист) і, знову ж таки, буде використовуватися таблична верстка. Третій варіант з цього списку є аналогом першого варіанту, за тим винятком, що в цьому випадку для формування списку продукції використовується блокова верстка (на дивах).

    Установка галочок в наступних полях налаштування шаблону інтернет-магазину Виртуемарт буде означати:

  • Number of recent products to Display – показувати іконку стрічки новин RSS, за допомогою якої відвідувач зможе підписатись на отримання повідомлень при додаванні в дану категорію НИМ нового товару.
  • Show the Add to cart Button on the product list – показувати кнопку додавання в корзину (кнопку «Купити») в списку продуктів категорій, для того, щоб відвідувачі могли здійснювати покупку відразу ж при перегляді цього списку, не заходячи в картку вподобаного продукту
  • Show Vendor Link і Show Manufacturer Link – показувати посилання на продавця або виробника в описі товару (у його картці)
  • Show Availability Information – показувати інформацію про доступність даної продукції
  • Show additional Pathway on the Product Page – показувати на навігацію, тобто шлях до картки товару (це, так звані, хлібні крихти в VirtueMart)
  • Show Prev/Next Product Link – показувати чи у картці продукту посилання на попередній і наступний предмети продажу з даного розділу
  • Open Product Images in a LightBox – ви можете вибрати спосіб відкриття збільшеного зображення товару, при клацанні його превьюшке під flypage. Велика картинка може відкриватися з використанням ефекту litebox (плавне відкриття картинки з одночасним затемненням іншій частині вікна) або ж просто в окремому вікні
  • Customer Checkout in a popup (GreyBox) – показувати вікно оплати у спливаючому вікні після того, як товар буде додано до кошика
  • Use Ajax to add, update або delete products from the cart — використовувати технологію Ajax при додавання, оновлення та видалення продуктів з кошика, яка дозволяє при цьому не перевантажувати всю сторінку, оновлюватися буде тільки інформація у вікні кошика
  • Show featured products on frontpage – показувати рекомендовані продукти на головній сторінці Виртуемарта
  • Show the latest products on the frontpage — показувати останні переглянуті товари на головній сторінці
  • Number of recent products to Display — тут можна вказати, скільки саме останніх переглянутих предметів продажів показувати
  • Повернемося на вкладку «Сайт» налаштувань адмінки VirtueMart. В полі «Кількість товарів в рядку» ви можете вказати, скільки продуктів у рядку буде відображатися при перегляді категорії. В наступних полях «Шаблон категорії» і «Сторінка товару» (flypage) можете вибрати відповідні шаблони, які будуть використовуватися за замовчуванням.

    Але при створенні або редагуванні категорій ці дані можна змінювати індивідуально для кожної категорії товарів. Тут же задаються шаблони за замовчуванням.

    Полі «Включити динамічна зміна для міні-зображень» — дуже корисна опція, яка використовує бібліотеку мови PHP GВ2 і при її активації вам не потрібно буде самостійно робити мініатюри фотографій продукту. Достатньо просто завантажити повнорозмірну фотографію, ну а мініатюра створиться автоматично. Розмір створюваної мініатюри можете вказати в розташованих нижче полях «Ширина і висота міні-зображення».

    Удачі вам! До зустрічей на сторінках блогу