Web.Dev — Новый сервис оценки качества сайта от Google!



https://web.dev

Новый сервис оценки качества сайта от Google!

По сути, это, всё тот же Lighthouse, который доступен в разделе Аудит в браузере хром и на сайте Google PageSpeed Insights.

Но, возможно, в будущем что-то интересное добавят.

А пока Вы можете оценить свой интернет-магазин, каким видит его гугл и как оценивает.

Вот оценки для онлайн-демки VamShop 2 — http://demo2.vamshop.ru

97 100 77 100

А каковы Ваши оценки Вашего магазина?!

Бесплатный магазин на React + NodeJs + MongoDB!

Посмотрите демку:

https://cezerin.ru — магазин.

https://cezerin.ru/admin — админка.

Как Вам такой магазин?!

Написан на javascript: и backend, и frontend, всё на javascript.

Frontend (каталог, админка) написан на React.

Backend (api) написан на NodeJs.

Для хранения данных используется MongoDB.

Админка использует React MaterialUI Framework — https://material-ui.com

Каталог использует CSS Framework Bulma — https://bulma.io

Так называемое API центричное приложение, или ещё называют микросервисное, т.е. всё крутится вокруг API.

Благодаря React весь сайт динамический и очень быстрый.

Всякие эффекты, анимации, изменения содержимого страниц — всё происходит прямо внутри страницы, без перезагрузок страницы.

Кроме того, благодаря серверной части на NodeJS — нет проблем с индексацией содержимого страниц поисковиками, в отличии от обычных ReactJs приложений.

Есть и фильтры — https://cezerin.ru/category-a

Есть и атрибуты товара — https://cezerin.ru/category-b/test-product

Есть и спецификации товара (свойства) — https://cezerin.ru/category-b/test-svoistva

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

Основное преимущество — это именно применяемый стэк технологий: React + NodeJs + MongoDB.

Это значит, что магазин будет с неблокирующей базой данных mongodb, асинхронными запросами, виртуальным DOM, Server Side Rendering (SSR), единый язык программирования для backend и frontend — javascript.

Но это же и основной недостаток, всё-таки это немного сложней чем php+mysql, даже просто запустить всё это хозяйство новичкам будет сложно.

Но с помощью документации и мануалов это можно будет исправить и всё рассказать и показать, как всё устанавливается и запускается.

Но для тех, что уже знаком с nodejs + react, всё будет понятно и легко.

Да, понятно, что простым пользователям это ни о чём не говорит.

Но для простых пользователей это будет означать одно — очень быстрый магазин, адаптивный, современный, с эффектами и анимациями, без перезагрузок, без лишних кликов, кнопок подтверждения и т.д.

Официальный сайт проекта: https://cezerin.org

Официальный github проекта: https://github.com/cezerin2

Добавлен новый модуль доставки — Boxberry!

В VamShop по умолчанию добавлен новый модуль доставки — Boxberry.

С выбором пункта выдачи заказа самим покупателем через виджет boxberry.

Вот как это выглядит на странице оформления заказа, смотрите скриншоты:

Оставьте свой отзыв о VamShop — техническая поддержка и обновления бесплатно на 3 месяца!

Здравствуйте!

Нам важно знать мнение наших пользователей о VamShop.

Куда двигаться дальше, как дальше развивать VamShop, что нравится нашим пользователям, что не нравится, как сделать будущие версии ещё лучше.

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

Оставьте отзыв о VamShop и получите 3 месяца доступа к обновлениям и технической поддержке в подарок *

Оставьте свой отзыв у нас в магазине:

VamShop 1 — https://vamshop.ru/product_reviews_write.php/info/p1_VamShop.html

VamShop 2 — https://vamshop.ru/product_reviews_write.php/info/p123_VamShop-2.html

и/или на сайте CMSMagazine.ru — http://www.cmsmagazine.ru/catalogue/vamshop/opinions_cms/

*Предоставляется полноценный доступ к загрузке обновлений VamShop и доступ к форуму технической поддержки https://forum.vamshop.ru сроком на 3 месяца.

Настройка авторизации через Facebook!

В VamShop по умолчанию добавлен модуль авторизации через соц. сети.

По умолчанию, Вы можете авторизоваться в магазине через: вконтакте, facebook, google.

Что это значит?!

Это значит, что Вам не надо помнить свой email, логин, пароль, не надо регистрироваться в магазине.

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

