WordPress ブロックエディタの『ボタン』を新しいタブで開く(target="_blank")を付けるには……
WordPress ブロックエディタの『ボタン』を新しいタブで開く(target="_blank")を付けるには……

WordPress ブロックエディタの『ボタン』を新しいタブで開く(target=”_blank”)には……

UZUREA編集部 アイコン

UZUREA編集部

/ 更新:

当記事の内容および記事中のリンクには、広告目的や当サイトが収益を得るためのものが含まれており、これらの収益によってuzurea.netは運営されています。

WordPressのVer.5から導入されたブロックエディタ『Gutenberg』で、押しやすいリンクを作れる『ボタン』ブロック。 このボタンブロックには(2019年10月現在では)『新しいタブで開く』の設定ができないので、対処法を調べてみました。

※2019年11月のWordpress アップデートで、『ボタンで新しいタブで開く』は正式に実装されました。ばんざーい!

『ボタン』ブロックを『新しいタブで開く』には

ボタンブロック以外で、リンクを付与する時には当たり前のように設定できる『新しいタブで開く』。

テキストにリンクを付与すると普通に出て来る『新しいタブで開く』設定のON/OFF
テキストにリンクを付与すると普通に出て来る『新しいタブで開く』設定のON/OFF
ボタンブロックには『新しいタブで開く』設定が無い……
ボタンブロックには『新しいタブで開く』設定が無い……

この実装については、WordPress関連フォーラムでも論議されていたようです。

結論としては、色々な対応方法が議論され、前述のGithub フォーラム#10128で実装内容が確定し、デバッグも完了しているようです。

……という事で、今後のWordPressアップデートで実装されそうな雰囲気ですので、その時を待ちましょう。

今すぐ何とかしたい場合

今すぐ何とかしたいから、検索でこの記事にたどり着いたんじゃねえか!」 というご意見もあるかもしれませんので、対応策も掲載しておきます。

プラグイン『Gutenberg』を入れる

プラグインディレクトリにある『Gutenberg プラグイン』の最新版(※)をインストールする事で、最新のGutenbergアップデート版が利用できます。 (※登記事執筆時点ではバージョン 6.7.0 )

最新のGutenberg でのボタンブロック
最新のGutenberg でのボタンブロック

上記画像のように、投稿画面右側の設定カラムから『新しいタブで開く』を選択できるようになっています。 ちなみに角丸の半径もスライダー設定できるようにもなっていますね。

また、ボタンブロックだけでなく、画像ブロック段落見出しなどもUIが結構改良されていて、着実に進化していっているのを感じ取る事ができます。 プラグイン形式なので「やっぱり元に戻したい!」 と思ったら、プラグイン設定画面で『停止』するだけでOKです。

HTMLとして編集で対応する

やだやだ! プラグインも使いたくない! という方は……一旦ボタンをお好みの設定で作成してから、『HTMLとして編集』でご対応されては如何でしょうか。

HTMLとして編集で対応する
HTMLとして編集で対応する

ソースコードに手動で target="_blank"を付与すると、その後『無効なコンテンツが含まれています』とアラートが表示され、『HTMLに変換』を選択すると、半強制的にクラシックエディタに変更させられますが、一応目的は達成できます。

ちょっと不格好な気はしますが……。

まとめ

皆さんは、WordPress Gutenberg(グーテンベルグ)のブロックエディタへの乗り換えは済ませたでしょうか? プラグイン版の評価を見ているとまだ否定的な感想の人も多いようですが、実際に使い慣れると、便利な部分も多い事に気が付きます。

