スポンサーリンク
WordPress

[WP]WordPressでアイキャッチの画像とパスを取得する方法

WordPressの記事投稿時に「アイキャッチ」を利用する事が多いと思います。 例えば「最新記事をアイキャッチ付きで一覧表示」したり「OGP 設定にアイキャッチを使う」など、非常に利用頻度の高い画像ですので、今回はこのアイキャッチ画像を取得...
Javascript・jQuery

[javascript]手軽にブログの関連記事を表示できるLinkWithin

ブログの関連記事を自動で取得してサムネイルとタイトル付きで表示してくれる LinkWithin。 LinkWithinのサイトでメールアドレスやブログURLなどを登録するだけでjavascriptのタグ(ソースコード)が発行されますので、そ...
WordPress

[WP]WordPressの固定ページを、ページIDとページスラッグで振分処理する方法

WordPressのテンプレートファイルの中で、page.phpが固定ページ用のテンプレートになります。 企業サイトを構築すると「トップページと会社概要ページでデザインが異なる」なんてことは良く有りますが、WordPressの場合、このpa...
WordPress

[WP]Contact Form 7のフォームの使い勝手を向上させるカスタマイズ 7選

Contact Form 7を利用したお問い合わせフォームで出来るカスタマイズについて、一部ですがまとめさせていただきました。 確認フェイズを挟む jquery.wpcf7.confirm.js を利用して、Contact Form 7のお...
WordPress

[WordPress]カテゴリリンクを出力した際の title=”に含まれる投稿をすべて表示” を消す方法

WordPressでカテゴリリンクを出力する際には、wp_list_categories() や the_category() を利用しますが、ソースコードには <a title=" の投稿をすべて表示"> も一緒に出力されてしまいます。 ...
HTML

[HTML]スマホサイトでお世話になる <meta name=”viewport”> の設定のまとめ

meta viewportは、デバイスに応じてウィンドウの幅や高さを調整できたり、画面を拡大縮小率を調整したりと、表示領域を設定する上で重要なメタデータです。 特に、スマートホンやiPad などのタブレット向けにサイトを構築したり最適化する...
Javascript・jQuery

[jQuery]レスポンシブWEBデザイン対応のスライダープラグインbxSlider

jQuery ベースのコンテンツスライダーには色々ありますが、今回紹介させていただくbxSliderは設置が簡単で、自動再生やフェードインによる画像切り替えなどのカスタマイズも手軽にできる便利なプラグインです。 また、レンスポンシブWEBデ...
WordPress

[WP]さくらサーバでWordPressの管理画面を共用SSLで動かす方法(プラグイン利用)

WordPressのバージョンも3.4.2になり、WordPress HTTPSのプラグインバージョンも3.2に上がったので、管理画面を共用SSLで動かす方法 の記事をまとめ直しました。 さくらサーバでは一応動いていますので取りあえずは今回...
WordPress

[WordPress]カテゴリの順番を自由に変更できるプラグインCategory Order

WordPRessのカテゴリを自由に並べ替えたいと思っても、固定ページのように「順序欄に数字を入れて調整…」のような機能はありません。 カテゴリの順番を入れ替えるプラグインは色々ありますが、シンプル且つ、ドラッグ & ドロップで並び替えると...
Macアプリケーション

[Mac]WEBサイトのページキャプチャを撮るならPaparazzi!

クライアント向けにサイトを作っていると、案件によっては「デモページのキャプチャを撮ってパワポに貼って…」なんて作業があるのですが、 画面ごとに地道にキャプチャを撮るとフォトショで加工するのが面倒なので、ページのキャプチャをいい感じに撮ってく...
Javascript・jQuery

[JS]イメージマップでロールオーバー時の画像を変更する方法

<img><map><area>によりイメージマップを利用する上で、「マウスを乗せた画像に変化を付けてリンクであることを分かりやすくしたい!」という要望に応えるカスタマイズです。 Javascriptを利用すれば、ロールオーバー時の画像を変...
WordPress

[WP]WordPressの管理バーをカスタマイズしてオリジナルのメニューを加える方法

マルチサイトではないWordPressサイトを複数運用している都合上、それらサイトの管理画面や特定のページにダイレクトに移動できるようにしたいと思っていましたので、WordPress3.1で追加された管理バー(Admin Bar)をカスタマ...
functions.php

[WP]記事の1件目や偶数件目、奇数件目などに個別の処理を施す方法

