Title: WP GIF Player &#8211; Play &amp; Pause
Author: Roel Magdaleno
Published: <strong>2020年4月22日</strong>
Last modified: 2021年4月11日

---

プラグインを検索

![](https://ps.w.org/wp-gif-player-play-and-pause/assets/banner-772x250.png?rev=
2288909)

このプラグインは **WordPress の最新3回のメジャーリリースに対してテストされていま
せん**。もうメンテナンスやサポートがされていないかもしれず、最新バージョンの WordPress
で使用した場合は互換性の問題が発生する可能性があります。

![](https://ps.w.org/wp-gif-player-play-and-pause/assets/icon-256x256.png?rev=2288909)

# WP GIF Player – Play & Pause

 作者: [Roel Magdaleno](https://profiles.wordpress.org/rokumetal/)

[ダウンロード](https://downloads.wordpress.org/plugin/wp-gif-player-play-and-pause.0.1.3.zip)

 * [詳細](https://ja.wordpress.org/plugins/wp-gif-player-play-and-pause/#description)
 * [レビュー](https://ja.wordpress.org/plugins/wp-gif-player-play-and-pause/#reviews)
 *  [インストール](https://ja.wordpress.org/plugins/wp-gif-player-play-and-pause/#installation)
 * [開発](https://ja.wordpress.org/plugins/wp-gif-player-play-and-pause/#developers)

 [サポート](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/)

## 説明

You can select one of the three GIF player methods in the plugin options page.

### GIF

This is the default method.

When a GIF is uploaded in your Media Library it will create an image thumbnail to
use it as the GIF player preview and when the user clicks on the GIF player the 
original GIF will be loaded once.

### Canvas

With this method every GIF will be loaded in your post and then converted into a
[playable canvas](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API). 
A thumbnail image is created as well when uploading the GIF in your Media Library.

For this process we’re using the [libgif.js](https://github.com/buzzfeed/libgif-js)
JavaScript library by BuzzFeed.

### Video (Recommended)

Every GIF file will be converted to these video formats:

 * WebM
 * MP4

Why videos?

It is known that GIF files sizes are bigger than a video so using a video instead
of a GIF file [will help your website performance](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/replace-animated-gifs-with-video).

Want more details about converting GIF to video? [Check the GIF as Video wiki](https://github.com/roelmagdaleno/wp-gif-player-play-and-pause/wiki/GIF-as-Video).

### Thumbnail Preview

The plugin will grab the GIF file and extract the first frame as JPEG image and 
use it as thumbnail preview. This file will be saved in the same folder of the original
GIF.

The thumbnail image always generate once and doesn’t matter the selected GIF method.

### Shortcode

If you’re still using the WordPress Classic Editor you must use the next shortcode:

    ```
    [gif-player id="gif_id"]
    ```

If you don’t know the GIF ID you can add a GIF player using the “**Add GIF Player**”
button next to the “**Add Media**” button.

When you click the “**Add GIF Player**” button the Media Library window will open
and you will be able to select or upload your GIF.

When you save and view the post, the plugin will render the GIF Player according
to the selected GIF Method in the plugin options page.

### Gutenberg Block

You can use the GIF Player as a Gutenberg block. [Check the wiki for more details](https://github.com/roelmagdaleno/wp-gif-player-play-and-pause/wiki/Gutenberg-Block).

### Is compatible with Lazy Load?

Some Lazy Load plugins are compatible with the three GIF player methods in the plugin
but there are other plugins that won’t allow you to reproduce the GIF player.

In case the GIF player cannot reproduce you can use your Lazy Load plugin filters
to skip Lazy Load by using the GIF CSS classes.

The CSS classes for every GIF player are:

 * GIF: `wp-gp-pp-gif`
 * Canvas: `wp-gp-pp-gif-canvas-player`
 * Video: `wp-gp-pp-video-player`

If your Lazy Load plugin ask you to add a custom CSS class into the GIF asset to
avoid Lazy Load you will have to use the GIF player custom filters in your `functions.
php` file. [Check the custom filters to avoid Lazy Load for the GIF players](https://github.com/roelmagdaleno/wp-gif-player-play-and-pause/wiki/Hooks).

### GIF as Video – Fallback

If for any reason your current GIF Player as Video doesn’t have any video source
the plugin will render the default GIF Player (GIF) as fallback.

## スクリーンショット

[⌊screenshot-1: Plugin Options.⌉⌊screenshot-1: Plugin Options.⌉[

screenshot-1: Plugin Options.

[⌊screenshot-2: Generate GIF Player for existent GIF file.⌉⌊screenshot-2: Generate
GIF Player for existent GIF file.⌉[

screenshot-2: Generate GIF Player for existent GIF file.

[⌊screenshot-3: Add GIF Player from button in Classic Editor.⌉⌊screenshot-3: Add
GIF Player from button in Classic Editor.⌉[

screenshot-3: Add GIF Player from button in Classic Editor.

[⌊screenshot-4: Search and insert the Gutenberg Block.⌉⌊screenshot-4: Search and
insert the Gutenberg Block.⌉[

screenshot-4: Search and insert the Gutenberg Block.

[⌊screenshot-5: Upload or select the GIF using the Gutenberg Block.⌉⌊screenshot-
5: Upload or select the GIF using the Gutenberg Block.⌉[

screenshot-5: Upload or select the GIF using the Gutenberg Block.

[⌊screenshot-6: Preview the Gutenberg Block GIF Player.⌉⌊screenshot-6: Preview the
Gutenberg Block GIF Player.⌉[

screenshot-6: Preview the Gutenberg Block GIF Player.

## ブロック

このプラグインは1個のブロックを提供します。

 *   GIF Player

## インストール

 1. Upload the plugin files to the `/wp-content/plugins/wp-gif-player-play-and-pause`
    directory, or install the plugin through the WordPress plugins screen directly.
 2. Activate the plugin through the ‘Plugins’ screen in WordPress
 3. Use the Settings->WP GIF Player screen to configure the plugin.

## FAQ

### What if already have a GIF in my Media Library?

For those GIF files that are already uploaded in your Media Library you can generate
the assets in one click.

You just have to go to your Media Library section and see the media files as list
then hover the GIF you want to generate the assets and click “Generate GIF Player”
option.

You should see an admin notice after success or fail assets generation.

### What libraries or tools do I need to use GIF players as video?

To use the GIF Player as video you need two things:

 * **FFMpeg library**. This is the library to convert the GIF files to video format.
 * **shell_exec**. A PHP function to run the ffmpeg command.

[Check the GIF as Video wiki](https://github.com/roelmagdaleno/wp-gif-player-play-and-pause/wiki/GIF-as-Video)
for more details.

### What video formats does the GIF convert to?

By default the plugin **converts the GIF to WebM and MP4** but you can add more 
[using the custom filters](https://github.com/roelmagdaleno/wp-gif-player-play-and-pause/wiki/Hooks).

### Is compatible with Lazy Load?

Some Lazy Load plugins are compatible with the three GIF player methods in the plugin
but there are other plugins that won’t allow you to reproduce the GIF player.

In case the GIF player cannot reproduce you can use your Lazy Load plugin filters
to skip Lazy Load by using the GIF CSS classes.

The CSS classes for every GIF player are:

 * GIF: `wp-gp-pp-gif`
 * Canvas: `wp-gp-pp-gif-canvas-player`
 * Video: `wp-gp-pp-video-player`

If your Lazy Load plugin ask you to add a custom CSS class into the GIF asset to
avoid Lazy Load you will have to use the GIF player custom filters in your `functions.
php` file. [Check the custom filters to avoid Lazy Load for the GIF players](https://github.com/roelmagdaleno/wp-gif-player-play-and-pause/wiki/Hooks).

## 評価

![](https://secure.gravatar.com/avatar/2aff99a6c7ab59b00592786a85c08da86a2794a9e2af10ee0246bfeb247a4cc2?
s=60&d=retro&r=g)

### 󠀁[Wonderful plugin](https://wordpress.org/support/topic/wonderful-plugin-784/)󠁿

 [Henry Douglas](https://profiles.wordpress.org/henrydouglas/) 2023年11月10日

Wonderful plugin. It's super easy to use! Congratulations!

 [ 0件のレビューをすべて表示 ](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/)

## 貢献者と開発者

WP GIF Player – Play & Pause はオープンソースソフトウェアです。以下の人々がこのプラグ
インに貢献しています。

貢献者

 *   [ Roel Magdaleno ](https://profiles.wordpress.org/rokumetal/)

[“WP GIF Player – Play & Pause” をあなたの言語に翻訳しましょう。](https://translate.wordpress.org/projects/wp-plugins/wp-gif-player-play-and-pause)

### 開発に興味がありますか ?

[コードを閲覧](https://plugins.trac.wordpress.org/browser/wp-gif-player-play-and-pause/)
するか、[SVN リポジトリ](https://plugins.svn.wordpress.org/wp-gif-player-play-and-pause/)
をチェックするか、[開発ログ](https://plugins.trac.wordpress.org/log/wp-gif-player-play-and-pause/)
を [RSS](https://plugins.trac.wordpress.org/log/wp-gif-player-play-and-pause/?limit=100&mode=stop_on_copy&format=rss)
で購読してみてください。

## 変更履歴

#### 0.1.3

 * FIX #8: add_gif_button_scripts() method running in frontend page and should run
   in backend

#### 0.1.2

 * FIX: GIF Canvas were showing the original width and height.
 * FIX: FFmpeg command not found message was showing another message.
 * FIX: GIF files were not converted to MP4 due to scale issues.
 * FIX: GIF files were saving in DB when these didn’t exist.
 * IMPROVE: Run GIF Player JS functionality when exists in the post.
 * FEATURE: Add warning notice when a GIF Player Video rendered as fallback.

#### 0.1.1

 * FEATURE: Add filter to update the default CSS classes for the GIF asset.
 * IMPROVE: Check if the real GIF has any source in its attribute.
 * FIX: It was finding the selector using nextChild instead of parentElement.

#### 0.1.0

 * Initial plugin functionality. Check the [GitHub Repository](https://github.com/roelmagdaleno/wp-gif-player-play-and-pause)
   to check the commits.

## メタ

 *  バージョン **0.1.3**
 *  最終更新日 **6年前**
 *  有効インストール数 **300+**
 *  WordPress バージョン ** 5.0またはそれ以降 **
 *  検証済み最新バージョン: **5.7.0**
 *  PHP バージョン ** 7.0またはそれ以降 **
 *  言語
 * [English (US)](https://wordpress.org/plugins/wp-gif-player-play-and-pause/)
 * タグ
 * [gif](https://ja.wordpress.org/plugins/tags/gif/)[player](https://ja.wordpress.org/plugins/tags/player/)
 *  [詳細を表示](https://ja.wordpress.org/plugins/wp-gif-player-play-and-pause/advanced/)

## 評価

 5つ星中5つ星

 *  [  1 5-星レビュー     ](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/?filter=5)
 *  [  0 4-星レビュー     ](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/?filter=4)
 *  [  0 3-星レビュー     ](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/?filter=3)
 *  [  0 2-星レビュー     ](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/?filter=2)
 *  [  0 1-星レビュー     ](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/#new-post)

[すべてのレビューを見る](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/reviews/)

## 貢献者

 *   [ Roel Magdaleno ](https://profiles.wordpress.org/rokumetal/)

## サポート

意見や質問がありますか ?

 [サポートフォーラムを表示](https://wordpress.org/support/plugin/wp-gif-player-play-and-pause/)

## 寄付

このプラグインが今後も改善できるよう応援しませんか ?

 [ このプラグインに寄付 ](https://paypal.me/roelmagdaleno)