\便秘がち&コーヒー好きの方におすすめ「食物繊維コーヒー」飲んでみた/

グーテンベルクでrinker(リンカー)は使えるかっていう話。

ワードプレスでグーテンベルク使い始めたけど、商品管理プラグインの「rinker」(リンカー)って使える?ていうか、どこ?

おんな

という方向けのお話です。

そのうち、ワードプレスの入力方法って、クラシックエディタからグーテンベルクになるんだろうな・・と思うのでちょっとずつ使い方を覚えている最中です。

で、rinkerですね。

使えます。

ダッシュボード上には「商品リンク」の項目はあるものの、いざ投稿画面になると今までのようにボタンなどは有りません。

ブロック内での操作でリンカー挿入できます。←つか、自分も最近見つけました

毎日色々発見があるので、ちょいちょい共有できたらいいかなと思います。

  • グーテンベルクでのリンカー挿入のやり方
  • AMPでリンカー表示はできるのか

についてざっくり紹介しています。

グーテンベルクでrinker(リンカー)商品リンクを貼る方法

早速紹介していきます。

2つやり方があります。

rinker挿入のやり方~その1

1つ目はダッシュボードから商品リンクを取得して、記事内に貼り付ける方法です。

→「商品リンク」

→「新規追加」

→「商品情報を取得」

amazonまたは楽天から商品を検索します。

→紹介したい商品が決まったら「商品リンクを追加」

URL等が表示されます。

→「公開」を選択

→ダッシュボードの「商品リンク」を選択

追加した商品が一番上に表示されているはずです。

→右側の「ショートコード」をクリックしてコピー

※(〇〇は表示されている数字)

→記事投稿画面でブロックに直接貼り付け

ここまでは、クラシックエディタと同様に使用できます。

続いて記事内の各ブロック内でrinkerを挿入する方法です。

rinker挿入のやり方~その2

記事を編集しながら、商品リンクを追加する場合はこちらの方法になりますね。

ブロック左の「+」マークをクリックして

→レイアウト要素

→rinkerをクリック

ボックスが挿入されます。

右側の「商品リンク追加」をクリック

見慣れた商品検索画面になります。

amazonまたは楽天から商品を検索して「商品リンクを追加」を選択

ボックス内に商品のショートコードが表示されたらOK。

一度プレビューで確認してみるとわかりますが、投稿画面に商品情報が表示されています。

ブロックに挿入したrinkerの検索ボックスは、コードに変換されたりすることなくこのままです。

MEMO
なので、別の商品に変えたい場合は、再度ボックス右側の「商品リンク追加」ボタンから操作することで変更できます。

余談

ちなみに、紹介したい商品のショートコードがわかっている場合

  • ブロックに直接コードを書き込む
  • レイアウト要素から挿入したrinkerボックス内に書き込む

どちらも同様に表示されます。

この場合は、ブロック内に直接書き込むほうが楽ですね。

rinkerはAMPページで表示される?

ちょっと話は逸れますが、昨今の検索結果はモバイル表示が重要視されています。

ページの高速化に猛威を奮うAMP作戦。

AMP化されているページでrinker画像が表示されるか、という話です。

AMP出掛けの頃は、シンプルなページで読み込みが早いのは理解できるんですが、制約が多すぎて結果どのページも似たようなデザインになるよね・・という話も出ました。

その辺は、AMPを推進しているチームが日々進化させているようです。

で、AMP化のやり方次第で状況は変わると思います。

自分の場合・・

  • テーマ「cocoon」
  • テーマ内の設定でAMP化

この状況で、正常に表示されています。

実際のモバイル表示

ただ、あまり商品リンクを貼りすぎても、読み込みスピードに影響しそうなので、それなりにしたほうが良いのかなと思ってます。

>>ビジターアンケートの2020に当選。iphone11が100円。のウソ。

>>ワードプレスでパーマリンクの変更ができない~Gutenbergの話。

以上参考になれば。

ではでは。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です