小説家になろうにて「キモオタでギャルゲー、それって何の罰ゲーム!?」連載中!

ブログカードをカスタマイズする ~Lightningカスタマイズ第8回

Lightning
この記事は約3分で読めます。

質問者の写真

ブログカードが大きすぎるから!

【2020/02/09 大幅改訂】

スポンサーリンク
この記事を読む方へのオススメ

Lightningにはテーマ独自のブログカード機能がない

WordPress標準のカードは大きすぎる

Liightningにはテーマ独自のブログカード機能を搭載していません。
WordPress標準搭載のembed(埋め込み)機能を使います。

その結果どうなるか。
こうなります。

質問者の写真

でけえ!

もちろん大きい画像が表示される方がいい場合もあるのですが。
なんでもかんでもこんな風に表示されたらウザイです。
そのためカスタマイズが必要となります。

CSSカスタマイズもできない

質問者の写真

だったらCSSカスタマイズをしよう!

これがきっと普通の発想でしょう。
もちろんCSSで整えることもできます。

自サイトに限ればだけどね……

他サイトのカードは、他サイトのレイアウトが適用されてしまいます(iframeなので)。
はっきり言って意味ありません。

それどころか当サイトみたいな埋め込みを無効にしているサイトですと、リンクを書き込んだところでカード化すらされません。

こんな風に文字列が表示されるだけ。
しかたないので、下のように通常のリンクを貼るしかないわけです。

Luxeritasやcocoonなど他の無料テーマが独自のブログカード機能を実装しているのは、こうした事情によるです。

対処方法

方法は2つあります。

1つは、Lightningにブログカード機能を実装する。
1つは、プラグインを使う。

スポンサーリンク

方法1 Lightningにブログカード機能を実装する

具体的には、「わいひら」さんの製作したWordPress無料テーマ「Simplicity」のコードを移植します。
わいひらさんは先に名前を挙げた「cocoon」の作者でもあります。

1 次の記事を参考にしてコードを記述する

URLを記入するだけ!WordPressに内部ブログカードを実装するカスタマイズ方法
自分のブログ内のURLを、Wordpressのブログエディターに貼り付けるだけで、簡単にブログカード表示できるカスタマイズ方法です。

2 プラグイン「Disable Embeds」をインストールして有効化する

色々試したのですが……「Lightning」ではプラグインでないとoEmbedsを切れませんでした(検証当時)。
私の環境だけかもしれませんので「この記述でいけたよ~」というのがありましたら教えて下さい。

3 次の記事を参考にして、functions.phpにコードを記述する

https://technote.space/blog/archives/512 リンク切れ

コードをそのまま貼るのではなく、「一括削除」に修正した方が楽です。

4 投稿一覧を開き「oEmbed Cache削除」ボタンを押す

ボタンをクリックで消去できます。

3 埋め込みのキャッシュを削除する

記事執筆当時のリンクが切れていましたので。
恐らくこちらでできるのではないでしょうか?

WordPressのブログカードを削除(リセット)する簡単な方法 | Fantastech(ファンタステック)
WordPressには、URLを貼り付けるだけで自動でコンテンツに変換してくれる機能があります。 TwitterもInstagramも、わざわざHTMLコードを貼り付けなくても、ただURLをコピーしてWordPressの記事執筆画面で貼り付けるだけで埋め込まれる(実際の表示になる)んです。ご存知でしたか? これは俗に「...

4 完成

これで過去の記事におけるWordpress標準のブログカードはSimplicityのブログカードと置き換わりました。
以降に作成した記事は新しいブログカードで表示されます。

スポンサーリンク

方法2 プラグインを使う

具体的には、Pz-LinkCardです。

Pz-LinkCard
このプラグインは、ブログカード形式のリンクを表示することができます。テキストのみのリンクにさようなら。

ですが、私は推奨しません。

Pz-LinkCardは以前に試したことがありますが、機能そのものは問題ありません。
デザインを設定するのに手間が掛かるくらいで。

問題は、プラグインを使うことでどんどんサイトが重くなっていくこと。
つまりPz-LinkCardに限った話ではありません。

それでも使ってみたいという場合は、こちらの記事が参考になるかと思います。

WordPressでリンクをカード形式で表示する Pz-LinkCard
リンクをカード形式で表示させるWordPressプラグイン「Pz-LinkCard」を公式プラグインディレクトリで公開しています。当ページは「Pz-LinkCard」の説明書のようなもので、プラグインのバージョンアップとともに更新しています
スポンサーリンク

まとめ

解答者の写真
カード小さくなったわね
アドセンス有りでもPageSpeed Insightで100点満点!

超光速サイト実行環境KUSANAGI&WEXAL。
コスパ抜群のレンタルサーバーConoHa。
もっと知りたい方はボタンをクリックしてください。
特集記事の目次が開きます。

この記事を書いた人

広島市内のパチンコホール勤務。
3号機時代からのパチンカス。
ADHD、精神障害者手帳3級所持。
慶應義塾大学商学部卒、専攻はマーケティング(広告・宣伝)
国家一種試験経済職の資格で公安調査庁に入庁。
在職時は国際テロ、北朝鮮を担当。
「小説家になろう」の底辺作者。
WordPress記事は素人の備忘録です。

天満川鈴をフォローする
Lightning
スポンサーリンク
きもおたねっと。
タイトルとURLをコピーしました