Общий FAQ от WarStyle по Opencart 2.x

[WarStyle]

22 часа назад, Yra сказал:

Нет такого пункта (OpenCart.pro 2.3.0.2.5)

 

Если Вы о пункте "Тип ЧПУ", то да, его нет в 2.3 так как в 2.1 был выбор, в 2.3 его убрали.

[WarStyle]

Немного годного контента  
 

Делаем удобное меню сайта с картинками формата SVG, которые не теряют качество, даже если увеличить на максимум размер экрана телефона. Плюс в том, что эти картинки так же и весят до 5 кб в среднем, PageSpeed не ругается на такие картинки, а сейчас как мы знаем, все хотят побольше попугаев. Так же плюс этого меню в том, что в нем можно сделать меню с большим уровнем вложенности кастомными ссылками, что актуально и очень удобно для вывода разной полезной информации.
 

Пример меню:

 

Скрытый текст

 

 

Скрытый текст

 

 

Скрытый текст

 

Демо такого меню, без картинок SVG: ТЫЦ, просто для ознакомления.

 

Все делалось на opencart.pro 2.3 версии, инструкция распространяется как есть, все что Вы делаете - на свой страх и риск.

 

Нам понадобится:

 

1) Мега меню от @29aleksey или же шаблон, в котором есть такое меню NewStore или CyberStore.
2) Сделать поддержку SVG картинок в движке.
3) Найти картинки SVG и подогнать их под размер нашего меню.
 

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

Второе, это поддержка SVG, есть несколько вариантов развития событий, добавить код ручками, будет чуть ниже, или же поставить модификатор: ТЫЦ

 

Добавляем код ручками: 

Идем в файл admin/model/tool/image.php после строки:

 

Скрытый текст

$extension = pathinfo($filename, PATHINFO_EXTENSION);

 

 

Добавляем:

 

Скрытый текст

if('svg' == $extension) {
            if ($this->request->server['HTTPS']) {
                return HTTPS_CATALOG . 'image/' . $filename;
            } else {
                return HTTP_CATALOG . 'image/' . $filename;
            }
      }

 

 

Тоже самое делаем в файле: catalog/model/tool/image.php после строки:

 

Скрытый текст

$extension = pathinfo($filename, PATHINFO_EXTENSION);

 

 

Добавляем:

 

Скрытый текст

if('svg' == $extension) {
            if ($this->request->server['HTTPS']) {
                return HTTPS_SERVER . 'image/' . $filename;
            } else {
                return HTTP_SERVER . 'image/' . $filename;
            }
      }

 

 

Далее идем в файл admin/controller/common/filemanager.php и после:

 

Скрытый текст

// Get files
 $files = glob($directory . '/' . $filter_name . '*.{jpg,jpeg,png,gif,JPG,JPEG,PNG,GIF}', GLOB_BRACE);

 

 

Добавляем "svg,SVG" или же заменяем кодом ниже:

 

Скрытый текст

$files = glob($directory . '/' . $filter_name . '*.{jpg,jpeg,png,gif,JPG,JPEG,PNG,GIF,svg,SVG}', GLOB_BRACE);

 

 

В этом же файле ищем вот такой кусок кода:

 

Скрытый текст

// Allowed file extension types
 $allowed = array(
 'jpg',
 'jpeg',
 'gif',
 'png'
 );

 

 

И так же добавляем поддержку SVG:
 

Скрытый текст

// Allowed file extension types
 $allowed = array(
 'jpg',
 'jpeg',
 'gif',
 'png',
 'svg'
 );

 

 

В этом же файле находим дальше вот такой кусок кода:

 

Скрытый текст

// Allowed file mime types
 $allowed = array(
 'image/jpeg',
 'image/pjpeg',
 'image/png',
 'image/x-png',
 'image/gif'
 );

 

 

И так же заменяем на этот:

 

Скрытый текст

// Allowed file mime types
 $allowed = array(
 'image/jpeg',
 'image/pjpeg',
 'image/png',
 'image/x-png',
 'image/gif',
 'image/svg+xml'
 );

 

 

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

 

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

 

Например нам нужна иконка телефона в формате SVG и при этом зеленого цвета. Вверху этого сайта есть поиск с фильтром.

 

http://joxi.ru/GrqpBxeHk7QJkA - выбираем вот такие параметры и пишем что мы ищем.

 

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

 

1) http://joxi.ru/Q2KQqGxuwe4Gxr

2) http://joxi.ru/DmBPRqEHznwQlA

3) http://joxi.ru/Q2KQqGxuwe4Rxr

 

После того как мы скачали картинки вроде как все готово и можно её поставить, но не спешите радоваться, к сожалению размер картинки не подгоняется автоматом и если Вы её вставите как есть, то она на сайте будет просто огромная, если кто-то допилит код для меню, чтобы они автоматом становились 25*25, буду благодарен, а пока расскажу о другом костыле, которым можно обойтись

Так вот, чтобы картинки хорошо смотрелись в меню, нам нужно сделать их 25px * 25px и тут довольно все просто, Вам нужно открыть скачанную картинку через блокнот или редактор кода и найти где у неё задан размер.

 

1) http://joxi.ru/bmogbnOc9gxq8m

2) http://joxi.ru/vAWnevYHqN1L72

 

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

 

http://joxi.ru/bmogbnOc9gx58m

 

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

 

Вроде все, если будут вопросы или предложения - задавайте или дополняйте, удачи.