Author's Posts

wordpress logo
WordPressでよくある「続きを読む」を実装する方法です。

WordPressは本当によく出来ていて、普通なら少し面倒な「続きを読む」もすぐに実装出来てしまいます。

「続きを読む」を設置したい場所に以下のコードを加えるだけです。

<!--more-->

このコードを加えるだけで出来ています。
ぜひお試しください!
参考URL:WordPress Codex日本語版 – 「続きを読む」のカスタマイズ

+アルファでカスタマイズ!

<!--more-->を挿入しただけだと、「続きを読む」をクリック後、記事トップに移動せずに文章の途中からになってしまいます。
またURLにも「#more」が追加されてしまいます。

これを解決するためには、「function.php」に以下のコードを加えます。

function remove_more_jump_link($link) {
   $offset = strpos($link, '#more-');
   if ($offset) {
      $end = strpos($link, '"',$offset);
   }
   if ($end) {
      $link = substr_replace($link, '', $offset, $end-$offset);
   }
   return $link;
}
add_filter('the_content_more_link', 'remove_more_jump_link');

これを追加すれば、URLも変更されないですし、ページもトップから表示されるようになります。
ぜひお試しあれ。
参考URL:WordPress:「続きを読む」でページの先頭から読めるようにする方法

何かわからないことがあれば、以下のコメント欄、またはリプライ(@DAI199)へお願いします。

Read more

facebook logo

毎週Facebookの変更点やニュース、コラムをまとめて配信します。
今週は15個の記事を紹介!
記事は上から時系列順になっています。今週のFacebookを振り返ってみましょう!

Facebook変更点・ニュース 5件

オンライン銀行市場を狙う?フェイスブック
銀行システムをFacebook上に作っているようです。

Facebook、SNSブックマークアプリのSpoolを買収
買収によるFacebookの強化は毎日のように行われていますね。

Facebook、初の検索タイプアヘッド広告「Sponsored Results」をテスト中。
広告・検索の強化はFacebookのこれからを左右するものになりそうです。

Facebook、Pinterestにそっくりな新しいストーリー表示をテスト中か
今日のブログでも取り上げた、【速報】FacebookのOGPの表示方法が変更?のニュースです。ぜひ確認を。

Facebook、Acrylic Softwareを買収–目的は人材の獲得
これも人材強化目的。

Facebook コラムまとめ 11件

ホントに思ってる? なんにでも「いいね!」を押す無思考型人間ってなんだ【SNS痛い人】
Facebookのいいねを押す意味が「読んだよ!」とか様々な意味に変わってるだけですよね。

フェイスブックのタイムライン化で終わった800億円産業:The Facebook tweak that killed a billion-dollar industry @Fortune
Facebookページのタブ、タイムライン後押されなくなったよねっていう記事。

東京都Facebook率54%の謎と本当の登録者数を推測してみた
Facebook利用率東京都高すぎじゃない?っていう疑問を解消してくれる記事。

Facebook アプリ開発で注意しておくべきこと アプリ開発者は参考にすべき記事。

ぜんぶ知ってますか?Facebookページで制限されている機能を1分でチェック!
Facebookページである条件を満たさないと使えない機能まとめ。

Facebookのフレンドの交際ステータスを一覧で把握できるサービス「RelationBook」
交際ステータスが一目でわかるサービス。

ソーシャルメディアの米国顧客満足度、「Google+」が首位、「Facebook」は低下
広告が表示されない点が満足度が高いそう。

Facebookが入試に使われる時代――「デジタルポートフォリオ」 ペーパーテストがなくなるとき、何が評価されるのか?
Facebookの個人情報ポートフォーリオが、人を評価するのに役立つという記事。

【保存版】Facebook利用規約からわかる企業が気をつけるべき10のポイント
企業様必見の記事。利用規約は常にチェックしないといけないですね。

Facebook検索のストレスを軽減する、10の検索テクニック【ガイアックス】
検索機能が弱いFacebookを補完するツールまとめ記事。

【保存版】Facebookページ インサイト 徹底活用!~実践編 押さえておきたい5つの検証ポイント~ 少しわかりづらいFacebookインサイトまとめ。

これで今週のFacebookも完璧ですね。次週もよろしくお願いします。
何かご意見・ご要望がございましたらコメント欄やリプライ(<a href="https://twitter.com/DAI199” target=_”blank” rel=”noopener noreferrer”>@DAI199)までお願いします。

Read more

Facebookを見ていて、表示部分が変わっていたので、更新します。

今Facebookを見ていると、今までPinterestなどで誰かがいいねを押したときの表示部分が変更されていました。



今までの表示方法の画像が見当たらないので比較出来ないのですが、間違いなく見やすく、いいねやコメントがしやすくなっています。

Facebookの今後の方針として、OGP部分は強化していくとおもわれるので、その一環のテスト最中なのかもしれませんね。
また何か見つけましたら速報としてお知らせします。

情報をお持ちの方がいましたらシェアしていただけると助かります。

7/22 18:37 追記
4つだとこのように表示されるようです。画像が見やすいですね。

7/22 18:50 追記
cnetにニュースがありました。7月20日には判明していた変更点だったらしいです。

Facebook、Pinterestにそっくりな新しいストーリー表示をテスト中か http://japan.cnet.com/news/service/35019435/

Read more

wordpress logo

Wordpressを導入する理由として、使いやすいプラグインが多くあることがあげられます。
今回は、Wordpressを導入したあとすぐに導入すべきプラグインをまとめました。
今後Wordpressを用いたブログを立ち上げようとしている人は参考にしてみてください。

今回紹介するプラグインは大まかにわけて以下のようになります。

◯ アクセスを増やすためのプラグイン 5選
◯ 表示を早くするプラグイン
◯ Facebookコメントを導入するプラグイン
◯ 自動でブログのバックアップを取ってくれるプラグイン
◯ コードを書くのであれば導入しておきたいプラグイン

それでは1つずつ紹介します。

アクセスを増やすためのプラグイン5選

All in One SEO Pack

これはブログ記事1つ1つに対して

MetaTitle:ブログタイトル
MetaKeyWord: SEOキーワード
MetaDescription:検索エンジンに表示される抜粋記事

を設定出来るようにするプラグインです。

All in One SEO Packを導入すると、投稿の一番下に次のような画面が表示されるようになります。

All in One SEO Packの使い方を紹介したブログはたくさんあるが下記URLを参考にしてください。

http://wp-exp.com/blog/how-to-use-all-in-one-seo-pack/ All in One SEO Pack の使い方

Google XML Sitemaps

Googleがあなたのブログに来たときに、サイトマップがあると効率良くブログ内をまわってくれる。
このサイトマップがあれば自動で効率的にGoogle上にブログ情報をまとめることが出来る。

さらにこのプラグインのすごいところは記事を更新したときに自動でGoogleなどの主要検索エンジンに更新情報を通知してくれることです。

この機能により、更新した記事はすぐにGoogleにインデックス化され、検索でひっかかるようになります。
検索エンジンからの流入は貴重なのでぜひ入れておくべきプラグインの1つです。

Open Graph Pro

ブログ×ソーシャル の力はブログのアクセスを増やしたりファンを増やしたりするときにとても有効です。
この Open Graph Pro はいいねを押したときにニュースフィードに出る以下のような文言や画像を設定出来るプラグインです。

この設定をOGP設定というのですが、これについては下記URLがとても参考になります。

http://www.lastday.jp/2012/04/17/ogp-wordpress WordPressのOGP設定は「Open Graph Pro」がベスト

WP Social Bookmarking Light

ブログを運営する上で、ソーシャルボタンは外すことは出来ません。
このプラグインを使えば、ツイートボタンやいいねボタン、シェアボタンなどが簡単に作成出来ます。
ソーシャルボタン

またこのプラグインのいいところは作者さんが日本人のため、はてなブックマークに対応していることです。
下記URLを参考にすると、記事の上下にソーシャルボタンを設置するためのカスタマイズ方法がのっているので参考にするとよいです。

最強のSNSボタンプラグインを更に便利にカスタマイズ[WordPress]

Head Cleaner

Wordpressにたくさんのプラグインを導入するとどうしてもhtmlのhead部分が重くなってしまう。
このままだと検索ボットに嫌われる可能性があるので、それを解決してくれるのがこのプラグインです。

いれるだけでhead部分を軽くしてくれるので検索エンジンにも好まれるブログにすることが出来ます。

下記URLを参考にしてみてください。
http://the-fool.me/wordpress/plugins/head-cleaner.html Head Cleaner – サイトのヘッダとフッタを整形し最適化&高速化を行うプラグイン

表示を早くするプラグイン

DB Cache Reloaded Fix

ブログをキャッシュ化してくれるプラグインとしては、WP Super Cashe が有名だが、これは他のプラグインと競合してしまい、動かないというバグを抱えていることが多く、なかなか使いづらい。

そんな中で他のプラグインと強豪しない、ブログをキャッシュ化してくれるプラグインとして、DB Cashe Reloaded Fix をおすすめします。
これを導入すればブログの表示速度が1.5倍近くになるのでぜひ導入しましょう。

下記URLを参考にしてみてください。
http://word-express.net/db-cache 表示時間を半分に短縮 WordPress高速化プラグイン『DB Cache Reloaded Fix』

Facebookコメントを導入するプラグイン

Facebook Comments

以前このブログでも「WordPressにFacebookコメントを導入する方法」というタイトルで投稿したプラグインです。

このブログの一番下にFacebookのコメント欄があると思うがそれを導入するためのプラグインです。
参考URLとして、先ほどの私のブログを参考にしてみてください。

https://tagamidaiki.com/wordpress-facebook-comment/ WordPressにFacebookコメントを導入する方法

自動でブログのバックアップを取ってくれるプラグイン

WP-DBManager

Wordpressに記事を書きためると、バックアップの重要性に気づいてくる。
ただWordpressのバックアップは面倒です。
それに対処出来るプラグインが、このWP-DBManagerです。

これを使うと定期的にバックアップを取ってくれるのと、データベースの最適化を自動で行なってくれるので安心です。
バックアップ作業などは、備えあれば憂いなしなので一刻も早く導入しよう。

下記URLを参考にしてください。

http://www.ttcbn.net/no_second_life/archives/8281 WordPressのバックアップと最適化! WP-DBManagerが最高すぎる件!!

コードを書くのであれば導入しておきたいプラグイン

WP SyntaxHighlighter

コードを書くと、色分けをしてほしかったりコード番号を振ってほしかったりします。
それを行なってくれるプラグインが WP SyntaxHighlighter です。
Wordpressで構築されているブログで書かれているコードは、ほとんどハイライト表示されていると思うので導入しておきましょう。

下記URLを参考にしてください。

http://www.near-mint.com/blog/software/wp-syntaxhighlighter WP SyntaxHighlighter

最後にここで紹介したプラグインをまとめておくので参考にしてください。

  1. All in One SEO Pack
  2. Google XML Sitemaps
  3. Open Graph Pro
  4. WP Social Bookmarking Light
  5. Head Cleaner
  6. DB Cache Reloaded Fix
  7. Facebook Comments
  8. WP-DBManager
  9. WP SyntaxHighlighter

これは僕が管理しているWordPress全てに導入しているプラグインです。
あなたのWordPressにも導入すればよい効果が生まれる可能性があるのでぜひ検討してみてください。

何かあれば下のコメント欄、またはTwitterへお願いします。

Read more

Facebook Pages Manager

先日、ついにFacebook Pages ManagerというiPhoneアプリが日本語化されました。

Facebook、iOS向け「Facebook Pages Manager」を刷新–日本語もサポート開始
http://japan.cnet.com/news/business/35019381/

このアプリは、iPhoneからFacebookページを管理することが出来る、というものです。

基本的な機能としては

  • Facebookページのウォールが見れる
  • コメントなどに返信が出来る
  • Facebookページに届いたメッセージに返信が出来る
  • 簡単なインサイトが見れる
  • 管理人になっているFacebookページが全て管理出来る

管理に必要な機能がひと通り揃っています。
出先でコメントやメッセージに返信する場合にとても役に立つと思います。

ただインサイトは簡易的なものであり、「いいね数」「話題数」「リーチ数」のみしか見ることが出来ないため、がっつりFacebookページを管理したい人にとっては物足りないかもしれません。

モバイルでFacebookページを見ることが少ない現状が、間違いなく今後改善されていくと思うので、そうなったときのためにも早めに情報をキャッチし、適応していくようにしましょう。

Read more

テック系ならフォローすべきTwitterアカウントをまとめました。
ぜひぜひフォローしてみてください。有益な情報があなたのタイムラインに続々と届きますよ!
もし参考になりましたら「いいね」や「ツイート」をお願いします!!

フォローすべきTwitterアカウント10選


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

面白い情報をたくさん流してくれています。僕の情報源の5割くらいは田端さんにお世話になっていますw


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

言わずもがなのTechchrunchです。英語版のTwitterアカウント(@Techchrunch) をフォローしてもよいですが、有益な情報はすぐ日本語訳されるので日本語版をフォローしておけば大体大丈夫です。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

プロブロガーのイケダハヤトさんです。Tech系以外にも様々な情報を流していただけるのでとてもおもしろいです。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

プログラミング言語”Ruby”を作ったまつもとゆきひろさんです。英語記事のプログラミングに関する記事が主ですがとてもためになります。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

面白法人カヤックが運営しているHTML5,CSS3,JavaScriptのコードを共有するサイト 「js do it」の中で話題になっているものをつぶやいてくれます。Twitterを見ていると自然とコードに触れられる機会が作れるので初心者の方にもおすすめです。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

プログラミング言語Perlの本である、いわゆる「ラクダ本」「リャマ本」の作者さんです。 プログラミングについて様々な有益な情報を流しているためとてもためになります。Perl使いじゃない人にもおすすめです。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

興味深い記事を多く生んでいるのが「wired」です。IT系だけではなくサイエンス系の記事も多くあるため、知的好奇心をくすぐるものが多いです。 僕も大ファンでいつも読んでいます。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

毎朝8時に佐々木さんが読んだ記事の中でよかったものをまとめてツイートしています。僕の主な情報源の1つです。本当に感謝です。 Webで話題になったことを知りたいのであれば佐々木さんをフォローして朝8時のツイートに目を通せばほとんどわかります。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

日本のWeb業界でははてぶの影響力は偉大です。50ブックマークついた記事のみをツイートしてくれるのでこれを読めばIT系の話題はばっちりです。


!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=”//platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);

名前の通りFacebookのマニアックな情報をひたすらツイートしているアカウントです。 Facebookにめちゃくちゃ詳しくなりたい人はフォローするとよいです。ちなみにツイートは全て英語です。

いかがでしたでしょうか。 ここにのせているアカウントは全て僕が実際によく情報源として利用させていただいているアカウントばかりです。 これだけフォローして記事に目を通せばほとんどの情報をキャッチ出来ます。

あなたのいつも参考にしているTwitterアカウントを教えてください。コメントお待ちしてます!!

Read more

WordpressにFacebookコメントを導入したのでその方法をまとめました。

WordpressにFacebookコメントを導入する「Facebook Comments」というプラグインで導入しました。

Facebook comments http://3doordigital.com/wordpress/plugins/facebook-comments/

導入方法はとても簡単です。

  1. Wordpressの管理画面からプラグインをインストール(似ているプラグインが多いので注意!)
  2. Facebook Developerからアプリを作成し、App IDを入力する
  3. Wordpress、「Facebook comments」の管理画面にApp IDを入力し、保存する
  4. Facebookコメントを置きたい場所にコードを記入する

それでは実際に登録してみましょう。

Wordpressの管理画面からプラグインをインストール(似ているプラグインが多いので注意!)


「Facebook comments」と検索すると多くのプラグインが出てくるのですが、画像のプラグインをインストールしてください。
※画像の上のほうに同じプラグイン名のものがありますがそれではないので注意してください。

Facebook Developerからアプリを作成し、App IDを入力する

Facebook Developersにアクセスし、アプリを作成します。

Facebook Developer https://developers.facebook.com/

Facebook Developersにアクセスし、画像の赤で囲っている部分をクリックしましょう。
アプリの作り方は下記URLを参考にしてください。

Facebookモバイルアプリの開発方法 – CodeZine
http://codezine.jp/article/detail/6643

アプリを作成することが出来ましたか?App IDが手に入れば準備OKです。

Wordpress、「Facebook comments」の管理画面にApp IDを入力し、保存する

さきほど作成したアプリのApp IDをWordpressのプラグイン「Facebook Comments」の管理画面に入力します。
設定→Faecbook Comments にあるのでアクセスしましょう。


画像の部分にさきほど作成したアプリのApp IDを入力してください。

また「show comment box in posts」にチェックが入っているか確認してください。
最後に保存しましょう。

Facebookコメントを置きたい場所にコードを記入する

最後に自分がFacebookコメントを置きたい場所に下記のコードを挿入しましょう。

&lt;?php comments_template(); ?&gt;

僕の場合、single.phpのフッター挿入前にこのコードを書きました。
ここが少しハードルが高いかもしれません。

以上でFacebookコメントが挿入出来ます!
下のFacebookコメントは上記のやり方で導入したものです。

何かわからないことがあれば下記コメント欄、またはTwitter(@DAI199)でリプライをとばしていただければ コメントします!

Read more

乱数表

これが乱数表ってやつ

単純に乱数を生成したい場合は rand()関数を使いましょう。

rand() マニュアル
http://jp2.php.net/manual/ja/function.rand.php

ただこの場合、0〜10の乱数が2個必要!とかいうときに結構な確率で数字がかぶってしまいます。
なので次のようにしましょう。

    1. range($min, $max)関数で $minから$maxまでの整数値を得る
range()関数 http://jp2.php.net/manual/ja/function.range.php
    1. shuffle()関数で値をシャッフル
shuffle()関数
http://jp2.php.net/manual/ja/function.shuffle.php

コードで書くとこうなります。

shuffle($random); 
// 配列をランダムに並び替える 
// $randomには $random[0]から$random[10]までにランダムな数値が入っています。 
// $random[0]から必要な分だけ取得すればOK 
foreach($random as $rand){
  echo $rand;
}

何か質問等ございましたらコメント欄にどうぞ!!

Read more

zen coding logo あなたはコーダーですか?
Webエンジニアですか?Webデザイナーですか?
あなたはzen codingを知っていますか?

もし知らないのであれば時間をいくらか無駄にしている可能性があります。
いますぐzen codingを導入してコーディングスピードをあげ、今まで使っていた無駄な時間を有意義な時間にしましょう!!
以下の動画を見て素晴らしさを体感してみてください。


例えば以下のようなコードを書きたいというとき

&lt;ul id="zencoding"&gt;
   &lt;li&gt;&lt;/li&gt;
   &lt;li&gt;&lt;/li&gt;
   &lt;li&gt;&lt;/li&gt;
   &lt;li&gt;&lt;/li&gt;
   &lt;li&gt;&lt;/li&gt;
&lt;/ul&gt;

zen codingを使えば以下のコードを展開するだけで書くことが出来ます

ul#zencoding>li*5

あなたが以下のエディタを使っているならzen codingを導入することが出来ます。

もしあなたがzen codingに対応しているエディタを使っていないのであれば乗り換えを検討したほうがいいかもしれません。
圧倒的なコーディングスピードをあなたにもたらすからです。

それではそれぞれのエディターへの導入方法をまとめておきます。
圧倒的なコーディングスピードをぜひ!!

Dreamweaver

zen codingは超便利!Dreamweaverで使ってみました

秀丸

秀丸マクロでZen-Coding

Vim

ZenCoding for Vim 導入方法(初心者さん向け)

WordPress

WordPressの管理画面上でZen-Codingが使用できるプラグインWP Zen-Coding

Movable Type

MT Zen-Coding – Movable Type プラグイン

EmEditor

Zen Coding の使い方

Emacs

zencoding + emacs

Coda

CodaにZen-Coding入れてみたらちょっと感動した。

Textmate

TextMate+Zen-Codingで超速コーディング?

Eclipse

eclipse + zen-coding プラグイン3.6Helios動作確認済み「eclipse-zencoding」

Aptana Studio

Aptana Studio で Zen Coding を使おう!

それではよいコーディングライフを!!
何かわからないことがあればコメントやリプライ(Twitter: @DAI199)でどうぞ!!

追記(2012/09/12)

Aptanaにzencodingを入れる記事より簡単な記事を発見したので更新しました。
これでぱっと導入することが出来るはずです。

Read more

シンプルに切り出す方法、中途半端なところから切り出す、一番後ろから切り出す、など

最近文字列を切り出す作業をすることが多いので、自分のメモ用に残しておきます。
文字列を切り出すためには、PHPに標準で実装されているsubstr関数を使用します。

substr – PHPマニュアル

以下に使用例を示します。

&lt;?php
$rest = substr("abcdef", 0, 2); // "ab"を返す 
$rest = substr("abcdef", -1); // "f" を返す
$rest = substr("abcdef", -2); // "ef" を返す
$rest = substr("abcdef", -3, 1); // "d" を返す 
?&gt;

文字列の1文字目は0から始まることに注意しましょう。

気をつけるべきところは最後の例のマイナスを第2引数に指定した場合です。
第3引数に指定するものは、第2引数に指定した位置から、何文字を切り出すかを指定する点です。

Read more