Gutenbergプラグインへの評価は2019年10月現在、星1つが一番多い。
Gutenbergプラグインへの評価は2019年10月現在、星1つ。 不満だらけ(汗

まだ発展途上な箇所が多く、クラシックエディタを併用しないとならない場面が多いのも事実です。 (tableブロックのthとか……)

とはいえ、膨大なユーザーや開発者が関わるWordPressコミュニティによって、日々リニューアル・アップデートされていますので、今後の事を考えれば早めに慣れておくのも良いのではないでしょうか。

何かブレイクスルーがあった時にそれを受け入れるか、拒否して古い物にこだわり続けるか。 個人的にはがんばって前者を選択していきたいと思っています。

WordPress ブロックエディタの『ボタン』を新しいタブで開く(target="_blank")を付けるには……

この記事をシェアする

この記事のタイトルとアドレスをコピー

この記事を気に入ったらハートマークで応援してください

この記事の執筆は……

UZUREA編集部 アイコン

UZUREA編集部

UZUREA.NET 編集部アカウント。 webデザイン会社altstackのメンバー、及び契約ライターによる匿名寄稿を含みます。

関連する記事

2024年4月スタートの春アニメ 全70作品一覧 放送日、公式&配信サイトまとめ【3月28日更新】

2024年4月スタートの春アニメ 全70作品一覧 放送日、公式&配信サイトまとめ【3月28日更新】

ジブリパーク新エリア『魔女の谷』 施設・カフェメニューなど詳細&写真と、宮崎吾朗監督のコメントも

ジブリパーク新エリア『魔女の谷』 施設・カフェメニューなど詳細&写真と、宮崎吾朗監督のコメントも

『令和6年能登半島地震』へ支援・募金ができるWebサービス・Webサイト まとめ

『令和6年能登半島地震』へ支援・募金ができるWebサービス・Webサイト まとめ

Hulu 2024年1月配信作品一覧 新作アニメは34作品配信、タイBL『2gether THE MOVIE』、韓ドラ『25時間恋愛』ほか【1月24日更新】

Hulu 2024年1月配信作品一覧 新作アニメは34作品配信、タイBL『2gether THE MOVIE』、韓ドラ『25時間恋愛』ほか【1月24日更新】

Amazon 2024年『福袋』注文受付中 コスメ、食品、家電、ベビー&マタニティ用品などのおすすめ商品をチェック!

Amazon 2024年『福袋』注文受付中 コスメ、食品、家電、ベビー&マタニティ用品などのおすすめ商品をチェック!

Hulu 2023年12月配信作品一覧 海外ドラマ『NCIS: LA』ファイナルS、劇場版『きのう何食べた?』、韓ドラ『シェアオフィスで何してる?』など 【12月28日更新】

Hulu 2023年12月配信作品一覧 海外ドラマ『NCIS: LA』ファイナルS、劇場版『きのう何食べた?』、韓ドラ『シェアオフィスで何してる?』など 【12月28日更新】

2023年10月スタートの秋アニメ 全81作品一覧 注目作品、放送日、公式&配信サイトまとめ【3月20日更新】

2023年10月スタートの秋アニメ 全81作品一覧 注目作品、放送日、公式&配信サイトまとめ【3月20日更新】

2023年7月スタートの夏アニメ 全60作品一覧 注目作品、放送日、公式&配信サイトまとめ

2023年7月スタートの夏アニメ 全60作品一覧 注目作品、放送日、公式&配信サイトまとめ

Amazonプライム・ビデオ 2023年2月『月替わりセール レンタル100円/購入500円』対象作品一覧

Amazonプライム・ビデオ 2023年2月『月替わりセール レンタル100円/購入500円』対象作品一覧

Amazonブラックフライデー2022完全攻略 おすすめ商品、uzurea限定クーポンも 11/25~12/1

Amazonブラックフライデー2022完全攻略 おすすめ商品、uzurea限定クーポンも 11/25~12/1

2022年7月Amazonプライムデーをもっとお得に! 注目商品一覧、キャンペーンまとめ【2022年7月8日更新】

2022年7月Amazonプライムデーをもっとお得に! 注目商品一覧、キャンペーンまとめ【2022年7月8日更新】

11円で買えるKindleコミック セール情報まとめ 話題作、名作など全巻一気買いのチャンス

11円で買えるKindleコミック セール情報まとめ 話題作、名作など全巻一気買いのチャンス


page top