Firstテーママニュアル

テーマ詳細 | ライブデモ

目次

クイックスペック（単位は全てピクセル）

  1. メインカラムの幅: 644
  2. サイドバーの幅: 250
  3. フッターウィジェットの幅: 300
  4. 投稿のアイキャッチ画像の幅: 644（高さは無制限）
  5. ヘッダー画像およびページのアイキャッチ画像: 1220×480

インストール

Firstテーマのインストールは次の3つの方法から選択できます。

1. 公式ディレクトリからインストール（推奨）

管理画面の外観→テーマからページ上部の新規追加をクリックし、Firstを検索します。Firstテーマが表れるので、インストールをクリックします。インストール完了画面になったら有効化をクリックします。以上でインストールは完了です。

2. 管理画面からインストール

あらかじめFirstのzipファイルをダウンロードしておきます。管理画面の外観→テーマからページ上部の新規追加をクリックし、さらにテーマのアップロードをクリックします。アップロード画面になったらzipファイルをアップロードします。インストール完了画面になったら有効化をクリックします。以上でインストールは完了です。

3. FTPからインストール

あらかじめFirstのzipファイルをダウンロードしておきます。ダウンロードしたFirstのzipファイルを解凍し、firstフォルダを…/wp-content/themes/内にFTPアップロードします。管理画面の外観→テーマからFirstテーマの有効化をクリックします。以上でインストールは完了です。

すでにアイキャッチ画像付きの投稿がある場合、テーマインストール後にRegenerate Thumbnailsプラグインをインストールし、画像の再生成を行って下さい。これによってテーマにあったサイズのアイキャッチ画像が自動で生成されます。

カスタマイザー

Firstテーマは外観→カスタマイザーから様々な設定を行うことができます。

サイト基本情報

  • サイトのタイトル: サイト名を設定します。これは設定→一般の設定と同じです。
  • キャッチフレーズ: サイトのキャッチフレーズを設定します。これは設定→一般の設定と同じです。
  • キャッチフレーズを表示しない: キャッチフレーズを非表示にします。

フォント

  • 見出しフォント: 見出しのフォントを設定します。
  • 見出しフォントサイズ (%): 見出しのフォントサイズを設定します。単位は%です。
  • 本文フォント: 本文のフォントを設定します。
  • 本文フォントサイズ (px): 本文のフォントサイズを設定します。単位はpxです。

色

色セットを設定した場合、個別の設定は無視されます。

  • メニュー背景色: ナビゲーションバーの背景色を設定します。
  • フッター背景色: フッターウィジェットの背景色を設定します。
  • リンクカラー: リンクの色を設定します。
  • リンクホバーカラー: マウスオーバー時のリンクの色を設定します。
  • 色セット: 上記4色をまとめて設定します。

背景

レイアウトでワイドレイアウトを選択した場合、背景色および背景画像は表示されません。

  • 背景色: 背景色を設定します。
  • 背景画像: 背景画像を設定します。背景画像はアップロード、もしくはメディアライブラリから選択できます。設定しなければ表示されません。

レイアウト

  • レイアウト: ボックスレイアウトかワイドレイアウトかを選択します。
  • ヘッダーレイアウト: ヘッダーのレイアウトを設定します。
  • フッターレイアウト: フッターのレイアウトを設定します。
  • ノンレスポンシブ: レスポンシブデザインを無効にします。

タイトル

  • フォント: タイトルのフォントを設定します。
  • フォントウェイト: タイトルのフォントウェイトを設定します。
  • フォントサイズ (px): タイトルのフォントサイズを設定します。単位はpxです。
  • フォントカラー: タイトルのフォントカラーを設定します。
  • 文字間 (px): タイトルの文字間を設定します。単位はpxです。
  • 上マージン (px): タイトルの上余白を設定します。単位はpxです。
  • 下マージン (px): タイトルの下余白を設定します。単位はpxです。
  • 全て大文字にする : タイトルを全て大文字で表示します。

ロゴ

ロゴ画像をレティーナ対応にするためには、2倍のサイズのロゴ画像が必要になります。

  • ロゴアップロード: ロゴ画像をアップロードします。
  • サイトタイトルと置き換える : ロゴ画像によってサイトタイトルを置き換えます。
  • レティーナ対応: ロゴ画像をレティーナ対応にします。
  • 丸く切り抜く: ロゴ画像を丸く切り抜きます。
  • 上マージン (px): ロゴの上余白を設定します。単位はpxです。
  • 下マージン (px): ロゴの下余白を設定します。単位はpxです。

ナビゲーション

  • ナビゲーションバーを表示しない: ナビゲーションバーを非表示にします。
  • 検索を表示しない: ナビゲーションバーの検索を非表示にします。

ヘッダー画像

  • 現在のヘッダー: トップページ上部に表示されるヘッダー画像を設定できます。画像はアップロード、もしくはメディアライブラリから選択できます。設定しなければ表示されません。

投稿

  • 表示: 投稿一覧ページで全文を表示するか概要を表示するかを選択します。
  • 投稿者を表示しない: 投稿の投稿者を非表示にします。
  • カテゴリーを表示しない: 投稿のカテゴリーを非表示にします。

フッター

フッターテキストではHTMLタグはaタグおよびbrタグのみ許可されています。

  • フッターテキスト: フッターにテキストを表示します。
  • クレジットを表示しない: WordPressおよびThemehausへのクレジットを非表示にします。

