sitecreator

Доступна для скачивания новая версия (на сайте разработчика) 1.17.3 Про изменения, касающиеся Lazy Load уже писал. Также добавил совместимость для ускорителя Nitro pack. Поскольку для файлов данного ускорителя невозможно применить ocmod, то пользуйтесь инструкцией для действий, которая приведена в файле sitecreator.webp_output.ocmod.xml Тестировалось совместно с версией NitroPack 2.5.3 Разумеется, что всяческие оптимизации изображений и Lazy Load нужно отключить в Nitro. Их реализация сильно уступает возможностям модуля Компрессор. Нитро есть смысл использовать как кешер HTML, т.е. для ускорения отклика страницы.

разумеется, работает. Вы же видите в описании скриншот сделан в ocstore? все правильно. В браузере достаточно перезагрузить страницу CTRL+F5. После вставки картинки у вас появится новый набор инструментов для картинки. На старой версии он иной. Вот такой должен быть:

для экранов высокой четкости будет отдаваться в браузер, соответственно, картинка высокой четкости. Т.е. если для обычных экранов, например, картинка размером 360 х 360, то для экрана Ретина будет загружена 720 х 720, т.е. с двойной плотностью пикселей. При этом вьюпорт для обычного экрана и Ретины будет одинаков, например 360 пикс ширины. Вьюпорт - это условная единица, которая может совпадать с реальной шириной матрицы в пикселях или не совпадать. Картинка 720 х 720 в случае Ретины будет отображена в квадрате 360 х 360 (в единицах вьюпорта). Соответственно, нужно готовить, как минимум, пару картинок вместо одной. Простая и с повышенной плотностью. Если используется webp, то еще пару. Но такова плата за высокую четкость и одновременно пониженный вес файлов при передаче. Разумеется, что при хранении на сервере общий вес увеличивается. Т.е. есть и плюсы, и минусы. Но чего только не сделаешь чтобы пользователь мог получить картинки высокой четкости? Не знаю насколько это может быть востребовано. К тому же должен быть изначально соответствующего качества исходник.

Какое безумное желание! Банальный пример: Попадаю, например, из яндекса на страницу товара. И хочу посмотреть аналогичные товары из того же раздела. Но... Фиг вам! Потому что хозяину захотелось отключить хлебные крошки. Сколько раз я проклинал такой "мудрый" подход к созданию магазина. Плевался и уходил с такого сайта. Хлебные крошки - это один из важнейших столпов, на котором располагается юзабилити. Сделайте, наконец-то, неудобно вашим посетителям!

Завантажити / Придбати розширення True Summernote for Opencart 3 Свежий и продвинутый редактор Заменяет в Opencart и OcStore 3.0 устаревшую версию (аж от 2016-го года) редактора Summernote на самую свежую. Плюс актуальная и значительно продвинутая версия summernote-image-attributes. Соответственно в актуальных версиях пофиксены старые глюки и баги. Плюс добавлен новый функционал. Позволяет легко избавиться от навязчивой вставки везде и всюду редактором старой версии (идет во всех версиях opencart 3) вот таких стилей для изображения: style="width: 800px; Путем нажатия на кнопку "Original Size". (которая отсутствует в дистрибутиве opencart, но есть в данной сборке) Установка ======== Устанавливается через установщик OCMOD как обычно. Обновите кеш шаблона и системный кеш (на всякий случай). На странице, где используете редактор Summernote обновите кеш браузера (достаточно CTRL+F5) чтобы загрузились свежие версии JS файлов. Данный редактор совместим с продвинутым файловым менеджером и редактором изображений True File manager: Автор sitecreator долучення 11.11.19 Категорія Редакторы Системные требования Метод активации Без активации Ioncube Loader Нет ocStore 3.0 OpenCart.Pro, ocShop Звернення до сервера розробника Нет  

