Image Image Image Image Image Image Image Image Image Image

WordPressのレシピ | December 6, 2016

Scroll to top

Top

Pocket

無料でハイクオリティ!2014年初夏のWordPressのオススメ新着テーマ7選

2014年6月9日 |

Tracks 画像と文章コンテンツが交互に織りなす、個人向けブログテーマ

Tracksは、2014年5月に登録された新着テーマのなかでも★5レビューの高評価テーマ。画像と独自で個人ブログをブランディングしたい方にぴったりかもしれません。

デモサイト|ダウンロード

Semicolon シンプルでカスタマイズしやすいグリッド・レスポンシブテーマ

Semicolonは、グリッドレイアウトでレスポンシブデザインに対応した、シンプルなテーマです。2014年5月30日に登場したばかりの新テーマ。スマートフォンサイズの幅でも、レスポンシブデザインで整って表示されるため、カスタマイズを前提としたWebマガジンの基礎テーマとしても活用できそうです。

デモサイト|ダウンロード

Foodeez Lite

上品に料理を見せるならこのテーマ

Foodeez Liteは高級なレストランやホテル向けにデザインされたテーマです。それ以外でも、レシピやグルメ記事など料理を詳しく紹介したいサイトにはおすすめです。

デモサイト|ダウンロード

Make

カスタマイズしやすさが魅力的

Makeはシンプルなグリッドデザインですが、開発元のサイトのデモを見ると、お店やブログなどの使い方が紹介されています。多目的な利用とカスタマイズしやすさを考えて作られているので、触って使いこなしたくなるテーマです。

デモサイト(ショップ)|デモサイト(ブログ)|ダウンロード

Chocolat

女子ブログにぴったりの甘いテーマ

Chocolatは落ち着いたチョコレート色がベースの、デザインが愛らしいブログ向けテーマです。見た目はかわいくても、中身はしっかりと使いやすく考えられています。作者は日本人の Mignon Style さん(サイトはこちら)。質問があれば、WordPressの日本語フォーラムで受け付けてくれます。

ダウンロード

Interface

カスタマイズが簡単だから使い方もいろいろ

Interfaceは簡単にカスタマイズができるように作られています。サイト・投稿ページのレイアウトやページテンプレートなど、豊富に用意されていますので、スマートで高機能なサイトが実現できそうです。

デモサイト|ダウンロード

NewsPress Lite

ニュースメディアのようなコンテンツ豊富なサイト向け

NewsPress Liteはその名の通り、ニュースメディア向けのテーマです。トップページに様々な情報が上手く収まっており、またプルダウンのメニューもあるので、情報が見つけやすい設計です。ニュースサイトに限らず、記事が豊富なサイト全般に適しています。 デモサイト|ダウンロード

Read More

WordPressの新テーマ「onetone」は、最新デザイントレンドを反映したメインビジュアル強調型の1カラムの高評価テーマ

2014年6月8日 |

WordPressの無料テーマ「Onetone」は1カラムに表示するシンプルかつスタイリッシュなデザインのビジネス向けテーマで、レスポンシブデザインにも対応しています。スクロールしてもメニューが先頭に位置するフローティングメニューとなっていますので、セクション移動もスムーズです。

メインビジュアルに動画を使用して、個性的で印象強いサイトを実現

デモサイトを見ると、トップセクションの背景には動画が流れ、インパクトのあるものになっています。実はこれ YouTube の ID を指定するだけなのです。もちろん、動画を使用せずに画像とすることも可能です。

設定は、複数のセクションを順番に指定するだけ

セクションの内容と順序を定義することで、それらをひとつのページに表示します。セクションで指定する内容は、基本的には背景とコンテンツの2つになります。背景はデモサイトのような動画であれば YouTube の IDを、以外では画像や背景色を指定できます。コンテンツはテキストや画像などです。

(クリックで画像を拡大)

固定ページを作成してメニューに追加するには

まず固定ページを新規に作成し、公開の状態にします。

次にダッシュボードの[設定-表示設定]の「フロントページの表示」にある「固定ページ」の「投稿ページ」で先程作成した固定ページを選択してセットします。

最後にメニューに反映させるため、[外観-メニュー]からメニューの追加を行い、「メニュー設定」の「テーマの位置」にある「Home Page Header Menu」にチェックを入れます。

これでメニューから作成した固定ページが参照できるようになります。デモサイトのメニューには「Blog」が追加されていますので、動きが確認できます。

シンプルだからこそカスタマイズでオリジナリティを

ポイントを押さえたマニュアルサイトが用意されていますので、構成の理解やカスタマイズするときなどは非常に参考になります。1カラムにはコンパクトに情報をまとめて、カスタマイズ次第で様々な使い方や見せ方ができそうです。

Read More

WordPressのミニマム&シンプル人気テーマ「Shotoku」は初心者にも扱いやすく、写真日記などにお薦め。

