Що стосується швидкості завантаження веб-сайту, навіть найменші деталі, як-от зображення, можуть спричинити затримку та відлякати ваших потенційних клієнтів. Оскільки це найменш бажаний результат, вам потрібно оптимізувати зображення, щоб вони завантажувалися швидше. Один із найкращих способів зробити це — застосувати сучасний формат файлів — WebP — рекомендований Google і підтримуваний майже всіма браузерами.
Ви можете використовувати онлайн-конвертер, щоб конвертувати зображення у WebP, а потім завантажити їх у свій магазин Shopware. Але вам доведеться конвертувати їх через цей конвертер кожного разу, коли ви завантажуєте нові зображення. Це не тільки займає багато часу, але й не є ефективним, оскільки ще не всі браузери підтримують WebP зображення.
Ви ж не хочете, щоб ваші відвідувачі бачили пошкоджені зображення, чи не так?
Розширення Shopware WebP дозволить вам покращити швидкість завантаження веб-сайту та автоматично конвертувати зображення у формат WebP у кілька кліків.
Щоб конвертувати зображення у WebP у Shopware:
1. Встановіть розширення Shopware WebP, підіть у Extensions > My extensions та знайдіть WebP Optimized Images by Magefan серез списку розширень.
Примітка: модуль автоматично вмикається після встановлення разом зі всіма основними опціями тому вам фактично нічого не потрібно робити. Розширення WebP конвертуватиме зображення у WebP під час першого завантаження сторінки та зберігатиме їх на вашому сервері.
Однак, якщо ви хочете налаштувати його, виконайте інші кроки.
2. Налаштуйте розділ General.
- Змініть показник якості (Quality). Він визначає розмір стиснутих зображень. Чим менше значення, тим менший розмір. Але й якість буде гіршою.
Примітка: ми рекомендуємо зберегти показник 85%, що задано за замовчуванням.
- Визначте, які дані ви хочете скопіювати в зображення WebP з оригінального зображення в полі Image Metadata.
- У полі Excluded Folders вкажіть, які папки із зображеннями ігнорувати під час конвертації у WebP.
- Очистіть кеш WebP (Clean WebP Cache), якщо ви хочете видалити всі зображення WebP, щоб змінити показник якості.
3. Заповніть Advanced WebP Conversion Settings.
- Ввімкніть опцію Convert HTML Picture Tag Images, якщо ви використовуєте теги picture для адаптивних зображень (responsive images) і хочете конвертувати їх у формат WebP.
- Ввімкніть опцію Convert CSS Background Images, якщо ви використовуєте фонові зображення CSS в стилі атрибуту HTML тегів (HTML tags style attribute).
- Вкажіть URL-адреси зовнішніх веб-сайтів у полі , якщо ви хочете, щоб вони також були конвертовані у WebP.
Не забудьте зберегти зміни та перейти на вітрини, щоб перевірити, як завантажуються WebP зображення.
Вам не доведеться турбуватися про постійну оптимізацію зображень із розширенням Shopware WebP, оскільки воно автоматично конвертує всі існуючі та майбутні зображення. І, як бачите, це не вимагає від вас жодних дій. Просто встановіть і користуйтесь!