Генерация плейсхолдеров изображений для шаблона перед отправкой на themeforest

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

Как сделать заглушки для картинок ?

Вариант 1

Можно воспользоваться сервисом https://placeholder.com/ и заменить ссылки всех изображений на ссылки типа:

 <img src="https://via.placeholder.com/150"> 

Таким образом вы получите такой результат:

page

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

Вариант 2

Воспользуемся сервисом: https://lab.csschopper.com/placeholder/

Используя данный сервис вы можете загрузить сразу все изображения своего HTML шаблона на сервис.
И дождавшись завершения обработки скачать архив с изображениями. В архиве будут лежать обработанные изображения серого цвета.

Я всегда создаю новую папку _images с нижним подчеркиванием и перемещаю в нее все плейсхолдеры. Потом перед загрузкой HTML шаблона на themeforest я удаляю папку images которая содержит картинки, и переименовываю _images в images

Вот так это выглядит:

page

Вид шаблона без заглушек:

page

С заглушками шаблон выглядит вот так:

page

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

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

Кстати, для создания заглушек есть плагины для gulp. Вот один из них: https://www.npmjs.com/package/@hidoo/gulp-plugin-image-placeholder

А как вы делаете заглушки для изображений в своих шаблонах ?
Напишите в комментарии :)


Понравилась статья ? Расскажи друзьям
Вконтакте
Плюсануть
Telegram