Как создавать и добавлять синемаграфы в WordPress

/

Вы хотите узнать, как создавать и добавлять синемаграфы в свои сообщения WordPress? Синемаграфы - это изображения, в которых одна часть или область движется, а остальная часть изображения остается неподвижной. Эти изображения очень интересны и добавляют элемент повествования в ваши статьи. В этой статье мы покажем вам, как легко создавать и добавлять синемаграфы в WordPress.

Создание синемаграфов для вашего сайта WordPress

Что такое Cinemagraphs?

Синемаграфы обычно представляют собой изображения в формате GIF, в которых небольшая часть изображения движется, а остальная часть остается неподвижной. Они выглядят очень кинематографично, отсюда и название синемаграф.

Предварительный просмотр синемаграфов

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

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

При этом давайте посмотрим, как легко создавать и добавлять синемаграфы в WordPress.

Создание Cinemagraphs из видео

Для начала вам понадобятся следующие предметы:

  1. Небольшой видеоклип, который нужно преобразовать в синемаграф.
  2. Adobe Photoshop
  3. Ваше время, терпение и творчество

Давайте начнем.

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

Затем вам нужно открыть Photoshop и импортировать ваше видео в слои, щелкнув меню File »Import» Video Frames to Layers.

Импортируйте видео в слои

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

Импорт видео в слои

Как только ваше видео будет импортировано, вы увидите видеокадры в виде слоев под панелью слоев.

Слои, импортированные из видео

Теперь вам нужно выделить все слои, кроме самого первого слоя (Layer 1).

Перейдите в меню Слой »Новый» Группа из слоев или нажмите Command + G (CTRL + G в Windows), чтобы добавить слои в группу.

Сгруппированные слои

Затем вам нужно выбрать группу и перейти к Layer »Layer Mask» Reveal All, чтобы добавить маску к группе.

Раскрыть все

После добавления маски нажмите клавиши Command + I (Ctrl + I в Windows), чтобы инвертировать цвет маски.

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

Почистите движущиеся части, чтобы выделить их

После этого перейдите в Окно »Временная шкала, чтобы открыть все ваши слои в формате анимации.

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

Лента новостей

Чтобы изменить это, выберите первый слой (Layer 1) на панели слоев и щелкните значок Unfiy Layer Visibility, а затем нажмите кнопку Match.

Унифицировать видимость

Затем щелкните значок переключателя на временной шкале и выберите все кадры. После этого снова нажмите переключатель, чтобы выбрать «Копировать кадры».

Копировать кадры

После копирования кадров нажмите кнопку-переключатель и выберите опцию «Вставить кадры».

Вам будет предложено выбрать метод вставки. Выберите «Вставить после выбора» и нажмите кнопку OK.

Вставить после выбора

Затем вам нужно еще раз нажать на значок переключения временной шкалы и выбрать опцию «Обратить кадры».

Обратные кадры

Ваша синемаграфическая анимация почти готова.

Чтобы сохранить его на свой компьютер, выберите «Файл» »Сохранить для Интернета. Это вызовет всплывающее окно, в котором вам нужно выбрать формат GIF и нажать кнопку сохранения.

Сохранить как GIF

Вот и все, что готово для вашего кинематографа.

Вы можете добавить его на свой сайт, как если бы вы добавляли любые другие GIF-файлы в WordPress. Просто отредактируйте сообщение или страницу, на которую вы хотите добавить синемаграф, и нажмите кнопку добавления мультимедиа.

Загрузите свой синемаграфический GIF в WordPress

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

После загрузки нажмите кнопку «Вставить в сообщение», чтобы продолжить.

Теперь вы увидите изображение в редакторе сообщений WordPress.

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

Пример синемаграфа

Мы надеемся, что эта статья помогла вам научиться создавать и добавлять синемаграфы в WordPress. Вы также можете увидеть наш список веб-сайтов, предлагающих бесплатные изображения для пользователей WordPress.

Нужна помощь с WordPress? Свяжитесь сейчас
[email protected]

Это переведенная версия оригинальной статьи от wpbeginner, весь контент, изображения и авторство принадлежит автору

Как добавить случайные изображения заголовков в свой блог WordPress

Вы хотите добавить случайные изображения заголовков в свой блог WordPress? Большинство тем WordPress имеют встроенную поддержку для добавления изображений

12 советов по оптимизации RSS-канала WordPress

Вы хотите оптимизировать RSS-канал WordPress? RSS-каналы предоставляют вашим пользователям простой способ подписаться на ваш контент. Однако не многие

Как показать количество подписчиков MailChimp в WordPress

Вы хотите отображать количество подписчиков MailChimp? Недавно один из наших пользователей спросил нас, как они могут показать количество подписчиков

Как создавать и продавать онлайн-курсы с помощью WordPress (шаг за шагом)

Знаете ли вы, что с помощью WordPress можно создать успешный онлайн-курс? Продажа онлайн-курсов - это популярная бизнес-идея в Интернете, которую можно