Поддержка экранов Ретина кому-то интересна? Если да, то могу добавить. Как бы узнать голоса, кому это реально нужно? Видимо, нужно создать голосовалку в отдельном блоге. И купил бы потенциальный заказчик такой модуль, который бы реализовал эту функцию? Или это из разряда "ну, бесплатно бы поставил, а деньги платить не стану". Версию 1.17 на днях выложу. Она немного быстрее чем 1.16.*. Один из дотошных исследователей производительности нашел в 1.16 "узкое место", которое может съедать порядка 20 мс (0.02 сек). В 1.17 коренным образом переработаны некоторые моменты, влияющие на производительность. Правда, тут прирост производительности на уровне погрешности измерения, но чисто теоретически можно выиграть 20 мс, правда, глазом это заметить невозможно никак. Но основное в 1.17 - это Lazy Load с расширенной поддержкой всех форматов и всех браузеров.

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

обратиться к спецам - это разве не вариант? Сделают хорошо и красиво за некоторую сумму вознаграждения.

На первое время можете вообще оставить доступ сайта по двум протокам одновременно. На всякий случай. Пока Яндекс не сделает все необходимые изменения для принятия вашего нового главного зеркала сайта. В таком случае лучше сделать замену на относительные адреса: http://my-site.com/ на / Т.е. ссылка будет начинаться просто со слеша

Тогда, как вариант, делайте замену в БД, например, через phpMyAdmin В поле описания (в БД) заменяйте все вхождения http://my-site.com/ на https://my-site.com/ думаю, что вам этого будет достаточно. Только обязательно с названием вашего сайта, а не просто протокол. Но переадресацию все равно нужно включить одним из способов. Про конкретного хостера не скажу - это невозможно запомнить.

картинки, которые вставляет в HTML сам движок, автоматически переключатся на протокол https. Например, картинки товара вставляет сам движок в код результирующего HTML. Но если вы вставляли картинки в ручном режиме, например, в текст описания, то там останется http. Очень рекомендуется сделать в настройках для домена переадресацию с http на https. И правильно это делать в конфиге nginx. 99% серверов используют связку nginx+апачи. Это делается обычно через панель управления хостера. В крайнем случае через файл .htaccess, но в этом случае не будет работать переадресация для картинок, но лишь для php-скриптов, поэтому всегда лучше настраивать переадресацию в nginx-конфиге сайта в панели управления хостера (если это возможно).

было бы логично подключить Magnific Popup, раз уж он используется уже в опенкарт 3. Смысл подключать дополнительные скрипты с подобным функционалом? Но ваше право подключать любой иной. Включу его (Magnific Popup) в свою сборку Summernote. И в принципе можно повесить самый разный доп. функционал на картинку. Реализуется через модули/плагина к Summernote. Можно создавать собственные плагины при отсутствии необходимого функционала.

снизил на 600 руб. upd: скидки закончились

Подготовил отдельное бесплатное решение. Будет доступно после одобрения модератором. Проверено на Opencart 3.0 актуальной версии и, соответственно, на OcStore 3.0. В принципе, если будет у публики интерес могу подготовить для Opencart 3.0 другие редакторы также. Как альтернативы редактору Summernote.

Свежий и продвинутый Summernote для Opencart 3 от sitecreator выглядит так:

я неплохо знаю этот редактор благодаря работе с его разными версиями на разных версиях опенкарт. поскольку делал модуль под всевозможные его извращения, начиная с его ранних версий. вот этот модуль работает со всей линейкой Summernote А рабочее решение нормального Summernote с расширенным функционалом под опенкарт 3 я уже сдедал. Как только одобрят модераторы, то будет доступно для скачивания.

