Monthly Archives:4月 2015

白色を基調としたWordPress公式おすすめ無料テーマ13選

29 4月 15
Spike

No Comments

 

 

テーマの探し方、検索方法

テーマの探し方、検索法については、一度、記事に書きました。

WordPressのテーマの4つの検索法、探し方。注意点(英語検索の上手な方法も含め)。販売サイトの紹介。

をご覧下さい。

テーマのインストール法

➀管理画面で「テーマ」→「新規追加」。
検索→「インストール」→「有効化」

もしくは

➁ダウンロードサイトでフォルダごとダウンロードし、FTPでサーバー側のThemeフォルダにアップロードし、有効化。

③または、管理画面の「新規追加」→「アップロード」でダウンロードしたフォルダを選択し、アップロードしてインストール。

各テーマは、インストールし、有効化してみると、プレビューで見るのと違うことがままあります。
気になるテーマは、一度、有効化で試されることをお薦めします。

また、個別のテーマのデザインを含めた詳細な機能については、そのテーマ名で検索してみると、記事が書かれている場合があります。

無料で配布されていたテーマが、WordPress.orgのページから消え、プレミアム・テーマとなっているということもあります。
なので、いいなぁと思うテーマはインストールし、ストックされることをお薦めします。

無料で配布している公式ではないWordPressテーマは、一般に危ない。

日本人でデザイナーさんが公開しているところは、そうでもないでしょうが、WordPressの勉強会で、講師の方がよく言われるのは、「無料で配布しているWordPressテーマは危ない。」です。

プレビュー

 プレビュー画面およびデモでは、ホーム画面だけではなく、クリックすると、投稿ページも閲覧できます。

気になるところは、一通り、見てみることをオススメします。


白が与えるイメージ

白は、Webサイトに最も利用されている色です。

明るく清潔感を感じさせる色でもあります。

そのため、汎用性があり、どのようなサイトにもマッチする色でもあります。

画像について

画像にインパクトがあるテーマが多いですが、こういう配布という形を取るWordPress.org公式でのテーマは、画像のライセンスの関係が難しいように思います。

そのため、サムネイル画像で提示されてある画像は、テーマをインストールした際、必ずしも一緒に、ダウンロードできるわけではありません。

勿論、画像も同時にダウンロードできるテーマはあります。

使用しようとしているサイトと画像がマッチしない、もしくは、画像がダウンロードできなかった場合は、ご自分で探さなければなりません。

ファーストビュー(訪問者が最初に見る)にあたる画像を、サイト・テーマに合わせた適切なものにするのは、中々難しいかと思われます。

その場合、適切でなくても、デフォルトのものを使用するか、知り合いにWeb制作者がいれば、頼んでみることをお勧めします。

また、後陣で探す場合も、サイトを印象づける画像ですので、無料のものではなく、有料のものを、ご購入することをオススメします。

近くにWeb関係者がいなければ、クラウドソーシングで、ネットを介して仕事のやり取りを行っているランサーズクラウドワークスで、仕事依頼をしてみるという手もあります。

個人でも仕事依頼をされている方は、結構います。

Dustland Express

FireShot Capture - WordPress › Dustland Express « _ - https___wordpress.org_themes_dustland-express_

 

More info&Download

 

  • カスタム・バックグラウンド(背景)
  • カスタム・カラー
  • カスタム・ヘッダー
  • カスタム・メニュー
  • Featured Image(画像アップロード可)
  • 可変レイアウト(参照:CSS Layouts: The Fixed. The Fluid. The Elastic..)
  • レスポンシブル・レイアウト
  • フル・ワイズ・テンプレート
  • WooCommerceテーマ

どんなカラーにも変更できる、2つの異なるヘッダー、2つの異なるブログ・レイアウト装備。

SiteOrigin’s Page Builderのようなパワフルなプラグインを利用することにより、どのようなページ・レイアウトも作成できる。

淡い品のある紫をアクセント・カラーに使い、プレビューではオーソドックスな作りのレイアウトとなっています。

サムネイルで示している画像をタイル状に並べたフロント・ページ、どのようにもカスタマイズできる点から、Eコマースのサイトに最適ではないでしょうか。

レイアウトについては、下記サイトを参照ください。

Web制作者は知っておきたいwebサイトのレイアウト7選 │ Design Spice.

[CSS]6つの代表的なCSSレイアウト方法の長所と短所を学んで使いこなす | コリス.

Gateway

 

 

 

FireShot Capture - Gateway I A WordPress theme to get you s_ - http___demo.rescuethemes.com_gateway_

