どうも、笹塚神之介です。
この記事ではワードプレスにブログカードを表示させて記事内リンクを設置させる方法を解説していきます。
1つ目はプラグインで追加する方法、こちらは【Pz-LinkCard】を活用していきます。
この導入方法の後で自作で追加できるブログカードの導入方法も解説しています。それでは解説していきます。
この記事の内容
ブログカードを表示させる方法をプラグインor自作追加する方法を解説！
簡単に記事内リンクをブログカード形式で表示できるようになり、リンク先の「記事タイトル・抜粋・サムネイル画像・ソーシャルメディア共有数」を表示する機能もあります。更にブログカードの外観や表示内容を細かく設定できるので、様々なブログのデザインに合わせることができます。
このプラグインはブログ記事の中で「外部サイトの記事」や「自分のブログ内の記事」を紹介する際に利用すると便利です。
リンク先のURLを一元管理するのにも役立ちますので、是非このプラグインを活用してみてください。
このプラグインが優れている点
- ブログ記事のリンクをブログカード形式で表示できる。
- 専用のショートコードでURLを指定するだけなので簡単に利用できる。
- リンク先の情報がキャッシュされます。（毎度データ取得しないので重たくならない）
- リンク先の「記事タイトル・抜粋・サムネイル画像・ソーシャルメディア共有数」を表示できる。
- ブログカードの外観や表示内容を細かく設定できる。
- プラグインの管理画面は日本語表記で使いやすい。
インストール方法
管理画面から検索してインストールして下さい。
もしくは、WordPress.org からダウンロードし、アップロードしてインストールして下さい。
- WordPress管理画面 ＞ プラグイン ＞ 新規追加 ＞「Pz-LinkCard」で検索
- WordPress.org からダウンロード
公式サイト → WordPressでリンクをカード形式で表示する Pz-LinkCard
Pz-LinkCardの使い方
ブログの記事の中で「外部リンク・内部リンク」を張る際に、専用のショートコードとURLを記述して利用します。赤文字の部分はリンク先のURLを記述します。
ショートコードの見本
[blogcard url=”https://cr-life.jp/”]
ショートコード挿入ボタン
ビジュアルエディタまたはテキストエディタから専用のショートコードを簡単に挿入できます。
Pz-LinkCardの初期設定
管理画面の場所
このプラグインの管理画面は下記の場所にあります。
WordPress管理画面 ＞ 設定 ＞ Pzカード設定
WordPress管理画面 ＞ ツール ＞ Pzカード管理
Pzカード設定
プラグインの設定は初期設定のままでも運用できます。
設定項目が多いので、重要な部分のみ説明します。
定型書式
ブログカードのデザインは「かんたん書式設定」で変更できます。
好きなデザインに変更して運用しましょう。
- Pz リンクカード 標準書式
- シンプル
- セロハンテープ（中央）
- セロハンテープ（左上と右上）
- セロハンテープ（長め）
- 斜め
- 3D回転
- 紙がめくれた効果
- テープと紙めくれ
- 縫い目（青＆赤）
- 縫い目（緑＆黄色）
- ブルーグリーン（黒背景推奨）
- オレンジ（黒背景推奨）
- グリーン（黒背景推奨）
- ブルー（黒背景推奨）
- 押しピン
ショートコード
ショートコードの文字列を自由に変更できます。
通常の場合は設定はそのままで問題ありません。
表示設定
ブログカードの余白や表示内容を変更できます。
必要に応じて設定を調整してください。
外部リンク
一般的なブログを運用する場合は、「nofollowを付与する」の部分にチェックを入れて設定を保存しておきましょう。そうしておけば、リンク先に対して検索エンジンが巡回しなくなります。
Pzカード管理
ブログカードとしてキャッシュ（一時保存）されたURLが一覧表示されます。
キャッシュされている情報を確認したい時に利用します。
URLが日本語だと文字数が多くなってしまうのが難点ですが、特に支障はないので問題ないですね。
サイトが重たくさせない人向け自作ブログカード
見た目は非常にいい今回のプラグインなのですが、ただ一点欠点があります。
それはサイトが重たくなる事です。
なのでもし、それを防ぎたいのであれば、ワードプレスのテーマを修正することでリンクカードが使えるようになるので解説しておきます。
自作のブログカード作成方法
ワードプレスのテーマ編集を選択して、functioons.php内に下記のコードをコピーします。
functioons.phpに追加するコード
こちらでコードを記載しているので、飛んだ先のコードをコピーします。
style.cssに追記するコード
続いてテーマ内にあるstyle.css内に飛んだ先のコードをコピペしましょう。
実際に使うショートコード
上記のコードのコピペが終わったら、ブログカードを追加したい記事の箇所に
1 | [nlink url="記事リンク"] |
と入力して飛ばしたい記事リンクURLを記入すればＯＫです。
毎回ショートコード打つのはしんどい！
毎回ショートコードを打つのが嫌な人が大半だと思うので、ショートコードを簡単に張れるプラグインを紹介します。
ショートコードを簡単に記事に追加する為には、「AddQuicktag」というプラグインを使ってショートコードを登録しておくと便利です。
手順詳細
以上で、重たくならないブログカードの導入方法でした。
どちらか片方をお使いください。
最後
今回は、記事内リンクをスムーズに行えるワードプレスプラグインPz-LinkCardについて解説していきました。
これを導入すると、リンクが本当に起きやすいのでお勧めです。是非導入してみてくださいね。
他に、サイトが重たくならないブログカードの追加方法も解説しました。どちらかお好きな方をお使いください。
これ以外にお勧めなプラグインを記事にまとめていますので、興味がある方はご覧ください。