2014年5月30日 |

WordPressの無料テーマ「Shotoku」は、シンプルなギャラリーサイトが簡単に作成できるテーマです。作成するときに難しい設定は一切ありませんので、初心者でもとても扱いやすくなっています。写真中心のブログなどにオススメです。

記事を投稿するだけで、シンプルなギャラリーサイトが実現

メインページに並んでいる写真をクリックすると、各記事へのリンクとなっています。記事の作成時、アイキャッチ画像を設定しておく必要があります。アイキャッチ画像がそのままメインページのギャラリーとして時系列に表示され、それぞれの記事のトップに画像が配置されるようになっているので、レイアウトで悩むこともありません。もちろん、レスポンシブデザインとなっています。

Facebookページの作成も簡単

また「Shotoku」ではFacebookページも作成できます。固定ページでページテンプレートから「FacebookPage」を選択するだけですので、こちらも簡単ですね。

以外ではウィジェットで各種ソーシャルメディアのリンクを追加することができます。見出しとリンク先をセットすると、それぞれのアイコンと共に表示されるようになります。 (対応:RSS,Twitter,Facebook,Youtube,Tumblr,Google,Skype,Flickr,Vimeo,LinkedIn,Delicious)

(設定画面)

表示すると、以下のようになります。

Read More

イメージスライダーが目を引く「Vantage」を使えば、ハイクオリティな企業サイトも実現可能

2014年5月16日 |

CMSサイトとしての構築がしやすい「Vantage」は、海外のビジネスユースでも多数採用されているWordPressの無料テーマです。レスポンシブデザインに対応し、トップには大きなメインビジュアルとしてイメージスライダーが採用されているため、ブランディングを意識した企業サイトや、特定の製品・アプリなどを紹介するティザーサイトとしての用途で活用できるかもしれません。

Vantageのココが人気

Vantage はメイン画像がスライダーで、レスポンシブデザインにも対応しています。様々なプラグインを組み込むことで、無料でありながらデザイン性の高い幅広い目的に応じたサイトが構築できるのも魅力です。またフリーにも関わらず、基本的な使い方からカスタマイズまでかなり詳しいマニュアルも用意されています。

おすすめプラグイン

「Vantage」の公式サイトではいくつかのプラグインが紹介されていますので、ぜひ利用してみて下さい。「Vantage」を作成している SiteOrigin の「Page Builder」を使えば、ドラッグ&ドロップといった直感的な操作でページを作成できます。「Meta Slider」は、大きな画像で様々なパターンのスライダーを組み込めるので、デザインを印象的なものにしてくれます。人気の高い「WooCommerce」はECサイトを構築する場合におすすめされています。

「Vantage」は様々な用途に利用できますが、プラグインを使えば簡単に高機能のサイトが作れます。企業サイトやショップを作るのなら「Vantage」を選択肢のひとつに入れてみてはいかがでしょうか。

デモを見る ダウンロード

Read More

「Imagepaste」はWordPressの投稿画面でクリップボードの画像をペーストできるプラグイン。コピペで画像挿入の作業が効率化する必須プラグイン!

2014年4月29日 |

Imagepasteは、WordPressの投稿画面(ビジュアルエディタ)に、クリップボードに保存してある画像をペーストで挿入できるプラグインです。スクリーンショット画像を多用するブログメディアや(もちろん、このブログもそうです!)、画像加工ソフトを使いながら頻繁に画像をアップロードする人には、最適なプラグインです。 画像加工ソフトなどで、エリアを選択して Ctrl+C(Cmd+C)でコピーした状態で、ビジュアルエディタ上で Ctr+V(Cmd+V)するだけで、画像を貼り付けることができます。今までは、一度ローカルPC上に保存した画像でないとライブラリ管理が出来ませんでしたが、このプラグインを有効化するだけで使えるようになります。

Imagepasteのインストール方法

Imagepasteは公式プラグインに登録されています。

ダッシュボードのプラグイン検索から「Imagepaste」と検索するとヒットします。

GitHubなどのエディタでは、Ctrl+V(Macの場合 Cmd+V)で貼り付けられますが、同様の機能がWordPressに導入できます。

Imagepasteの動作環境

Imagepasteは、Google Chromeで動作するプラグインです。WordPress3.9 + Google Chrome Ver 34(2014年5月最新版)にて、本記事の執筆中に実際に使い、動作確認できました。

[注] Safariでは使えない模様

Safari上でペーストすると、 webkit-fake-url:// という表記になり、ビジュアルエディタ上では確認できますが、投稿しても画像が表示されません。

Imagepasteの使い方

Webブラウザで表示されている画像を右クリックか、画像加工ソフトなどで画像をクリップボードにコピーします。