More info&Download  Portfolio  Demo

  • カスタム・バックグラウンド(背景)
  • カスタム・カラー
  • カスタム・ヘッダー
  • Featured Image(画像アップロード可)
  • フル・ワイズ・テンプレート
  • レスポンシブル・レイアウト
  • 右サイドバー
  • sticky-post
  • テーマ・オプションあり
  • 3カラム
  • 翻訳対応

WordPress.orgのページを見ると、ユーザー・フレンドリーなカスタマイズ・オプションを売りにしているようです。

また、説明書も用意されているようです。

制作者のサイトを見ると、ページ一面にインパクトのある写真を利用したサイトを制作するのが、得意のようです。

プレビューを見ると、グローバルメニューが上部に固定され、表、フォーム要素も、エレガントに作られています。

柔らかな白背景で、用途を狭めず、様々なサイトで利用できるでしょう。

Quill

Quill   A WordPress theme for Law Firms

More info&Download  Portfolio  Demo

  •  カスタム背景
  • カスタム・カラー
  • カスタム・ヘッダー
  • カスタム・メニュー
  • 可変レイアウト
  • レスポンシブル・レイアウト
  • 右サイドバー
  • スティッキー・ポスト
  • テーマ・オプションあり
  • 3カラム、2カラム
  • Featured Image(画像アップロード可)
  • 翻訳準備

Featured Imageについて。

What is a Featured Image in WordPress?.

スティッキー・ポストについては、こちら。

WordPress初心者講座「投稿を先頭に固定するSticky Posts」 | フリッジデザイン.

WordPress.orgのページを見ると、制作者は、法律事務所を念頭に置いて制作したらしいです。

また、多くのフロント・ページ領域を用意しているようです。

アメリカのベンチャーのIT業界のサイトのように、スタッフを紹介できるコンテンツも存在するようです。
その他、ブランディングのためのショー・ケースも幾つか用意しているようです。

高いレベルのカスタマイズ・オプションも存在しているようです。

メニューは、モバイル仕様で準備。

使われている黒も、そう濃くなく、小洒落た印象を与え、癖がなく、どのような用途のサイトに合うのではないでしょうか。

また、いつの頃からか公式のテーマでも用意されているフロント・ページは、法律事務所に限らず、小さな企業、ショップにも嬉しい配慮。

i -excel

i-create   Just another WordPress sitei-create   Just another WordPress site

More info&Download  Portfolio  Demo

  • カスタム・カラー
  • カスタム・メニュー
  • Featured Image(画像アップロード可)
  • フレキシブル・ヘッダー
  • 可変レイアウト、レスポンシブル・レイアウト
  • フル・ワイズ・テンプレート
  • 1カラム、2カラム
  • 右サイドバー
  • スティッキー・ポスト
  • テーマ・オプションあり
  • 翻訳準備

 無制限のカラー配色、ボックス/ワイド・レイアウト、「Masonry(メイソンリータイプ)」風レイアウト(参照:メトロ/メイソンリー/グリッド。様々なレイアウトに対応のクールなポートフォリオテーマ.)、カルーセル・フォーマット(カルーセル のWEBデザイン一覧 | WEBデザインギャラリー.)を、サービス、ポートフォリオ、商品、事業用途のサイトとブログ用に、それぞれ用意。

また、お客様の声も掲載できる。

固定ページにも、投稿ページにも、オプション付きのスライダーを準備。

白背景のテキスト欄は、完全な黒ではなく、コントラストを若干落とした黒を使い、読者に読み易く、疲れにくい配慮がなされている。

スライダーだけでなく、割と分厚いフッターも、ビジネス用途向き。

また、右下に、「トップに戻る」ボタンが標準装備である点も嬉しいところ。

少し前まで、プレミアムでなければ、Pinterest風のMasonry(メイソンリータイプ)とブログタイプのレイアウトを1つのテンプレートで使い分けるというのはなかったのですが、両方、準備してくれている点もGood。

Black Line

Products   Black Line free   Just another WordPress site

More info&Download  Portfolio  Demo

Eコマースに最適。

WooCommerce Plugin, Jetpack(ロゴ、ファビコン)をサポート。

制作者は、ブランディングに不向きなのか、情報は以上です。

デモでファッションの写真が飾られているように、何らかのショップのサイトに適していると思います。

通常のブログと異なる左サイドバーも、そういうショップ等に適していると思います。

また、フォトブログに転用しても面白いかと思います。

また、女性でファッション・ブログや白背景というのは、普通のモデルさんでは面白くないかもですが、清楚を売りにしたモデルさんの日常の一コマ・ブログでも面白いのではないでしょうか。

Central

Central   Just another WordPress Demo Theme site