Редактор Summernote (https://summernote.org/) вставляет. Вставляет реальную ширину изображения. Так уж задумано в Summernote , похоже. Он везде так вставляет, а не только в статье. Вот пример картинки: вот информация об этом изображении: вот мы вставили эту картинку: В актуальной версии родного редактора есть кнопка "Original size" Нажимаем ее и стиль удаляется полностью. В итоге получаем пустой стиль: Но такой кнопочки нет в редакторе из поставки Опенкарта. Печаль? Что же делать? Сделать кастомные настройки для вашего редактора. Можно установить редактор актуальной версии. Не забыть при этом поправить код opencart.js В опенкарт используется уже довольно устаревшая версия редактора аж от 2016 года. Хотя актуальная датирована 2019-м (май). В принципе могу подготовить решение со свежей версией редактора и расширенными возможностями. В виде модуля, думаю, что бесплатного. И совместимого с True File Manager (Продвинутый файловый менеджер и редактор изображений).

В случае opencart 3.0 (ocstore 3.0) после установки может понадобиться очистка кеша шаблона (кеш twig). Обычно это необязательно, но лишним не будет взять за правило всегда после любой установки чистить кеш twig и системный кеш. Т.к. никогда не угадаешь, что, где и кем у вас закешировалось до установки.

и он умеет делать WEBP пакетно, а не поштучно и, главное, выводить его в браузер из опенкарт? Интересно, а вы руками будете из кеша опенкарт загонять картинки на обработку в "сервис", а потом обратно? Конечно, если их не несколько штук. основная проблема - это вывод WEBP в браузер, причем не каждый браузер его понимает, а потому тут не все просто. Опенкарт не в состоянии вывести webp сам. Модуль Компрессор делает все это автоматически. Если представить, что у вас хотя бы несколько сотен товаров, и вы каждую картинку из кеша вручную перетаскиваете в сервис, потом делаете кучу настроек для выбора алгоритма, параметров сжатия, нажимаете "compress", сохраняете ее на компьютер, ищите нужную папку для сохранения, а потом перекидываете на сервер. Это тоже самое, что сказать "заказать экскаватор - это дорого, лучше я сам лопатой бесплатно ..." И вам еще нужно опасаться ненароком не нажать "очистить кеш", иначе все по новой придется. Кроме того модуль добавляет Lazy Load, т.е. отложенную загрузку изображений. Еще есть вот такая возможность. Динамическая генерация изображений нужного размера под разные размеры экрана. И, соответственно, их вывод в соответствии с размером экрана. И есть еще масса других возможностей в модуле по оптимизации веса изображений и внешнего вида. Например, управление белыми полями, которые, например, во всплывающих изображениях обычно неуместны, зато увеличивают вес картинки на пустом месте. А без полей картинка существенно меньше весит и визуально лучше отображается на смартфоне.

Подумал над удобством добавления картинок для товара. Можно сделать так, что после перетаскивания картинки с компьютера в менеджер она в один клик будет добавлена к товару. При этом менеджер не будет закрыт, а следующее перетаскивание и клик приведут к добавлению следующей картинки. Прошу заметить, что в данном менеджере никогда не теряется фокус с загружаемой картинки в отличие от стандартного менеджера, в котором после загрузки картинки она сортируется по названию и может оказаться где-то на N-й странице после загрузки. Т.е. никакого поиска и выбора после перетаскивания не нужно. Фокус устанавливается автоматически. Также можно сделать следующее (пока не реализовано) В принципе можно перетащить несколько файлов в менеджер, сделать один клик (все загруженные файлы уже будут выбраны) и все эти файлы будут добавлены как новые изображения к товару. ====================================== Есть коммерческие решения, которые используют стандартный менеджер файлов (из дистрибутива - тот, который очень неудобный) + возможность перетаскивания, минуя менеджер картинку для добавления к товару. Мне такой подход видится неудобным. Т.к. при вставке картинок в текст все равно приходится пользоваться родным неудобным менеджером. Невозможно редактировать картинку (а это актуально если размер 5000Х4000, есть белые поля и т.д.). Кроме того генерируются левые папки с абсолютно произвольными названиями, т.е. вы не будете знать где и что у вас размещается. Т.е. файловый беспорядок налицо. Вот этих недостатков в True File Manager нет и не будет. =====================================

Уже работает. И на opencart 3.0, и на ocstore 3.0 Загружайте версию 1.2.1 для opencart 30 trueFileManager_for_opencart30_1.2.1.ocmod.zip

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

Обращу ваше внимание на изображения. Судите сами. Есть рекомендации Гугла Но даже безотносительно рекомендаций Гугла видно, что вес изображений слишком большой. У вас изображений под 6М. А общий вес передаваемых данных более 7М. Т.е. основной вес - это изображения. Его можно существенно снизить за счет использования модуля Компрессор: https://opencartforum.com/files/file/4572-image-compressor-watermark-webp-lazy-load-etc-by-sitecreator/

Покажу как влияет сжатие изображений JPEG и PNG на общий вес изображений и на баллы гугла. Возьмем НЕоптимальный способ оптимизации. Без использования WEBP. И без использования Lazy Load. Оптимизация PNG за счет optipng будет довольно вялой по сравнению с оптимизацией за счет WEBP. Но даже только за счет оптимизации mozjpeg мы снизили общий вес изображений на 34% и получили небольшой прирост баллов гугла pagespeed. На странице остались довольно большие по весу PNG изображения и их суммарный вес в районе 50% от всех изображений. Кроме того на сайте хватает и других проблем для оптимизации, например, JS и Вес изображений ДО и ПОСЛЕ Несложно посчитать, что снижение веса с 1.15М до 783К привело к снижению веса на 34%. Сравнение попугаев ДО и ПОСЛЕ Много или мало накинул попугаев Гугл? На мой взгляд, он оценил уменьшение общего веса изображений и увеличение (как следствие) скорости загрузки страницы. Разумеется, что оптимизация изображений без WEBP и Lazy Load будет неполной. О чем Гугл и пишет в своих рекомендациях. Но оптимизацию лишь за счет mozjpeg Гугл оценил. И не забываем про кучу проблем, которые никак не связаны с изображениями, но которые гугл настоятельно предлагает решить. Да, вы не получили 90+ попугаев. И это неудивительно. Ибо я никогда не говорил, что можно "выехать" на одной лишь оптимизации изображений при наличии прочих проблем. Скажем так, было бы у вас 84 балла, то за счет mozjpeg вы получили бы заветные 90+. А если бы добавили WEBP и Lazy Load, то могли рассчитывать уже и на 95+. вот это (PNG) можно оптимизировать лишь за счет WEBP. Optipng позволяет в лучшем случае оптимизировать на 20%, а WEBP способен снизить вес PNG в несколько раз. Я давно написал статьи в FAQ: Как Гугл измеряет скорость загрузки изображений. Чем она отличается от общей оценки Гугла PageSpeed. Почему автомобиль на новой резине, но с неисправным двигателем медленно едет? Вес изображений == баллы гугла? FAQ является неотъемлемой частью описания модуля Компрессор. Именно в нем подробнейшим образом расписаны многие моменты и сделан акцент на разные нюансы. Я всегда говорил и говорю: До изменения своего алгоритма оценки Гугл pagespeed insights за оптимизацию лишь изображений накидывал очень много баллов, не смотря на то, что с JS и прочим могли быть большие проблемы. Например, с показанным здесь конкретно сайтом легко могла быть ситуация когда вместо 6 баллов гугл накинул бы 30 или 50 баллов, т.е. сайт оказался бы в зеленой зоне. Люди, которые занимаются оптимизацией не первый день, могут подтвердить, что именно так было 2 года назад и так было еще в прошлом году до смены алгоритма. Тот, кто умеет читать, думаю, что способен прочитать FAQ к Модулю Компрессор и не задавать вопросов "а почему не 90+ попугаев?". Прошу заметить, что нигде в описании модуля не указано, что лишь благодаря ему вы достигните 90+ с низкого старта. Читайте FAQ. Там все с цифрами показано. ============= Постараюсь попозже на примере показанного выше сайта дать информацию, что дает включение WEBP + Lazy Load. И как это сказывается на баллах гугла.

Подойдет? Готовое решение в виде модуля. Адаптивную обрезку нужного типа можете использовать на определенных страницах для определенных изображений. Т.е. можно либо настройками в модуле управлять, либо в коде страницы указывать в нужном месте нужный тип ресайза. вы что-то путаете.