WordPressで「記事の1件目にだけ広告を表示する」みたいなことをするための方法です。 記事の1件目に広告を挟むような特定の処理を入れたりできる他、1件目の記事にだけ特別なクラスを指定することもできます。 また、偶数件数や奇数件数の記事...
Macアプリケーション

[Mac]MacのローカルIPアドレスを確認する方法

Mac のローカルIPアドレスを確認する方法です。 「Snow Leopard」や「Mountain Lion」共通の確認方法です。 OSのバージョン(例えばTiger とか)によっては微妙に確認場所が異なりますが、「システム環境設定」→「...
Javascript・jQuery

[JS]javascriptでユーザーエージェントを判定してブラウザ毎に振分処理を行う方法

個人的にはブラウザ判定を行う場合はPHPで行うことが多いのですが、PHPが使えない(.htmlファイルなど)場合にjavascriptでユーザーエージェントを調べてブラウザ別に処理を行う方法が使えます。 ブラウザ情報を返す処理だけでなく「I...
WordPress

WordPress3.4.2のカスタムフィールドバグ修正プラグインFix Custom Fields in WP 3.4.2

ご存知の方も多いと思いますが、WordPress3.4.2ではカスタムフィールドに不具合があります。 カスタムフィールド自体が使えない訳ではありませんが、記事投稿時の作業効率が非常に悪いです…。 何とかならないものかと色々探していた中、「修...
WordPress

[WordPress]お問い合わせフォーム用プラグインContact Form 7の基本設定

WordPressでブログや企業サイトを構築する上で、お問い合わせフォームを設置する際に便利なプラグインが Contact Form 7 です。 拡張機能も色々あり、カスタマイズ次第で使い勝手もかなり向上する定番のプラグインですが、今回はま...
ソーシャルメディア

OGPの設定方法とFacebookデバッガーの利用方法

OGPとは「Open Graph Protocol」の略で、Facebook などのSNSで使われる共通の仕様(記述方式)です。 Facebookの「いいね」や mixi の「チェック」など、ブログやサイトを問わずSNSボタンを置く事が当た...
jQueryプラグイン・ライブラリ

[jQuery]<table>をレスポンシブWEBデザイン対応させるプラグインFooTable

ホームページやWEBサイトを作っていると、<table>を使った表組みというのはまだまだ健在です。 しかし、iPadやスマホでサイトを見る機会も増えたことで、今までのようなPCサイト向けに表示させていた<table>をレスポンシブWEBデザ...
WordPress

[WordPress]固定ページの順番や階層を変更できるプラグインpageMash

ドラッグ&ドロップの操作で手軽に固定ページの順番を変更できるWordPressプラグインpageMashのご紹介です。 pageMashとは? WordPressで企業サイトを構築するに当たり、「会社概要」「プライバシーポリシー」などの定番...
WordPress

[WP]トップページにカテゴリ別の記事を「画像付き」で複数件出力させる方法

企業サイトをWordPressで構築する場合、例えば 「TOPページにニュースを5件、製品情報を3件、導入事例記事を3件出力する」 というカスタマイズを頻繁に行うのではないでしょうか。 ニュースや製品情報、導入事例などの記事をカテゴリで管理...
CSSプロパティ

[CSS]CSSで印刷時のページ分割(改ページ)を行う方法

WEbページを印刷する場合、 「なんでここでページ分割されるの??」 なんてことがよく起こりますが、CSSのpage-break-beforeやpage-break-afterを使えば、ページ分割(改ページ)位置を指定してあげることができま...
CSSプロパティ

[CSS]角丸をIE8以下でも利用できるようになるborder-radius.htcの使い方と注意点

IE8以下のバージョンで「角丸」を実現させる方法は、PIE.htc や IE-CSS3.htc などを使う方法もありますが、今回紹介させていただく border-radius.htc を使う方法もあります。 名前の通り border-rad...
WordPress

[WP]WordPressをインストールしたらサイト診断用プラグイン「WP Security Scan」を使ってみよう

サイト内スキャンをしてくれるWordPress プラグインWP Security Scanのご紹介です。 WordPressのバージョンが最新版かどうか?の他にも、ユーザー名に「admin」が使われていないか?データベースのプレフィックスが...
CSSスニペット

[CSS]要素を横並びに配置できるdisplay:table-cellの基本的な使い方と注意点

要素を横並びで配置するには、CSSのfloatやdisplay:inline-blockを用いるか、あるいは <table> タグを用いるか…の方法がありますが、 今回紹介させていただくdisplay:table-cellでも同じことができ...
スポンサーリンク