プログラミング PR

【Word Press】JINテーマで「あわせて読みたい」のリンクが貼れていない時の対処法

記事内に商品プロモーションを含む場合があります

ある日突然、ブログのリンクが貼れてないってことはありませんでしたか?

 

Word Pressの「あわせて読みたい」において、JINのテーマを使っている方向けでこんなトラブルはないでしょうか?

自分は唐突にやってきたので、多少テンパりましたがなんとか解決できたので、自分の場合のトラブル対応について解説していきます

 

あわせて読みたいの貼り方

JIN公式ページでは、テキストに直接URLを貼るだけでリンクされるとのことですので、基本的にはコピペでOKです

 

回遊性を高める「ブログカード」が超簡単に作れる!JIN公式ページ

 

ただし条件としては、リンクの前後に十分な空欄を作るとのことです

 

ですので、難しいことなく貼れるはずなのですが、先日更新したこの記事でトラブルが発生しました

 

【Studio One】音圧UP&ミックス(マスタリング)を標準プラグインだけでやってみる場合のオススメテンプレを紹介Studio Oneでミックスや音圧UPを標準プラグインだけでやりたい方向けに、具体的なEQを交えて紹介します...

 

トラブルの中身と対処法について

トラブルとは

こんな感じでリンクのテキストだけが、表示されるということがなかったでしょうか?

 

正直焦りました(笑)

リンクをコピペするだけでOKかと思っていたら、リンクが貼られていなかったので、、、

 

ということで、このトラブルを解消するステップを確認していきましょう

 

テキストを開き<p>タグを削除

 

ClassicEditorを使用している方はまず、テキストをクリックしてタグを確認してみてください

そうすると、リンクに<p>のタグで囲まれていると思います

 

この<p></p>タグはテキストタグとなりますので、ただ単にWEBページ上でURLをテキスト情報として載せているという状態となります

つまり、リンクが貼られていないということになります

 

これを解消するためには、まずリンクの<p></p>タグを削除します

 

空欄を作る

 

JINの「あわせて読みたい」を作る条件として、十分な空欄を作るということになりますので、ここで<p>&nbsp;</p>タグを追記します

これは、空欄を作るためのHTMLになりますので、ひとまずこれでリンク前後に十分なスペースを確保しましょう

 

このタイミングでプレビューを確認します

という感じで、pタグを削除して、空欄を作ったにもかかわらずリンクが出ていない場合があります

これは、原因はよくわからなかったのですが、Classic Editorが何らかの悪さをしている模様です

 

ですので、一旦Classic Editorをプラグインから無効化し、グーテンベルクに移行します

 

グーテンベルクへ

 

Word Pressのプラグインから「Classic Editor」を探し、「無効化」をクリックします

 

そうすると、グーテンベルクに移行します

 

グーテンベルクでテキストを入力する

先ほどのClassic Editorと同じく、テキストで入力をしていきます

 

 

黄色の矢印のメニューから緑の矢印の「コードエディターをクリックします」

そうすると、先ほどいじったのと同じようにテキスト状態になります

 

リンクの箇所の前後<p>&nbsp;</p>タグを一度削除し、もう一度<p>&nbsp;</p>タグを入力します

 

 

このタイミングでプレビューを見てみましょう!

 

 

かなり空欄を作ったので、余白が多く感じますが、一旦はこれで「あわせて読みたい」が表示されました

あとは、リンクが消えない程度に<p>&nbsp;</p>タグを消していき、いい感じに仕上げたらOK!

 

まとめ

ちなみに今回の記事は、問題なくコピペだけでリンクが貼れています

 

恐らく原因としては、グーテンベルクで一度記事を書いてその後、Classic Editorに戻したことで、タグが発生したのではないかと考えます

これまで、Classic Editorでテキストを開いても<p>タグは無かったので、正直驚いています

今後も、なんらかのトラブルがあれば記事にまとめていきますので、よろしくお願いします!

 

ということで、手順を簡単にまとめて終了します!

  1. Classic Editorのテキストよりリンクの<p></p>タグを削除
  2. <p>&nbsp;</p>タグを追記
  3. 表示されない場合は、プラグインのClassic Editorを無効化
  4. グーテンベルクでテキストを開き、<p>&nbsp;</p>タグを一度削除、もう一度追記をする
  5. プレビューで表示されたらOK

では、また!!

関連記事