Шаблон vamshop теперь снова установлен шаблоном по умолчанию!

[support 447]

Шаблон vamshop, который долгое время был шаблоном по умолчанию в VamShop, снова установлен шаблоном по умолчанию в поставке VamShop.

http://demo.vamshop.ru

Стили шаблона чуть переписаны на использование flexbox, спасибо eugenem за статьи:

https://molodezky.pp.ua/flexbox-osnovnye-momenty-1-flex-kontejner-i-ego-svojstva-mnogo-teksta-s-primerami/

https://molodezky.pp.ua/flexbox-2-flex-element-i-ego-svojstva/

https://molodezky.pp.ua/flexbox-3-flexbox-na-praktike/

HTML разметка можно сказать не менялась. Лишь wrapper, который раньше оборачивал лишь центральную колонку div#content, теперь оборачивает центральную колонку (div#content) + левую колонку (div#left) + правую (div#right).

Но это мелочи, т.е. шаблон теперь адаптивный благодаря лишь правкам css стилей, html-разметка не затрагивалась.

А это значит, что, к примеру, 17 стилей из раздела Файлы - https://forum.vamshop.ru/files/category/3-шаблоны-и-стили/

Тоже будут рабочими и адаптивными.

Нужно стили эти чуть обновить и все эти 17 тем будут рабочими а адаптивными.

 

Теперь шаблон vamshop адаптивный, boostrap не используется.

Да, есть ещё вещи, которые надо доработать, для работы на смартфоне, но это уже больше касается юзабилити и в будущих версиях будут по-прежнему вноситься правки.

 

В чём преимущества нового/старого шаблона vamshop перед bootstrap шаблоном vamshop1, который был по умолчанию:

1. Нет десятков тысяч строк css, js кода, который не используется. 

2. Даже без каких-либо оптимизаций кода, сжатий css, js, картинок и т.д., шаблон vamshop набирает 100 баллов из 100 возможных в тестах Google PageSpeed Insights, как для мобилок, так и для десктопов.

3. Нет ничего лишнего, простой и удобный шаблон, самое то, что нужно для начала работы интернет-магазина.

4. Валидный html код - https://validator.w3.org/nu/?doc=http%3A%2F%2Fdemo.vamshop.ru%2F

5. Валидный css код - http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fdemo.vamshop.ru%2Ftemplates%2Fvamshop%2Fstylesheet.css&profile=css3svg&usermedium=all&warning=1&vextwarning=&lang=ru

 

 

Bootstrap шаблон vamshop1 никуда не делся, он так же доступен в Админке - Настройки - Мой магазин - Шаблон.

[komsit 2]

Подскажите тем, кто делал шаблон на основе шаблона vamshop1

Какие нужно отключить js, чтобы ускорить работу.

(у меня на мобильной версии очень хромает)

 

[support 447]

4 часа назад, komsit сказал:

Подскажите тем, кто делал шаблон на основе шаблона vamshop1

Какие нужно отключить js, чтобы ускорить работу.

(у меня на мобильной версии очень хромает)

 

Да там особо отключаемых скриптов нет.

Надо переносить js код вниз из шапки, сжимать всё в один файл.

В общем, много всяких правок есть, так и не опишешь всё. У гугла есть много статей на эту тему.

Но в любом случае в рабочем магазине 100 баллов не будет.

К примеру, если включены яндекс метрика, google analytics, уже не будет 100 баллов.

[support 447]

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

[support 447]

В 01.01.2019 в 18:27, komsit сказал:

Подскажите тем, кто делал шаблон на основе шаблона vamshop1

Какие нужно отключить js, чтобы ускорить работу.

(у меня на мобильной версии очень хромает)

 

Добавьте внизу в .htaccess:

<IfModule mod_deflate.c>
    AddOutputFilterByType DEFLATE text/html text/plain text/css text/javascript application/x-javascript application/font-woff application/font-woff2

<FilesMatch "\\.(js|css|woff|woff2|ttf|eot|otf)$">
  SetOutputFilter DEFLATE