カスタムCSS

カスタムGoogleフォントは「Open+Sans:300,300italic|Roboto:100,900」のように設定します。

  • カスタムCSS: CSSを追加設定します。
  • カスタムGoogleフォント: Googleフォントを追加読み込みします。

メニュー

メニューの項目は外観→メニューから設定できます。

  • ナビゲーションバー: ナビゲーションバーに表示されるメニューを設定します。設定しなければページ一覧が表示されます。
  • ヘッダーメニュー: ヘッダーに表示されるメニューを設定します。設定しなければ表示されません。
  • フッターメニュー: フッターに表示されるメニューを設定します。設定しなければ表示されません。

ウィジェット

それぞれのウィジェットを設定できます。これは外観→ウィジェットの設定と同じです。

固定フロントページ

  • フロントページの表示: サイトトップに表示するページを変更します。これは設定→表示設定の設定と同じです。

ウィジェット

Firstテーマは外観→ウィジェットから各ウィジェットを設定できます。Firstは4つのウィジェットに対応しています。

サイドバー

サイドバーに表示されます。使用しなければ表示されず、1カラムデザインになります。

フッター1/フッター2/フッター3

フッターウィジェットエリアは左から順に3つあり、使用する数によって幅が自動的に調整されます。1つも使用しない場合は表示されません。

Firstテーマは外観→メニューから各メニューを設定できます。Firstは3つのメニューに対応しています。

  • ナビゲーションバー: ナビゲーションバーに表示されるメニューを設定します。設定しなければページ一覧が表示されます。
  • ヘッダーメニュー: ヘッダーに表示されるメニューを設定します。設定しなければ表示されません。
  • フッターメニュー: フッターに表示されるメニューを設定します。設定しなければ表示されません。

新しくメニューを設定する場合、ページ上部の新規メニューを作成をクリックし、メニューの名前を自由に入力してメニューを作成をクリックします。

次に画面左側から追加したいページを選択しメニューに追加をクリックします。リンクやカテゴリーを追加することもできます。また各項目はドラッグで順番を変更できます。

メニューの項目・順番が決まったら、ページ下のメニュー設定のテーマの位置でメニューを表示したい場所を選択し、メニューを保存をクリックします。

以上でメニューの設定は完了です。さらに別のメニューを設定する場合は再び新規メニューを作成から行って下さい。

以下のWebサービスおよびRSSフィードへのリンクには自動でアイコンが追加されます。
CodePen・Digg・Dribbble・Dropbox・Facebook・Flickr・Google+・GitHub・Instagram・LinkedIn・Pinterest・Polldaddy・Pocket・reddit・Skype・StumbleUpon・Tumblr・Twitter・Vimeo・WordPress・YouTube

投稿

Firstは投稿画面のフォーマットから投稿フォーマットを選択できます。対応しているフォーマットは標準・アサイド・音声・チャット・ギャラリー・画像・リンク・引用・ステータス・動画です。

それぞれの表示がどのようになるかはライブデモの投稿フォーマットカテゴリーをご覧下さい。なお、投稿フォーマットは必ずしも使う必要は無く、画像や動画の投稿であっても標準として投稿しても問題ありません。

また、Firstは投稿画面のアイキャッチ画像からアイキャッチ画像を設定できます。

ページ

Firstは固定ページ画面のページ属性のテンプレートからページテンプレートを選択できます。用意されているページテンプレートは通常ページ・サイドバー無しページ・全幅ページの3つです。

また、固定ページ画面のアイキャッチ画像からアイキャッチ画像を設定できます。

アップデート

Firstテーマのアップデートは次の3つの方法から選択できます。

テーマファイルを直接変更している場合、テーマをアップデートするとその変更は失われてしまいます。これを避けるためには子テーマを使用して下さい。

1. オートアップデート（推奨）

Firstテーマはアップデートされると管理画面のダッシュボード→更新および外観で通知されます。ダッシュボード→更新でFirstテーマを選択し、テーマを更新をクリックします。以上でアップデートは完了です。

2. 管理画面からアップデート

あらかじめ新しいFirstのzipファイルをダウンロードしておきます。管理画面の外観→テーマで一旦別のテーマを有効化し、Firstのテーマ詳細をクリックし、さらに右下の削除をクリックします。古いテーマが削除されたら、ページ上部の新規追加をクリックし、さらにテーマのアップロードをクリックします。アップロード画面になったら新しいzipファイルをアップロードします。完了画面になったら有効化をクリックします。テーマの設定は自動で引き継がれます。以上でアップデートは完了です。

3. FTPからインストール

あらかじめ新しいFirstのzipファイルをダウンロードしておきます。FTPでアクセスし、…/wp-content/themes/first/フォルダを削除します。続いてダウンロードしたFirstのzipファイルを解凍し、firstフォルダを…/wp-content/themes/内にアップロードします。管理画面の外観→テーマからFirstテーマの有効化をクリックします。テーマの設定は自動で引き継がれます。以上でアップデートは完了です。

サポートプラグイン

Firstは次のプラグインをサポートしています。

Jetpack

Jetpackはインストール型のWordPressにレンタルブログ型のWordPress.comの機能を追加するプラグインです。Firstは無限スクロールへの対応や、追加ウィジェットのスタイリングが行われています。

Contact Form 7

Contact Form 7はお問い合わせフォームを作成するシンプルかつ柔軟なプラグインです。Firstはフォームのスタイリングが行われています。