強引なスライドショー #Gutenberg

WordPress.comにも新エディタGutenbergが実装されたようですね。

【使ってみた】Gutenberg@オイラのWordPressブログ

↑の投稿でもふれたとおり、再利用ブロックなどを使うとかなり便利だとは思います。しかし従来エディタでできたことが、未だできない、もしくは手間がかかることもあります。

その一つがスライドショーです。現状のGutenbergでスライドショーを表示させる方法を考えてみました。

スライドショーに表示させる写真は昨日投稿した記事の画像ですw。

現行のGutenbergでは画像の表示列数を指定できるだけの、ギャラリーが使えます。

これを何とかして、Gutenbergでスライドショーで表示しようと思います。それにはショートコードブロック[/]を使います。

ショートコードブロックの入力欄に[]で挟んでgallery type=”slideshow” ids=”29213,29216,29215,29222,29221,29223,29224,29225″と内に入れると↓のとおりスライドショーが生成されます。

スライドショーには JavaScript が必要です。

問題はids=”画像id1,…画像id2”です。ギャラリーライブラリーを見てもわかりません。最初のギャラリーブロックをHTML編集に切り替えて、data-id=”画像id”をコピペして、ギャラリーブロックが不要であれば削除というのくらいしか思いつきません。他の方法として下記2つほど思いつきましたが、いずれもメンドイです。

  • スライドショーを表示したい記事は旧エディターで編集。
  • 旧エディターでダミーの記事を作っておいて、スライドショーを作成→HTML編集モードでスライドショーのショートコードをコピー、本番記事のショートコードブロックにペースト。。

どうやら、↓のリンク先にもあるように、Gutenbergのスライドショーブロックは、この投稿時点では開発中のようです。バージョンアップまで、めんどい方法でしのぐしかなさそうですね。

https://github.com/WordPress/gutenberg/issues/6608

にほんブログ村 IT技術ブログ WordPressへ

メールアドレス、WordPress.com, Twitter等のSNSアカウントでコメントできます。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください