Kachibito.net is a website to writing tutorials and code snippets for Web Developers, the main subjects are WordPress, javascript, CSS, OSS, tools and resources. Links About/Privacy Policy Contact X(Twitter) Facebook
地名と緯度経度を指定すると、 ストリートビューを表示出来る WordPressのプラグインのご 紹介。ストリートビューには コメントも加える事が出来る 様になっています。 用途は多くは無いかもしれませんけど・・変わった機能なのでシェア。 カスタム投稿タイプを使ってストリートビューを表示させるWPプラグイン。 地名をタイトルに、オプションで緯度と経度を入力して記事として更新します。複数書くと、スライド式にストリートビューを見る事が出来ます。 緯度と経度を入力するとこのようにSVが表示されます。SVにはコメントを残せます。 なかなか面白いです。プラグインは以下でダウンロードできます。 Street View Comments
はてなボタン、Google+ボタン、Tweetボタン、いいね!ボタン、Addthisボタンを設置します アクセスアップの魔法のボタン。ブログ製作者の強い味方。ソーシャルメディアボタン。 自分のブログを友人や知人に紹介してくれる、そんなチャンスを逃す手はありません。手軽にポチっと押してもらえるように、最適な場所に配置しましょう。 WordPressには各ソーシャルメディア用のプラグインが用意されていますが、微調整が効きません。 自分でテンプレートファイルに追加することで、高速表示や、バグへの対応ができます。 そこで今回はソーシャルメデア用のボタンを、WordPressのテンプレートに追加する方法を解説します。 今回すること 各投稿ページ(singleページ)に「はてなボタン」「Google+ボタン」「Tweetボタン」「Facebookのいいね!ボタン」の4つを設置します。 他に300ものソ
WordPress3.4から搭載されたライブ プレビュー機能に、CSSを直書きする 項目を追加できるWordPressのプラグ イン・Live CSS Previewをご紹介し ます。こういう事も出来るんですね。 WordPress3.4のライブプレビュー機能(テーマカスタマイザー?)は、テーマのプレビューを見ながらタイトルを変更したり、ヘッダ画像を変更できる機能ですが、この項目にCSSの項目を加えるプラグインがLive CSS Previewです。尚、ライブプレビュー機能の細かいは偉い先生方がしてくださるでしょうから一般人の僕は出しゃばらない様にしときますね。 こんな感じでCSS項目が追加されています。あとはいつも通り書けば即座に右のプレビューに反映されます。で、保存すればカスタマイズ完了、みたいな流れです。それだけのシンプルなプラグインですけど、便利っちゃ便利ですね。 JavaScri
「WordPress Advent Calendar 2011」も半分を折り返してしまいました。 ということは、今年は残り半月も無いわけですね、恐ろしいですね; どうも、@anticyborg さんからバトンをうけました @kamiyam です。 WordPressについて WordPressはその多機能さもさることながら、やはり大きな特徴は非常に活発なコミュニティーの存在ではないでしょうか。 また、最近では Twitter、FacebookなどのSNSを始めとしたソーシャルグラフが非常に有用で、そのつながりから沢山の情報を得ることが多くなってきました。 そこで OGPを正しく設定して情報を有効に伝えましょう。というのが今回のお話です。 Open Graph Protocol OGP ( Open Graph Protocol )は 指定したURLコンテンツの内容をあらわす情報とその仕組み
前回のソーシャルボタンを追加しようと思ったときに 当然その方法を探すために、ググっていろいろなサイトを見たわけですが、 その中に「いいね!ボタンを付けるなら、OGP対策をしないと意味ないよ」的な情報を見ました。 OGPって何? The Open Graph protocol フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か – IT戦記 つまり、いいね!やシェアしたときに、いい感じにしてくれるらしい。(よく分かってない) まずは、OGP対策前に試しにいいね!ボタンをクリックしてみました。 Facebookのウォールには以下のように表示されました。(1ヶ月くらい前の画像で申し訳ない) アイキャッチ画像が何故か「はてブ」のアイコンになってるし、 記事の概要ではなく、サイトの説明(WordPressでいうところのキャッチフレーズ)だし、
INSPIRE TECH > その他 > WordPressで簡単にOGPタグを実装できるWP-OGPプラグインを設定画面付きに改造してみた。 WordPressで非常に簡単にOGPが実装できることで有名な、WP-OGPプラグインというものがあります。 WordPress › WP-OGP « WordPress Plugins 自分もFacebookのいいね!ボタンを導入したときに試してみたんですが、ブログ名やブログの記事タイトルはもちろん、ブログ記事にアイキャッチ画像を指定すれば、そのアイキャッチ画像をブログ記事のサムネイルとしてOGPタグを生成してくれたりと、非常に便利です。 ただ、アイキャッチ画像が存在しない場合に利用される、デフォルトのサムネイル画像が変更できなかったり(変更するにはプラグインに含まれるファイルを差し替える必要がある)、Facebook用のOGPタグであるfb:a
脚注リンクをショートコードで 加える事が出来るWordPressの プラグイン・Simple Footnotes のご紹介。ユーザビリティの 工場にもなりそうですね。専門 的な内容を扱うサイトでは導入 したいところです。 GW中なので軽めの話題。文中にショートコードで脚注を加えるプラグインです。複数加えても自動で順番どおり番号を振ってくれます。 こういうやつです。Wikipediaなんかでよく見かけますよね。 プラグインを有効化して以下のように書けばOK。 今日はカレー[ref]レトルトですけどね[/ref]を食べようと思います。 [ref]で囲うと、その部分は数字とリンクが追加され、文章最下部に脚注が加わります。 プラグインのファイルを開けると分かりますが、複雑なコードで実装してるわけじゃ無さそうなので、functions.phpで管理してもいいかもですね。 Simple Footnot
WordPress3.1から管理バーが少し変わ ったのですが、デフォルトではあまり コンテンツが無く、ちょっと勿体無い のでここに好きなリンク集を作って あげると喜ばれるかもしれない、って いう記事です。 管理画面の利便性を高めてあげるとクライアントさんも使いたくなるし、それでWebサイトも育ててくれて結果的に収益アップしてくれたら嬉しいなウヘヘ、という夢をみつつ、今日もチマチマとカスタマイズに励んでみます。 試しにソーシャルサイトのリンク集を含めてみる ↑ 特に目新しい事では無いんですが、こういう風にしてあげようじゃないか、という内容です。jsfiddleってソーシャルだっけ?って疑問はさておき。 こんな事言うと記事タイトルが破綻してしまいますが、別にソーシャルじゃなくてもいいと思います。管理画面でよく使う場所をまとめるとかもいいですね。 コード コードです。functions.phpに
最近サイトマップを導入したのですが、そのプラグインが「どの記事IDでサイトマップを出力すればよいのか設定してくれよ~」ということ要求してきました。あと、まだまだ勉強中の身ではありますが、カスタムフィールドを編集したり、特定の記事だけ集めてリスト化したい場合には、その投稿記事のIDを簡単に知りたいですよね。 そんな場合、function.php(もしくはfunctions.php)に数行コードを追加するだけで、記事IDを表示させるようにすることができますので、ご紹介します。 参照元 : http://word-express.net/category/kowaza 挿入するコードはこちらになります。 add_filter('manage_posts_columns', 'posts_columns_id', 5); add_action('manage_posts_custom_colu
WordPressにはpost_class()という関数が あって、自動で要素にclassを付けてくれ るんですが、この中にアイキャッチ画像 を使用した投稿の場合にclassを追加する という、誰に需要があるのか分からない Tipsシリーズです。 post_class()は僕も殆ど使ったことが無かったんですが(大量のclassが付くので)投稿フォーマットの出現で少し使うようになりました。投稿フォーマットに関しては以前記事を書いたのでご参照下さい。 で、そのpost_class()に、アイキャッチ画像を使った投稿があった際にclassを加える、という方法です。 コード functions.phpに以下を加えます。 function add_eyecatch_class($classes) { global $post; if( has_post_thumbnail($post->ID) )
ちょっと久しぶりですけどWordPressの カスタマイズTips記事です。今日はプラ グインを使わず、記事内の特定のキーワ ードに自動で何か加わるようにしようと いう内容。一応簡単なWikiっぽいものも 作れるっちゃ作れます。 ちょっと分かりにくいんですけど、指定したキーワードを好きなものに置換するっていうコードです。なのでアイデア次第でいろいろ出来るっちゃ出来るんですけど、行儀の良いコードではないので痒いところに手を届けたい時にでも使ってください。 コード functions.phpに含めます。 function change_any_texts($text){ $replace = array( //'変更前' => '変更後' 'CSS' => '<a href="#">CSS</a>', 'tool' => '<strong>tool</strong>' ); $text = s
先日、Twitterでビジュアルエディタに codeを含めたい、というご希望を見か けたので同じような状況の方用にメモ。 紹介されていたコードでは出来ないと の事でしたので追加する方法をご紹介 します。 先日のWebクリエイターボックスさんのWordPressの管理ページをより便利にカスタマイズする方法13という記事内のビジュアルリッチエディターの方法ですと、codeボタンが追加出来ないっぽい、というPostがTLに流れてきました。 なので、念のため別の方法を挙げておきます。 件のコード function ilc_mce_buttons($buttons){ array_push($buttons, "code"); return $buttons; } add_filter("mce_buttons", "ilc_mce_buttons"); 僕も試してみたんですけど、このコードだとco
Twitterの利用法の一つとしてユニーク なモノがあったので備忘録的にご紹介。 Twitterを簡易的なフィードバックツール にしてしまおう、という内容。今まで通り Twitterに投稿するボタンに、感想を加え るようにします。 普段、TwitterではURLとともに感想が書いてあることが多く、フィードバックのツールとしてTwitterを利用しているWebサイトも少なく有りません。このフィードバックをもっと簡易的にしてみよう、というのが今日の内容です。 サンプルは記事の下のほうにあります。 jQueryを使います。僕は基本的にWordPressを使う人なのでWPにあわせたコードです。便宜変更してください。 $(function(){ var url = "<?php the_permalink() ?>"; var post_title = "<?php the_title(); ?>"
地震の災害の最中ですし、僕も東京住まい でそれなりの被害がありますが、関東以外 の方は普通にお仕事をされてると思います。 地震の情報は多数存在しますし、僕が変に 介入しすぎても混乱を招きかねないので 本日より通常更新に戻ります。が、停電を 含め、地震の弊害次第では更新が止まる かも知れ無いことをご了承下さい。 さて、今日はちょっと便利そうなWordPressのプラグインがあったのでシェア。有りそうでなかったプラグインです。 WordPressは、画像をアップロードし、その画像を投稿に含める際にサイズを選べるんですが、そのサイズがデフォルトでは限られています。このサイズの種類を増やせるプラグインがAdditional image sizesです。 上記のように、デフォルトの4つのサイズ以外に3つ増えています。試してはいませんが、いくらでも増やせそうですよ。 設定 プラグインを有効化すると、「
WordPressの自動挿入されるp,brタグをプラグインを使用しないで削除する Wordpressのthe_contentタグを使用して記事を表示するとpタグやbrタグが自動で挿入されますね。 また自動挿入するだけじゃなくてbrが2重になってたりするとpタグに変換してくれたり、削除してくれたりもしてくれます。 正しい構文にしてくれるので便利ではあるのですが、ときには不便になこともありますよね。 ということでこの便利な機能をfunctionsファイルを修正して無効にする方法をご紹介します。 投稿日2010年10月05日 更新日2011年04月03日 現在のテーマのfunctions.phpを修正する。 使用しているテーマフォルダにあるfunctions.phpを開きます。ない場合は作成しましょう。 追加するコードは下記の一行だけです。 functions.php remove_filter
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く