More info&Download  Portfolio  Demo

  • カスタム・バックグラウンド(背景)
  • カスタム・ヘッダー
  • カスタム・メニュー
  • Featured Image ヘッダー(画像アップロード可)
  • Featured Image(画像アップロード可)
  • 固定レイアウト
  • フル・ワイズ・テンプレート
  • 左サイドバー
  • sticky-post
  • 2カラム

 夢見がちない人にピッタリにデザインしたと制作者は、したためています。

制作者自身、少し夢見がちな人なのでしょうか。
デモを見る限り、オーソドックスな作りに見えるのですが、このテーマは、思索者、特徴的なフォトグラファーのためにこそ、作ったとしています。

その他、フォトグラファー、テレフォン・ネットワーク、ニュースサイト、アート・エイジェンシー、レビュー&オピニオンなどに適しているのではないかとしています。

デモを見ると、こじんまりとしたカルーセルとクッキリ見分けられるグローバルナビゲーション、左サイドバーが特徴的です。

そして、大きめのアイキャッチ画像。

この大きめのアイキャッチ画像が、利用者の好みを分けそうですが、画像が、4:3の比率となっているので、一眼レフの画像を、そのまま損なわれずに持ってこれます。

地味と言えば、地味、シンプルと言えば、シンプルなテーマではないでしょうか。

Harmonic

Harmonic   A theme to make your content sing

More info&Download  Demo  Detail

  • カスタム・ヘッダー
  • カスタム・メニュー
  • Featured Image(画像アップロード可)
  • 可変レイアウト
  • 1カラム、2カラム
  • レスポンシブル・レイアウト
  • sticky-post
  • テーマ・オプションあり
  • 翻訳対応

 WordPress.orgのページでは、抽象的な詩的な例えが使われており、その意味するところが、僕には、わかりませんでした。

恐らく、フロントページが、サムネイル画像のような一面、画像となっていると思われます。

フォーラム・エレメントが準備されている。

投稿要旨の左横に、鮮やかな青で、タグと日付、カテゴリーが羅列されています。

通常一般のブログ向きでしょうか。

Aviator

WordPress › Aviator « Free WordPress Themes

More info&Download

  • カスタム・メニュー
  • 可変レイアウト
  • レスポンシブル・レイアウト
  • 翻訳対応

ますます複雑化するWordPressですが、このAviatorは、Webサイトを構築するのに、本当に必要な工程のみを提供するとしています。

無料のサポートフォーラムを提供。

オーソドックスで汎用性のあるグローバルナビゲーションは、しっかり作られており、訪問者にも見やすい。

サービス一覧を表示するエリアあり。

フロント・ページでは、最新の投稿は、アイキャッチ画像で表示させ、洒落ています。
また、スライドさせることも可能。

投稿画面のテキスト文字の大きさが小さいのが気になります。
気になる方は、子テーマを作成し、カスタマイズされるとイイかと思います。

子テーマの作成法は、こちら。

[WordPress基本]カスタマイズの前に子テーマを!!

 

Gray Chalk

WordPress › Gray Chalk « Free WordPress Themes

More info&Download

  • カスタム・バックグラウンド(背景)
  • カスタム・カラー
  • カスタム・メニュー
  • 右サイドバー
  • 2カラム

Twenty Twelve.を親テーマとして制作されたテーマ。

サイト・タイトルと記事タイトルのフォントがユニーク。

上品な緑をアクセントとして活用。

フォームのエレメントも用意。

ユニークなリストも作成できる。

少し残念なのは、投稿ページは、フロントページと異なり、あまり作り込まれていないこと。

通常のブログに適しているのではないでしょうか。

Astoned

FireShot Capture - WordPress › Astoned « Free WordPress The_ - https___wordpress.org_themes_astoned_

More info&Download  Portfolio

  • カスタム・バックグラウンド(背景)
  • カスタム・ヘッダー
  • カスタム・カラー
  • カスタム・メニュー
  • Featured Image(画像アップロード可)
  • 1カラム、2カラム
  • レスポンシブル・レイアウト
  • 右サイドバー

個人ブロガーのために、シンプルに制作したと記載されています。

派手で目立つ(印象に残る)サイト・タイトル文字。

白背景に、コントラストの強い黒のサイドバーのエレメント。

段落のテキスト・フォントの色の黒もコントラストが強いです。
そのため、ユーザーに読み易いのではないでしょうか。

ニュース系のブログに適しているのではないでしょうか。

Gray Whale

WordPress › Gray Whale « Free WordPress Themes

More info&Download    Detail

  • カスタム・カラー
  • カスタム・ヘッダー
  • 可変レイアウト
  • 1カラム、2カラム
  • レスポンシブル・レイアウト
  • sticky-post
  • テーマ・オプションあり
  • フルスクリーン・フロント・ページ

