読者です 読者をやめる 読者になる 読者になる

デュ~クメモ

しょ~もないことから、もしかしたら役に立つことまで、そこはかとなく書いていきます。

電子ブックについて考える

f:id:dukecave:20161124162856j:plain

最近、商品カタログ、観光パンフレットなどは「電子ブック」としてネットで公開されている場合が多い。
いろいろいじってみる。

続きを読む

鶴瓶・上岡パペポTV

鶴瓶・上岡パペポTV

f:id:dukecave:20161124162153j:plain

1987年4月14日~1998年3月31日放送

昔観ていて、上岡龍太郎が時々言うネタが「あるある!納得~」「それ、おもしろい~」という場合が多かった。
適当にメモしてみる。

続きを読む

ブログカードを挿入するショートコード

f:id:dukecave:20161022161350p:plain

(2016.06.09作成~)

はてなブログでURLを貼り付けると、見やすい「カード形式」で表示できる。
WordPressでも最近は実装されているようだが、私のWordPressバージョンは「3.4.1」である…
※以前バージョンアップを試みたが、改造しすぎていたため、表示が変になり元に戻した。

なので、ショートコードをつくってみる。

参考サイト:
[WordPress] ブログカードをプラグインなしで実装する方法 - Unity開発&備忘録
https://archive.is/mLw6V

上記サイトでは「はてなブログを経由してカード表示するブックマークレット」を紹介している。

まあ、はてなブログのサービスが停止したら無効になるが、とりあえずこの方法を試すのが手っ取り早い。

こんな感じのコードが生成される

<p><iframe style="width:100%;height:155px;max-width:500px;margin:0 0 20px 0;display:block;" title="タイトル" src="http://hatenablog.com/embed?url=対象のURL" width="300" height="150" frameborder="0" scrolling="no"></iframe></p>

だが、通常のリンクはいいのだが、対象が「はてなブログのURL」の場合、サムネイル画像が無かったり、不具合が生じる。

対象がはてなブログのURLの場合は

<p><iframe class="embed-card embed-blogcard" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;" title="タイトル" src="はてなブログのURL" frameborder="0" scrolling="no"></iframe></p>

はてなブログのURLの内、「entry」→「embed」にする必要有り。

また、挿入した部分がWordPressビジュアル編集モードでは「真っ黄色」に表示されてしまい、コードの中身がよ~わからん。

なので、ショートコード化してみる。

/* ブログカードを挿入するショートコード */
/* 使い方:[blogcard link=〇〇(必須) title=〇〇(任意)] */
function blogcard_short($atts) {
extract(shortcode_atts(array(
'link' => '',
'title' => '',
), $atts));
if (strstr($link,'hatenablog.com')) { // はてなブログURLの場合
$link = str_replace("entry", "embed", $link); //「entry」→「embed」に置換
$html = '<p><iframe class="embed-card embed-blogcard" style="display: block; width: 100%; height: 190px; ';
$html.= 'max-width: 500px; margin: 10px 0px;" title="'.$title.'" src="';
$html.= $link.'" frameborder="0" scrolling="no"></iframe></p>';
}
else { // はてなブログでない場合
$html = '<p><iframe width="300" height="150" style="width: 100%; height: 155px; max-width: 500px; ';
$html.= 'margin: 0 0 20px 0; display: block;" title="'.$title.'" src="http://hatenablog.com/embed?url=';
$html.= $link.'" scrolling="no" frameborder="0"></iframe></p>';
}
return $html;

}
add_shortcode('blogcard','blogcard_short');

これで
[blogcard link=〇〇]
と記述するだけで、ブログカードを挿入できるようになった。

【おしまい】
親記事:
WordPress設定メモ

FacebookのタイムラインをWordpressの記事中に埋め込む

f:id:dukecave:20161022161350p:plain

1.ページプラグイン - ソーシャルプラグイン
https://developers.facebook.com/docs/plugins/page-plugin
にて「JavaScript」と「HTML」の構文を取得

2.Wordpressの記事にカスタムフィールドとして「JavaScript」を記述

例)
カスタムフィールドの名前:facebook
カスタムフィールドの値:先程取得した「JavaScript」構文

3.各記事を定義している「loop-single.php」の「<?php the_content(); ?>」の後ろに

<!--メタ情報(カスタムフィールド出力)JavaScript用 -->
<?php echo get_post_meta(get_the_ID(), '「カスタムフィールドの名前」', 1); ?>

を挿入

4.記事本文に「HTML」を記述

これで、ようやくWordpressの記事本文中にFacebookのタイムラインが埋め込めた。めんどくさい…

以上

参考記事:
Facebook のソーシャルプラグインを導入しよう | バシャログ。2011.08.17
http://bashalog.c-brains.jp/11/08/17-094659.php
親記事:


WordPress設定4-15 記事中でJavaScriptを使う

「バイオマテックジャパン」がやばすぎる

北海道釧路市にあるコラーゲン製造会社

バイオマテックジャパン

f:id:dukecave:20161011121135j:plain

2006.05~創業

実情がやばすぎるので、ご報告します。

続きを読む