komidoriの今が旬!!

暮らしの中での「はてな?」や「これスゴ~イ!」をアラカン主婦komidoriがリサーチしてお届けします。人生はこれからだ~!!

wordpressにブログカードを付ける簡単プラグイン!

      2016/12/13

WordPressってこんなことができるんだ~!!って、日々感動することの多いkomidoriです。
こんにちは~!

このブログを始めて1年を過ぎ・・・。
分からないなりにつつきながら、少しずついろんなことができるようになってきて、今回はこれ!

リンクをブログカードのように表示させる2種類の方法です。

2016y12m08d_091612781

komidoriは、関連記事のリンクをこんなカード表示にしたかったんですよ~、どうしたらできるん(・_・;?

知ってる人は知っててやっているわけで、なにかやり方があるんだろうな~ってしばらく探してました。

で、いきついたのがこの2つの方法~。

分かっちゃえば、なぁ~んだって思っちゃうぐらいのこともありましたが、超スグレモノのプラグインも~!!

komidoriが見つけたカード表示の方法~、とりあえずまとめときます。

スポンサーリンク

WordPressには枠表示が装備されていた!

それこそ、なぁ~んだぁ・・・と腰砕け状態になってしまったのがこのことですよ。

WordPressには枠表示が装備されているんです。
何てこった щ(゚ロ゚щ) オーマイガーッ!!

で、やり方も超簡単!!

記事作成画面に、そのままURLを貼っちゃえばいいのです。

2016y12m08d_104127972

すると、勝手にこうなるというお手軽さ~、なんですが・・・

ヨガでダイエット成功!6kg痩せた私の体験談を語ります!!


でも・・・ちょっと枠が大きすぎる感じ・・・さらに、PCで見ていると、何故か下部に大きな空白が入っちゃう・・・

使ってるテーマの問題なのか何なのか、調整すれば変えることもできるのかもしれないですが、プログラムとか???の私にはハードルが高い・・・
ショボーン(´・ω・`)

ということで、そこからまた検索に入り、見つけたのがこちらのプラグイン!!

超便利なプラグイン!!『Pz-LinkCard』

いや~、これスゴイ!! щ(゚ロ゚щ) オォーッ!!

このプラグインは、ぽぽづれさんという方が作られたものなんですが、ホントに便利です~。
『WordPressでリンクをカード形式で表示する 『Pz-LinkCard』

内部リンクも外部リンクもきちっと設定できるし、カードの色やデザインもいろいろあるんですよ~。

komidoriは、シンプルなのが好きなのであっさりしたデザインにしてますが・・・いろいろ組み合わせるとかなりな工夫ができます。

例えばですね、標準仕様の場合はこんな感じで色がついたカードができます。

内部リンクの場合が、この茶色ぽい色、外部リンクだと青っぽい色がついて区別できるようになっています。
%e3%81%86%e3%81%86

とか・・・標準タイプ以外では、テープで止めたようなデザインの枠とかね~。

%e3%81%86%e3%81%86%e3%81%86

こんな感じで、背景の色も選べるし・・・
(ちょっとド派手なピンクにしてみました~。)
2016y12m08d_223347247

黒背景用のカードもいろいろあります。
これはオレンジ系の例~
2016y12m08d_092229026

さらに・・・
2016y12m08d_092835627

こんなにいろんな設定ができるって、ぽぽづれさんちょっとすごくないですか?
(私、試してないけど3D もあります。)Σ(゚д゚;) ヌオォ!?

まあ、とにかく自分好みのカードが作れるという事で、ホントいろいろと設定ができるんですよ~!!
ビックリです。

ということで、自分好みにカード作成無限大~って感じですが・・・
とりあえず、komidoriのシンプルな枠で設定の仕方を説明しますね~。

スポンサーリンク

「Pz-LinkCard」を設定してみよう~

プラグインの新規追加で「Pz-LinkCard」を選択して有効化にしましょう。
2016y12m09d_131910973

有効化したら、サイドのツールバーの[設定]から「Pz-LinkCard設定」をクリックして開きます

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-5

シンプルなkomidori版の設定方法

まずは、定型書式の設定です。ここでいろいろな書式の設定ができます。

komidoriはシンプルな色なしの枠にしたかったので[なし]を選んでいます。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-4

さらに、下に下がっていきます。

表示設定の所で、「配置」「リンクの仕方」「枠線の太さ」「外観」を自分が表示させたいように設定していきます。

2016y12m09d_140013524

これで終了~!!

「AddQuicktag」を使ってクイックタグを設定しておくとすぐ使えて便利です~。

2016y12m09d_14141831

あとは、
2016y12m09d_144137912
この〇〇〇〇の部分にリンクさせたい記事のURLを入れるだけ。

こんな感じでブログカードが表示されます。
とっても簡単!!

ほんとうにいろいろと設定ができるので、いろいろ試してお好みのマイカードを作ってみて下さいね。

komidori版は超シンプル設定なので、もっと詳しい設定方法が知りたい方は、こちら!
ぽぽづれさんのサイトに行けます~。

まとめ

リンク記事の表示にブログカードが使えると、ブログの表情が豊かになる感じがしますね~。

文字リンクだけでなくて、画像も表示されるのが嬉しい!

ぽぽづれさんの「Pz-LinkCard」おススメです~!!

スポンサーリンク

 - WordPressとかPCまわりのこと

この記事がお役に立ちましたら「いいね!」をお願いします~(*'v`d)

  関連記事

画像の切り抜きが自由にできるフリーソフト!初心者でも簡単!!

わ~い! 自由な形に輪郭が切り抜けるフリーソフトみつけました~!! これ面白いわ …

windowsスクリーンショットのやり方!範囲指定も簡単~♪

あ~、この画面、画像として残しておきたいんだけどな~って思うことありますよね。 …

パソコンのスクリ-ンショット!このフリーソフトが便利すぎる~!

この前、Windowsのスクリーンショットの仕方をまとめたのですが・・・ さらに …

wordpress のコメントの画像表示にはGravatarが便利!

コメントを投稿した時、ちゃんとイラストや写真などの画像を設定されている方がいるじ …

母の日は手作りカードを!パソコンで簡単にできる温かメッセージ!!

最近、画像編集ソフトの『フォトスケープ』というものを知りその面白さと便利さに感動 …

スマホのブルーライトをカットするアプリおススメは?

夜、遅くにスマホを使ったりしてると眼が冴えて眠れなくなったりしませんか? この目 …

ブルーライトをカットするフリーソフト!効果に感動~♪

パソコンの画面、ずっと見てると目がチカチカ、ショボショボしてきちゃいませんか? …

WordPressのファビコンを作って設定してみた~!

ずっと気になっててやってみたかったこと~ あの、ブラウザのアドレスバーやタブに表 …

iphone の三脚はゴリラポッドがいい!4つのおススメポイントとは!!

わ~い! やっと買いましたぁ~! iphone用のスタンド『ゴリラポッド(Gor …

wordpressのカテゴリー、並び替えと折りたたみが自由にできるプラグイン!

いろいろ分からないなりにも、アチコチつつきながら、やってるこのブログ。 で、やっ …

Comment

  1. ちょこん より:

    komidoriさん、初めまして!

    sango-happy.comというブログを運営しているちょこんと申します。

    ブログカードやカテゴリーのプラグインがわかりやすくて、とても参考になりました!!

    ちょっとお聞きしたいのですが、komidoriさんのブログで使っているアニメと吹き出しは、speech bubbleというプラグインを使っているのですか?

    とっても可愛くて見やすいので、ぜひ教えて頂けないでしょうか!!
    よろしくお願いします^^

    ちょこん

    • komidori より:

      ちょこんさん、こんにちは~!

      ご訪問ありがとうございます。
      記事がお役に立てたようで、良かったです~。(^^♪

      お尋ねの、吹き出し、文中のものはプラグインのspeech bubbleです。
      画像に使っているのは、PhotoScape(フォトスケープ)という、
      無料の画像編集ソフトを使って加工しています。

      PhotoScapeとっても便利ですよ~。
      使い方などはこちらの記事でカードの作り方で説明しています。
      http://komidori-info.com/archives/4127

      よかったら、ご覧になってみて下さい。

      komidori

      • ちょこん より:

        komidoriさん、こんにちは!

        お返事いただきありがとうございます。
        早速ブログカードとspeech bubbleのプラグインを導入したいと思います!!
        また、ブログに足を運んでコメントまで残してくださり本当に嬉しいです(*^^*)
        photoscapeもこちらで勉強させていただきます。

        ちょこん

        • komidori より:

          ちょこんさん、どうも~!

          photoscape、ぜひやってみて下さい。
          ほんとに便利です。^^

          使っているうちに使い方は、直感的に分かってくると思いますが、何か?がありましたら、
          私でわかることであれば、お教えいたします~。

          komidori

  2. みん より:

    komidoriさま

    ありがとうございました!はてなみたいなカードをホームページにつけられればと思っていたので、とても参考にさせていただきました。

    • komidori より:

      みんさま

      ご訪問ありがとうございます。
      記事がお役に立ってよかったです~。^^

Message

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