SimplicityユーザーがCeltispackのブログカード機能を使用する際の注意点
前回ご紹介した多機能プラグインパック”Celtispack”。
このプラグインにはブログカード機能が備わっています。
そして、WordPressのテーマSimplicityにもブログカード機能が装備されています。
今回は、Celtispackのブログカード機能とSimplicityのブログカード機能について触れると共に、
Simplicityのブログカードを使用している人が、
Celtispackのブログカード機能を使う場合の注意点等を書いていきます。
Simplicityのブログカード
使用パターンは2種
- はてなカード
- Embedlyカード
Simplicityのブログカード機能を利用するには、「外観」→「カスタマイズ」→「ブログカード」で、
“ブログカード有効”と”外部リンクのブログカード有効”にチェックを入れた後、
外部のカードについて、”はてなカード”か”Embedlyカード”の選択を行います。
はてなカード
はてなカードを使う場合は、読み込みが「はてな」なので(外部リンク・内部トップ頁リンク)
Embedlyと違い、リンクをさせて頂いているのが先様には伝わりません。(リファラが残らない)
もしもこの先「はてな」の方で仕様変更なんかされてしまうと、表示できなくなる事だってあり得ます。
だけど、デザイン的には「はてな」の方がしっくりきませんか?
あまりデカいと、記事の邪魔をされる気がしませんか?
「はてな」のカードはあのさり気ない小さなカードが凄く気に入ってしまっているので、
近々の危機感は無いものの、リスキーな感じがするまま使用しています。
Embedlyカード
Embedlyカードを使うと、SNSボタンが表示されたり、
カードを貼ると先様がWordPressユーザーであれば、ピンバックが飛ぶ。と言う様な利点があります。
Embedlyはデカ過ぎる所が嫌なんです。(CSSでなんとかなるにはなるけど…なんか腑に落ちない)
ソーシャルボタンが付いてますが、カード付属ボタンで「いいねする」って事は無い様に思うんです。
(だって・・・カード先(リンク先)を閲覧後の「いいね」＆「ポチっ」だと思うんです。
少なくとも私は既読後面白かったり、成程な。為になったな。と、
感銘を受けた時、書き手の気持ちが伝わった時に「いいね」＆「ポチっ」しますし。違うのかな??
カードみただけで押さないでしょ??)
詳細設定
その他、細かい設定は以下の6項目其々にチェックを入れると反映されます。
- サムネイルを右側にする
- 新しいタブで開く
- サイトロゴを表示
- はてブ数を表示
- 投稿日を表示
- カード幅を広げる
Celtispackのブログカード機能(oEmbed extend)
前回の記事でご紹介させて頂いた、Celtis プラグインパック内のプラグインoEmbed extend。
oEmbed extendでoEmbed 埋め込み機能の追加とカスタマイズが可能になります。
使用パターンは3種
- WordPress oEmbed形式(WordPress4.4以上で動作)
- Celtispack OPGブログカード形式
- WordPress oEmbed形式(優先)とOPGブログカード形式併用
oEmbed extendの項目で「埋め込みURLからブログカード作成」にチェックを入れて、
上記3種の形式で好みのものを選択します。
WordPress oEmbed
WordPress oEmbed形式は、デカい!です。
なので小さく表示させたい場合は、CSSでカスタマイズをすると良いでしょう。
URL埋め込みの為のアイコン(共有ダイアログ)が付いているのは良い感じですね。
全てのサイトがoEmbed対応じゃないのでURLだけ載せるとリンクされない場合もあります。
詳細はこちらのサイトさん→http://nendeb.com/315が画像を掲載して解り易く閲覧できます。
ここで画像を掲載しようか。と思いましたが、上記サイトさんに甘えます。
上記サイトさんでは、CSSの解説もされていらっしゃるのでご閲覧をおススメします。
Celtispack OPGブログカード
こちらの形式だと「はてなカード」に近しい表示になります。というか、製作者様がそれに近くなる様にCSSを書かれていますので、「はてなカード」を好んでいる方は、この形式がおススメです。
カード幅が600px(だっけ?)なので、「はてな」よりも100px程大きく表示されますが、
その辺りはCSSでカスタマイズ可能ですし、外部リンクもiframe内で表示される「はてな」と違い、
HTML部分もカスタマイズ可能なので、、、沢山遊べます(笑
それから、ビジュアルエディタでブログカードが表示されるんです!!
これは、ビジュアルエディタを使っている人には、便利なのではないでしょうか!!
私はテキストエディタ派ですが、時折ビジュアルエディタで表示確認したりするので、
こんな仕様があると、有難い限りです。利用者に優しい仕様ですね。素晴らしい。
あと、OGPの設定をしていないサイトのリンクをすると、正しく表示されません。
詳細設定
カードの種類の選択だけでなく、oEmbed extendには痒い所に手が届く機能も備わっています。
(以下、設定頁の文言、原文記載)
- WordPress oEmbed 用タグの出力停止（WP4.4以上）
記事を標準ブログカード形式で紹介されたくない場合に指定
（埋め込まれた iframe からのアクセス負荷対策） - 標準で対応していない Ustream, CodePen, SpeakerDeck（WP4.3以下）の oEmbed 埋め込み対応
- Flickr, SpeakerDeck 等の埋め込みにタイトル、著作者のキャプションを表示
- SoundCloud 埋め込みコードカスタマイズ
（embed ショートコード height=180 以下指定時サムネイルタイプ使用） - oEmbed 埋め込み用ウィジェットを追加
- oEmbed 埋め込みデータキャッシュクリアボタンを TineMCEエディタに追加
アクセスの多いサイトをお持ちの方等は、1の機能があると良いのかも。
便利なのは、5と6です。
構築中のサイトの方で設定していますが、特に5は専用ウィジェットに何枚でも放り込めて、便利です。
其々のカード掲載方法～カードの貼り付け方どうしてる??
Simplicityのユーザーの方、ご自身のブログ内でのカードの貼り付け方、どの様にされていますか?
① http://news.yahoo.co.jp/ URLのみ
② <a href=”http://news.yahoo.co.jp/”>http://news.yahoo.co.jp/</a> リンクタグ使用
何れかで表示させていると思うのですが、
わいひらさん推奨は「①より、②の方が良いですよ。」と仰せです。
理由として、
「はてなが仕様変更したら、①だと唯のURLだけになる」＆
「Simplicityのブログカード機能はテーマを変更すると機能しない」という事ですね。
では、Celtispack OPGブログカードの場合は、どうなるか?どうするか??という点ですが、
Celtispack OPGブログカードの場合は、
① http://news.yahoo.co.jp/ URLのみ
URLのみで記載するって事なんですよ・・・。
② <a href=”http://news.yahoo.co.jp/”>http://news.yahoo.co.jp/</a> リンクタグ使用
では、カードが表示されないのです。
という事は～勘の良い方ならもうお分かりだと思うのですが、
①のURLのみを書いている場合は、
Simplicityの機能から、そのままCeltispack OPGブログカード機能に移行てしも問題無し。
でも、②の様にリンクタグを記載してブログカードを表示されている場合は、
全部書き直しが必要って事に。
そこで、移行の際の注意点です。いよいよ、この記事の肝に入ります。
SimplicityユーザーがCeltispackのブログカード機能を使用する際の注意点
サクッと内容に入りたいのてすが、色んなパターンが想定されるので、想定パターンを書きだし、
パターン毎で説明します。(以下以外、他にも色んなパターンがあると思いますけど。)
- URLのみ記載して表示している貴方(貴女)
- リンクタグを使用記載して表示している貴方(貴女)
- 1と2の混合で表示している貴方(貴女)【私はこのパターン・・・】
- テーマを変更する可能性のある貴方(貴女)
- Celtispackプラグインを削除する可能性のある貴方(貴女)
URLのみ記載して表示している貴方(貴女)
統一されているんですね～。素晴らしい。問題なく移行出来ますね。
例えばこの先で、テーマを変えてもプラグインで表示してくれますし、
プラグインを抜いてもテーマの方で対応出来ますし!
でも、ちょっと待って下さい。
記事の編集や更新の時、ビジュアルエディタとテキストエディタに切り替えなんてしていませんか?
ご周知かも知れませんが、その場合自動挿入される<p>タグ。入ったままでは無いですか?
URLのみ記載した場合で<p>タグが自動挿入されている場合、
<p>http://news.yahoo.co.jp/</p>
Simplicityでは問題無く表示されますが、Celtispack OPGブログカード機能は動作しません。
リンクの無いURLのみの表示になりますのでタグを除去する作業を行ってから切り替えましょう。
リンクタグを使用記載して表示している貴方(貴女)
全てのカード表示でリンクタグを記載してしまっている場合は、全てURLのみにするしか無いのですが、
その作業・・・記事が多ければ多い程、大変な作業になりますよね。
(根性で全部編集する!って場合は、「頑張って下さい」としか言いようが有りませんケド)
それを回避するには、
“既存のカード表示は諦める”(URLのリンクが表示される状態)という選択も有りだと思います。
若しくは、
Simplicityのカード機能と、Celtispack ブログカード機能の共存。という事になるかと思います。
この場合、”既存のカード表示”を「はてな」にしていた場合は、
「Celtispack OPGブログカード」にした方が近しい表示が出来ますので(CSSで細かく設定するとか)
後は新規で記事を書く時にURLのみで書く様、留意しましょう。
(癖になっている事を止めるのは結構大変だと思いますが、、、)
選択肢が3つになりますが、ご自身に無理のない様。。。
1と2の混合で表示している貴方(貴女)
はい。私はこのパターンでした。自サイト、つまり内部リンクについては殆どURLのみで、
外部リンクをタグを使ってカード表示させていました。・・・大変でした。どっちにも転べない(笑;
詳しくを云うと、
このサイトでは、Celtispack ブログカード機能を使うつもりが無く、
Celtispackプラグインの他の機能が必要でインストールしたのです。
すると。。。何故だか。。。デフォルトで
「oEmbed 埋め込み機能の追加とカスタマイズ」にチェックが入っていたんです。
インストールした際のバージョンを忘れてしまったのですが、(確か…1.8.0辺り)
現在のバージョン1.9.0では、何処にもチェックが入ってないので、ご安心を。
勿論、使うつもりが無いものなので、直ぐにチェックを外したのですが、後の祭り～!!
チェックを外しても機能が依存していて、URLのみのカードが変テコ表示になってしまいました。
その時は、プラグイン削除したくない理由があったので、書き直す事に・・・。
【変テコ表示の頁残してます。記念に(笑) 頁最下部までスクロールすると現れます。暫くしたら直しているかも。】
現在は、バージョン1.9.0にインストールし直しましたが、それでも残るっていぅ。
この記事を書くきっかけになった最大の理由です。
<p>タグが入っていたものは、Simplicityのカード機能がフォローしてくれてましたが、
<p>タグ無しのURLは、Simplicityのカード機能に戻ってくれないっていう。。。ぅぉーっ。
Simplicityのカード機能と、Celtispack ブログカード機能の共存も考えましたが、
何せカード自体が変テコなので、、、
(未だ、、、気が付いた時や、時間を作っては過去の記事に遡りリンクタグを付けています。)
変テコ理由の1つとして、
Celtispack OPGブログカードは、タイトルに<h5>タグが使われているという事。
<h5>タグなんて使ってない人が殆どでしょうけど、私のサイトでは<h5>見出しも使う事がありまして。
カスタマイズしてるので、それが表示されてしまぅぅぅ～。
長くなっていますが、私の様に「1と2の混合で表示している」方は、
先ずは、Celtispack OPGブログカードを使用するかどうかをよーく考えてからチェックを入れて下さい。
「どんな表示になるか。ちよっと観てみよう」では後悔するかも。
記事件数が多い方は特に注意して下さい!
チェックを入れてしまうと、元に戻せませんから、最悪、プラグインの削除とデーターベースの掃除です。
(バージョンアップで、変更されるかも知れませんが、、、)
「その日に備えて。」という事ではないのですが、私の場合は「良い機会だ」と開き直って
リンクURLのみにしていたのをリンクタグに書き直しています。
「プラグイン削除して掃除してしまったら
“URLのみ”をどの頁に書き残してるか?分からんだろー」位の気持ちで。
テーマ変更するつもりは全くないけど、
カードについてはもし、シフトチェンジしてもURLリンクが残るってケースをチョイスデス。
テーマを変更する可能性のある貴方(貴女)
若しかすると良い方法かも知れませんよね?
でも、ほんとーーに、良いのですか? Simplicityイカシタ小粋な奴でっせぇ～。(失敬!!)
他のテーマに変えても、表示しない場合があるみたいですよ?
そういう場合に参考にすると良いと思う記事を貼っておきます。
実際、某テーマでは、使えんかったばい。(敢えて書いていません)
Celtispackは、
セルティスラボ製テーマに最適化されたプラグインパックで高速化や画像関連等の機能が満載です。公式テーマでもほとんどの機能は使えますので、Jetpackプラグインと合わせて使用して下さい (^^)
とされていますので、一度こちらのテーマ”Celtis_s”を試されてみても良いかも知れません。
WordPressテーマ : Celtis_s (結構な機能満載な感じでっせーぇ。ぁ、また・・・。)
私も一度別のサイトに入れてお試し体験してみたいと思います。
テーマ変更をその内。と思っている場合は ”① http://news.yahoo.co.jp/ URLのみ” を推奨です。
Celtispackプラグインを削除する可能性のある貴方(貴女)
機能にチェックを入れ一時期でも使用してしまった場合は、プラグインごと削除しても、
「こんな風に残ります」【頁最下部までスクロールすると現れます。暫くしたら直しているかも。】
その為、削除の前に全てのURLにリンクタグを付けてから削除するか、こちらで書いていた以下の項目、
「Celtispackプラグイン削除時にオプションデータはクリアせずに残しておく（再インストール用）」
のチェックを外し、一度保存してから「停止」→「削除」してみて下さい。
デモサイトの方ではこれでOKでしたが、このサイトでは残りました(謎;
詳しく探求しませんでしたが、環境によって異なるみたいですので、このサイトみたく名残がある場合は、
データーベースの掃除を試みて下さい。
(名残があるとテーブルが残っている筈なんでテーブルだけ削除すればOKです。
尚、データーベースの操作等々は詳しく書かれているサイトが沢山あるので、検索してみて下さい)
Maybe・・・
もしかすると、、、です。
こうした書きこみも。
思案されているかも知れない・・・現状も知っておきましょう。
しかし、要望を出したりするのはNGだと思います。
何故なら、以前にも「代案」として提案されている方がいます。
閲覧頂ければお判りだと思いますが、
「ブログカード」機能というのは、実装するのは相当難しいものだと思います。
(氏のコトです。可能ならば、多分に対応されていると思います。)
まとめ
これまではEmbedlyカードとはてなカードの二択で、
機能(Embedly)よりデザイン重視で「はてな」の方にチェックを入れて使っていましたし、
「はてな」カードの方のカスタマイズ記事なんてのも書きました。
Simplicity標準装備のブログカードをお洒落にカスタマイズ～デザイン6種【テンプレートｰ１】
Simplicity標準装備のブログカードをお洒落にカスタマイズ～デザイン7種【テンプレートｰ2】
そう―。 このサイトでは今の所Simplicityの「はてなカード」機能に頼っていますが、
http://hayashikejinan.com/webwork/bookmarklet/1249/ ←こちらの方や他にも沢山の方が、
「はてなブログカードの問題」として早くから何かしらの対応策を考えていらっしゃいます。
勿論、「はてなカード」が使えなくなる。なんて事は断言出来ませんし、
はてな内では好評の様子ですので、直ぐに仕様変更がある。という事は無いとは思いますが、
選択肢の一つとして、Celtispackのブログカード機能を利用するという事も有りだと思います。
そして、もしもCeltispackのブログカード機能を利用する場合、
Simplicityのユーザーの方は、ご自身のカードの貼り付け方について注意してみて下さい。
コメント