WordPressの投稿画面(ビジュアルエディタ上)で、ショートカットキーの Ctrl+V(Cmd+V)で画像を貼り付けることができます。

[注] ショートカットキーを使わず右クリック+ペーストしようとすると、正常に動作しない場合があり、以下のようなアラート画面が出ます。

WordPress 3.9から、画像のリサイズが直感的にできるインターフェースになりましたので、より使い勝手が良くなるでしょう。

Imagepaste – WordPress Plugin http://wordpress.org/plugins/imagepaste/Read More

WordPressユーザーのためのPHP入門

2014年3月27日 |

『WordPressユーザーのためのPHP入門 はじめから、ていねいに。』という書籍が、発売されました。WordPressに関する入門書、カスタマイズなどの教本はあふれている状況ですが、おそらく潜在的なニーズが高いにも関わらず、この手の情報を扱った(WordPress特有のPHPや、WordPressをきっかけにプログラミングを学びたい人を対象とした)書籍は少なかったので、基本機能を抑えてステップアップしたい方は、手にとって見てはいかがでしょうか。筆者も購入しており、新たな気付きがあればと思っています。

WordPressでサイトやブログをつくるときに、PHPに自信がなく、やりたいことを諦めてしまった経験のある方も多いことでしょう。本書はHTMLやCSSはひととおりわかっているものの、PHPは苦手というWordPressユーザーを対象に、WordPressのテーマをつくる際に必要になるPHPの知識と手法を解説した入門書です。

PHPをしっかりと理解することで、WordPressでできることは大きく広がります。本書では、変数・配列・条件分岐・繰り返し・関数・オブジェクトといったPHPの基本文法から、テンプレートタグ・ループ・テンプレート階層・フックなどのWordPress特有のルールまで、WordPressのテーマづくりに必要な基礎が初心者でもやさしく身につきます。

さらに本書のサンプルテーマに沿いながら、ヘッダー・ナビゲーション・アーカイブ・個別投稿・固定ページといったWordPressのブログやサイトを構成する具体的なコードも関数の使い方まで詳細に解説。カスタム投稿タイプやカスタム分類、カスタムフィールドなどの一歩進んだ機能も学べます。WordPressを本当に使いこなしたいユーザーに必携の1冊です!

【こんな方にお勧めです! 】 ★WordPressで好きなようにサイトやブログをつくりたい ★HTML+CSSはわかるけどPHPはちゃんと勉強したことがない ★コピペする場合でもコードの意味をきちんと知っておきたい

Read More

WordPressの画像アップロード時のファイル名の命名規則を統一させるためのプラグイン「File Renaming on upload」日本のタイムゾーンに対応させる方法

2014年3月26日 |

WordPressを使って画像(メディア)をアップロードすると、原則としてローカルにあった画像ファイル名がそのまま引き継がれます。

WordPressのメディア(画像)デフォルト設定は?

  1. /wp-content/uploads/2014/02/〜 など 年/月 単位のフォルダに格納される
  2. 日本語のファイル名は、標準で入っているプラグイン「WP Multibyte Patch」の処理で、英数字に変換される
  3. 同名ファイルをアップロードした場合、image-1、image-2 のようにハイフンで数字が振られる
  4. ファイル名に空白やドットがある場合は、「 – 」(半角ハイフン)に変換される

上記のデフォルト設定を柔軟にカスタマイズしたいところですが、(1)メディアの保存先ディレクトリの指定についてニーズのある方は、こちらの記事をご覧ください。

ファイル名にも命名規則をつけたい

/wp-content/uploads/2014/02/* などのフォルダに格納されていくのですが、せっかく年/月という規則的なフォルダ構成で管理されるのですから、ファイル名にも命名規則をつけて、「日時分」といった形で保存したいところです。

後からリネームできるプラグインはあるが、アップロード時のプラグインは無い?

ファイル名をリネームする方法として、過去の画像パスを1件ずつリネームし、さらに関連付けされている投稿も修正してくれる便利なプラグインが存在します。すでに運用フェーズに入っている場合は、このようなリネームプラグインで対応する手段しか無さそうですが、これからWordPressでブログやサイトを立ち上げる際には、画像ファイルの命名規則の統一を、「最初にやるべき設定」の1つに加えてみましょう。

プラグイン「File Renaming on upload」を導入

File Renaming on uploadをカスタマイズ

プラグインの編集で、FileRenamingOnUpload.php の204行目付近

以下のように変更します。

タイムゾーンをAsia/Tokyoに設定し、ファイル名はディレクトリ名と重ならないように「日時分秒」にしておきます。これで、画像アップロード時には自動的に、以下の様なパスで画像ファイルが生成されます。

http://wordpress-recipe.com/wp-content/uploads/2014/03/27004937-690×572.png

プラグインのダウンロードはこちら

  • http://wordpress.org/plugins/file-renaming-on-upload/screenshots/

Read More