Всё очень просто, Вам не надо помнить свой пароль, логин, просто заходите на страницу Мои заказы (рабочий пример http://demo2.vamshop.ru)

Нажимаете Войти через: google, facebook, вконтакте.

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

Как настроить авторизацию на сайте через Facebook читайте ниже.

Читать далее «Настройка авторизации через Facebook!»

Настройка авторизации через ВКонтакте!

В VamShop по умолчанию добавлен модуль авторизации через соц. сети.

По умолчанию, Вы можете авторизоваться в магазине через: вконтакте, facebook, google.

Что это значит?!

Это значит, что Вам не надо помнить свой email, логин, пароль, не надо регистрироваться в магазине.

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

Всё очень просто, Вам не надо помнить свой пароль, логин, просто заходите на страницу Мои заказы (рабочий пример http://demo2.vamshop.ru)

Нажимаете Войти через: google, facebook, вконтакте.

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

Как настроить авторизацию на сайте через ВКонтакте читайте ниже.

Читать далее «Настройка авторизации через ВКонтакте!»

Новая версия — VamShop 2.61

Выпущена новая версия VamShop 2.61

Что изменилось:

  1. Добавлен новый модуль оплаты — Открытие банк.
  2. Добавлен новый модуль оплаты — WebBankir.
  3. Добавлена семантическая разметка для цепочки навигации (breadcrumb).
  4. Добавлена OpenGraph разметка.
  5. Корректировка сортировки по умолчанию, выводятся свежие записи на первом месте.
  6. Корректировка меню Разделы, по умолчанию развёрнуто и подсвечен текущий раздел при просмотре категории с товарами.
  7. Возвращён jQuery maskedInput для маски телефона.
  8. Обновлён код яндекс метрики.
  9. Шаблон по умолчанию сделан «резиновым».
  10. Корректировка кода метки product_manufacturer, html-разметка вынесена из метки.

Полный список изменений доступен на форуме технической поддержки пользователей — https://forum.vamshop.ru/topic/16009-%D0%BD%D0%BE%D0%B2%D0%B0%D1%8F-%D0%B2%D0%B5%D1%80%D1%81%D0%B8%D1%8F-vamshop-261/

Новый модуль оплаты — Открытие банк!

В VamShop по умолчанию добавлен новый модуль оплаты — Открытие банк.

С помощью данного модуля оплаты Вы сможете принимать оплату карточками (Visa, MasterCard, Maestro, Мир) в своём интернет-магазине на базе VamShop.

Как установить модуль:

  1. Вам для начала нужно подключиться к банку открытие и получить от них partnerid и serviceid номера.
  2. В Админке — Модули — Оплата включите модуль openbank
  3. В настройках модуля оплаты укажите Ваши значения partnerid и serviceid.

Сообщите в банк URL адрес для уведомлений:

  1. Для магазинов на базе VamShop 1 адрес будет: https://ваш-магазин.ру/openbank.php
  2. Для магазинов на базе VamShop 2 адрес будет: https://ваш-магазин.ру/payment/openbank/result

Добавляем невидимую каптчу от гугл (google recaptcha v3) на страницу обратной связи!

Если Вы столкнулись с прблемой спама, который приходит у Вас со страницы обратной связи, можно попробовать добавить невидимую каптчу (google recaptcha v3) от гугл.

1. На сайте https://google.com/recaptcha получаете ключи для сайта.

site key и secret key.

2. В файле /shop-content.php меняйте:

	if (isset ($_GET['action']) && ($_GET['action'] == 'send') && $spam_flag == false) {

на:

// Build POST request:     
$recaptcha_url = 'https://www.google.com/recaptcha/api/siteverify'; $recaptcha_secret = 'ЗДЕСЬ-УКАЖИТЕ-ВАШ-СЕКРЕТНЫЙ-КЛЮЧ'; $recaptcha_response = $_POST['recaptcha_response'];
// Make and decode POST request:
$recaptcha = file_get_contents($recaptcha_url . '?secret=' . $recaptcha_secret . '&response=' . $recaptcha_response);
$recaptcha = json_decode($recaptcha);

if (isset ($_GET['action']) && ($_GET['action'] == 'send') && $spam_flag == false && $recaptcha->score >= 0.5) {

В шаблоне страницы обратной связи /templates/ваш-шаблон/module/contact_us.html после:

{config_load file="$language/lang_$language.conf" section="contact_us"}

добавьте:

<script src="https://www.google.com/recaptcha/api.js?render=УКАЖИТЕ-ЗДЕСЬ-СВОЙ-SITE-KEY"></script>     
<script>
grecaptcha.ready(function () { grecaptcha.execute('УКАЖИТЕ-ЗДЕСЬ-СВОЙ-SITE-KEY', { action: 'contact' }).then(function (token) { var recaptchaResponse = document.getElementById('recaptchaResponse'); recaptchaResponse.value = token; }); }); </script>

и внизу, меняйте:

{$FORM_END}

на:

<input type="hidden" name="recaptcha_response" id="recaptchaResponse">
{$FORM_END}

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