【SANGO】関連記事ショートコードをテキストリンク(文字)だけにするカスタマイズ

https://shikamori-p.com/wp-content/uploads/2019/01/2019-01-21.jpg
バビ

ごきげんよう、ハイパーマルチブロガーのバビです。

関連記事をテキスト(文字)リンクで入れることがあると思うんですが、リンク先の記事をリライトしてタイトルを変えたのに、テキストリンクに気付かずそのままになってしまうことがあります。

私はものぐさなのでそういうのを探して直すのがめちゃくちゃめんどくさいんです。

なので、SANGOの関連記事のショートコードをテキストリンクだけにするカスタマイズを作成しました。

↓↓これが

【Gutenberg】リストブロックをチェックマークにするカスタマイズ

↓↓こうなります。

これでタイトルを変えてもテキストリンクに自動で反映されるから、記事のリライトに集中できますね。

せっかくなのでメモがてら記事にしておこうと思います。

※注意※

割とてきとーに作ったので、コードが汚いかもしれません。

Gutenbergでの使用を前提に作っています。

CSSをコピペ

以下のCSSコードを、外観→テーマの編集→(子テーマの)「style.css」に貼り付けます。

/*--------------------------------------
関連記事テキストのみ
---------------------------------------*/
.textlink .linkto{
  display: inline;
    max-width: 100%; 
    padding: 0; 
    border: none;
    background: none;
    box-shadow: none;
    margin: 0;
    font-weight: 500;
    color:#1e73be;/*文字色*/
}
.textlink .linkto .tbtext {
    padding: 0;
    vertical-align: middle;
    line-height: 1;
font-size: 1em;
    text-decoration: underline;/*下線*/
}
.textlink .linkto img{
    display:none;
}
.textlink .linkto:after{
    display:none;
}
.textlink .linkto .tbimg{
    display:none;
}
.textlink .tbcell {
    display: inline;
    vertical-align: middle;
}

/*文字色*/のところは好きな色に変更してください。

text-decoration: underline;/*下線*/を消すとアンダーラインを消せます。

Gutenbergでの使い方(再利用ブロックに登録する)

使い方は簡単3ステップです。

4~5で再利用ブロックに追加します。

エディタ画面で「段落」を選択

※通常は「ショートコード」を使うんですが、ショートコードブロックには「高度な設定」がないので「段落」を使います。

関連記事のショートコード[kanren id="●●"]を入力
「高度な設定」の「追加CSSクラス」に「textlink」と入力
Gutenberg「高度な設定」「追加CSSクラス」

さらに再利用ブロックに追加しておけば次回から簡単に使うことができます。

右上の「詳細設定」(縦の・3つのマーク)から「再利用ブロックに追加」をクリック
「名前」のところに好きなブロック名を入れて「保存」を押せば再利用ブロックとして保存されます。

SANGOカスタムブロックなどと組み合わせて使う

リストやSANGOカスタムブロックとも組み合わせて使うことができます。

こんな感じで入力して、リストの「追加CSSクラス」に「textlink」と入れると

こんな感じで関連記事のテキストリンクを作ることができます。

おまけ:テキストリンクだとカニバるのか?

実はこれをやろうと思ったのは、リード文の最後に入れてたテキストの内部リンクのKWと、そのリンク先の記事がカニバってたから。

大した記事でもないので別にどっちでもよかったんですが、 ショートコード化したら解消するかなーと思ってやってみました。

https://shikamori-p.com/wp-content/uploads/2019/01/2019-01-21.jpg
バビ

解消されるかどうかは知らんです。

 

コメントを残す

メールアドレスが公開されることはありません。