WordPress Slider Block Gutenslider の使い方と設定
2020年5月17日
Gutenberg エディターにスライダーブロックを追加できる WordPress 用プラグインの紹介です。
それは「WordPress Slider Block Gutenslider」です。
その導入手順から日本語化・使い方と設定などを解説していきます。
WordPress Slider Block Gutenslider
WordPress Slider Block Gutenslider は、Gutenberg エディターにスライダーブロックを追加できます。
WordPress Slider Block Gutenslider の主な特徴は、以下のとおりです。
- コンテンツ・画像・ビデオのスライダーを作成可
- スライドを無制限に追加可
- 必要なブロックを追加可
- スライドの動作をフェードもしくはスライドを選択可
- 端末別(デスクトップ・タブレット・モバイル)にスライダーの高さを調整可
- ブロックの配置を全幅・幅広に変更可
- コンテンツの配置を上、中央、下に変更可
- 矢印のオン・オフの切り替え
- 矢印のサイズの変更
- ドットのオン・オフの切り替え
- ドットサイズの変更
- 間隔を上/下および左/右の変更可
- 全画面スライダー
- 自動キャプション
- スライドにハイパーリンクを張ることができます
- WebP 対応
記事を作成もしくは更新時点でのバージョン:5.7.0
マルチサイトでの利用:可
Gutenberg エディターでの動作
Gutenberg エディターに専用ブロックが追加されます。
インストール手順
WordPress Slider Block Gutenslider をインストールするには 2 種類の方法があります。
下記の URL から ZIP ファイルを入手して、管理画面からアップロードして有効化する。
WordPress Slider Block Gutenslider – WordPress.org
もしくは、WordPress.org の公式プラグインディレクトリにリリースされているので、
管理画面からインストールできます。
ダッシュボードから「プラグイン」メニューの「新規追加」を選択し、
プラグイン追加画面右上の検索窓に「WordPress Slider Block Gutenslider」と入力します。
検索結果の一番左上に表示されると思うので、「今すぐインストール」をクリックします。
※一番左上に表示されない場合は、上記の画像から探して下さい。
インストールが完了したら、プラグインを「有効化」します。
プラグインのインストールに慣れていない方は、
下記の記事にて詳しく解説していますので、御覧ください。
WordPressプラグインのインストール手順を解説 – WordPress活用術
日本語化
WordPress Slider Block Gutenslider を有効化した際に日本語化されない場合には、
日本語化用の言語パックを translate.wordpress.org から入手できる場合があります。
WordPress と関連プロジェクト(テーマ・プラグイン)用の翻訳プラットフォームとして、
translate.wordpress.org (GlotPress) が導入されています。
※ボランティアで翻訳されている場合が多いので、
全てのプラグインで、必ずしも日本語化用の言語パックが用意されているわけでは無いです。
また、用意されていても 100% 翻訳されている保証もありません。
日本語化用の翻訳ファイルの探し方は、下記の記事を参照してください。
WordPress公式での日本語化用の翻訳ファイルの探し方 – WordPress活用術
有効化すると
「スキップ」をクリックします。
専用メニュー
ダッシュボードの「設定」メニューの中に追加されています。
とは言っても設定項目はありません。
使い方
Gutenberg エディターで投稿を開きます。
スライダーブロックが一般ブロックに追加されています。
配置すると上のような感じになります。
スライダー設定
スライドの移動方法をフェイドインかスライドかを選択します。
コンテンツを固定化するか変更可にするかを選択します。
また、スライダーの高さを指定できます。
高さは、デスクトップ・タブレット・モバイル別に指定可。
1度に表示するスライドの枚数も指定できます。
- Autoplay
自動再生するかどうか。 - Show Arrows
矢印を表示するかどうか。 - Show Dots
ドットを表示するかどうか。 - Keyboard Navigation
キーボードナビゲーションを有効にするかどうか。 - Loop
ループ再生するかどうか。 - Fullscreen Background Slider
スライダーを全画面背景表示にするかどうか。
アローナビゲーションのアイコンやサイズ・色などを指定します。
Pause on Hover
マウスホバー時は、スライド再生を一時停止するかどうか。
スライド設定
スライドのカスタマイズもできます。
代替プラグイン
WordPress Slider Block Gutenslider にほしい機能が無かった場合には、
WordPress Slider Block Gutenslider 以外にもスライダーが作れるプラグインを記事にしています。
以下では、WordPress Slider Block Gutenslider を含めて 22 個を簡単に紹介しています。
URL
WordPress Slider Block Gutenslider – WordPress.org
ブロック追加,イメージスライダー系,コンテンツスライダー系,ビデオスライダー系
Posted by 管理人
関連記事
Advanced Gutenberg Blocks:Gutenbergに16種類の独自ブロックを追加できる
Gutenberg に様々なブロックを追加できる WordPress 用プラグイ ...
Gallery Blocks with lightbox and Lightbox for Native Image Galleryの使い方と設定
Gutenberg エディターに 3 種類のギャラリーブロックを追加できる Wo ...
Advanced Gutenberg:Gutenbergに22種類の独自ブロックを追加できる
Gutenberg に様々なブロックを追加できる WordPress 用プラグイ ...
Gutenbergに3つの表示スタイルをもつギャラリーブロックを追加できる:Block Gallery
Gutenberg エディターに 3 種類の表示スタイルをもつギャラリーブロック ...
SlidersPack:10種類のイメージスライダーが作れる
10 種類のイメージスライダーが作れる WordPress 用プラグインの紹介で ...