</FilesMatch>
</IfModule>

<IfModule mod_expires.c> 
  AddType application/vnd.ms-fontobject .eot
  AddType application/x-font-ttf .ttf
  AddType application/x-font-opentype .otf
  AddType application/x-font-woff .woff
  AddType application/x-font-woff2 .woff2
  AddType image/svg+xml .svg
  ExpiresActive On
  ExpiresByType text/css "access plus 10 years"
  ExpiresByType text/js "access plus 10 years"
  ExpiresByType text/javascript "access plus 10 years"
  ExpiresByType application/x-javascript "access plus 10 years"
  ExpiresByType application/javascript "access plus 10 years"
  ExpiresByType application/font-woff "access plus 10 years"
  ExpiresByType application/font-woff2 "access plus 10 years"
  ExpiresByType application/vnd.ms-fontobject "access plus 10 years"
  ExpiresByType application/x-font-ttf "access plus 10 years"
  ExpiresByType application/x-font-opentype "access plus 10 years"
  ExpiresByType application/x-font-woff "access plus 10 years"
  ExpiresByType application/x-font-woff2 "access plus 10 years"
  ExpiresByType image/svg+xml "access plus 10 years"
  ExpiresByType image/png "access plus 10 years"
  ExpiresByType image/x-icon "access plus 10 years"
  ExpiresByType image/vnd.microsoft.icon "access plus 10 years"
  ExpiresByType image/gif "access plus 10 years"
  ExpiresByType image/jpeg "access plus 10 years"
</IfModule>

FileETag none

 

Это добавит баллов в тесте.

В случае, если у Вас на стороне сервера есть модули mod_expires и mod_deflate, то будут сжаты и закэшированы статические файлы.

Если не установлены mod_expires и mod_deflate, попросите тех.поддержку хостинга что б установили эти apache модули.

 

[komsit 2]

Да, пробую ускорить работу мобильной версии.

Наверное будет лучшим решением попробовать переверстать сайт на базе VAMSHOP

(У меня переверстан на базе Vamshop1 и чувствую что там очень всего много лишнего, что осложняет работу в мобильной версии)

Кстати гугл очень всем рекомендует использовать форматы изображений JPEG 2000, они гораздо меньше весят.

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

В идеале, все файлы тогда загнать в такой формат, 

если я все файлы загружу на комп, отформатирую, можно поправить "оптом" на сайте пути до файлов с формата png, jpeg на jpeg2000 ?

[support 447]

6 минут назад, komsit сказал:

Да, пробую ускорить работу мобильной версии.

Наверное будет лучшим решением попробовать переверстать сайт на базе VAMSHOP

(У меня переверстан на базе Vamshop1 и чувствую что там очень всего много лишнего, что осложняет работу в мобильной версии)

Кстати гугл очень всем рекомендует использовать форматы изображений JPEG 2000, они гораздо меньше весят.

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

А что значит "осложняет работу в мобильной версии"?!

Ничего не осложняет, шаблон vamshop1 сделан в так называемой технике mobile first, т.е. адаптивный шаблон, всё подстраивается под размеры экрана устройства.

100 баллов в рабочем магазине в любом случае не будет.

т.е. я б особо и не гнался прям за 100 процентным результатом.

[komsit 2]

Да что то гугл developers.google.com сошел сума.

Большинству сайтов в мобильной версии ставит не больше 30 балов, вот я и озадачился(

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

 

[support 447]

25 минут назад, komsit сказал:

Да что то гугл developers.google.com сошел сума.

Большинству сайтов в мобильной версии ставит не больше 30 балов, вот я и озадачился(

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

 

В демке http://demo.vamshop.ru в Админке - Настройки - Магазин - Шаблон переключитесь на шаблон vamshop

и проверьте demo.vamshop.ru в сервисе pagespeed, недавно проверял, было 100 баллов из 100.

Может конечно у гугла что изменилось, но ещё не давно баллы хорошие были.

У VamShop 2 тоже баллы хорошие http://demo2.vamshop.ru - можете тоже проверить.