フロント・ページに、ビジターにメッセージを各エリアが存在。

テーマカラー変更、ソーシャルメディア情報などを追記できるオプションが存在。

ページ構成を変えるための幾つかのテンプレートも用意。

山の画像のキービジュアルを除けば、オーソドックスな作り。

欧文でしかわかりませんが、投稿ページのテキスト文字も、非常にオーソドックス。

どのようなテンプレートが用意されているのか、定かではありませんが、このテーマをどのように利用するかは、あなたの工夫次第ではないでしょうか。

Prompt

FireShot Capture - WordPress › Prompt « Free WordPress Themes - https___wordpress.org_themes_prompt_

More info&Download  Portfolio

  • カスタム・バックグラウンド(背景)
  • カスタム・ヘッダー
  • カスタム・メニュー
  • Featured Image(画像アップロード可)
  • 可変レイアウト
  • 1カラム
  • レスポンシブル・レイアウト
  • テーマ・オプションあり
  • 翻訳対応
  • 3つのウイジェットエリア

ランディング・ページ、セールスWebサイトのために制作したそうです。

フォントを使いアイコンを制作できるそうです。

キービジュアルの下にあるボタンが独特で、制作者も、このボタンは、ビジターを引きつけるであろうとしています。

オーソドックスですが、美しさを感じるテーマです。
ただ、1カラムというのが利用する人を選びそうです。

Twitterと連携し、自動投稿してくれるWordTwit の使い方、設定方法

22 4月 15
Spike

No Comments

 

WordTwit とは

プレミアムのWordPressPluginでも大きく成功している、WPtouch Mobile Pluginも開発している開発者が提供している、WordPressの投稿と同時に、投稿名などをツイートしてくれる便利なPlugin。

無料で利用できます。

Read More…

MySQLを利用するためのXAMPPの設定

16 4月 15
Spike

No Comments

 

日本語の文字化けを避けるためにも、文字コードを正しく設定する必要がある。

今回、文字コードをUTF-8に設定する方法を記載します。

MySQLでは、UTF-8がutf8という名で用意されているために、UTF-8ではなく、utf8と記述する点に注意。

1.[C:xamppmysqlbin]にある[my.ini]ファイルをエディタで開く。

2.18行目付近の[# The MySQL server]の下に、[default-character-set=utf8]を追記する。

[client] 
# password       = your_password 
port            = 3306 
socket          = "C:/xampp/mysql/mysql.sock"
# Here follows entries for some specific programs
# The MySQL server
default-character-set=utf8

3.155行目から160行目付近の[character-set-server=utf8]と[skip-character-set-client-handshake]の先頭にある#を削除する

## UTF 8 Settings
#init-connect='SET NAMES utf8'
#collation_server=utf8_unicode_ci
#character_set_server=utf8
#skip-character-set-client-handshake
#character_sets-dir="C:/xampp/mysql/share/charsets"

4.163行目付近の[mysql]ブロックの[#safe-updates]の下に、[default-character-set=utf8]を追加する。

[mysql]
no-auto-rehash
# Remove the next comment character if you are not familiar with SQL
#safe-updates
default-character-set=utf8

5.[my.ini]ファイルを保存し、XAMPPコントロールパネルで、MySQLの[Stop]ボタンをクリックし、[Start]をクリックし、MySQLを再起動させる。

XAMPPコントロールパネル:MySQLを再起動

 

MySQLが再起動しない場合は、my.iniに加えた記述が誤っていないかどうかを確認する。

【参照】

JavaScriptの基礎知識

12 4月 15
Spike
No Comments

1995年、Netscape社とSun Microsystems社が共同でLiveScriptというスクリプト言語を開発。

当時、オブジェクト指向言語であるJavaが注目を集めており、それにあやかって「JavaScript」と改称された。

このJavaScriptにより、HTML文書を表示しているブラウザ側で、ユーザーの操作に対した処理が出来るようになった。

Read More…

Windows Live Writerエラー 「ブログ サーバーから受信した metaWeblog.getRecentPosts メソッドへの応答が無効です。」

04 4月 15
Spike
,
No Comments

 

他のことでは不便を感じないのだが、MacのMarsEditとWindows Live Writerを、WordPress管理画面を通して、受け渡しが出来なくて、放置していた「ブログ サーバーから受信した metaWeblog.getRecentPosts メソッドへの応答が無効です。」エラーに対処しようと奮闘いたしました。

Windows Live Writer「ブログ サーバーから受信した metaWeblog.getRecentPosts メソッドへの応答が無効です。」エラー

Read More…

カテゴリー