hueman テーマのカスタマイズ　フロントページのコンテンツ編　～WordPressでブログを始める～

Huemanをバージョンアップしたら新しい設定項目が追加されていたので追記

ホーム（トップページ）のカラムレイアウトを全体設定とは別に設定することができる

以下の設定が可能

• 全般レイアウトを継承（これを選択した）
• １カラム
• ２カラム左コンテンツ
• ２カラム右コンテンツ
• ３カラム中央コンテンツ
• ３カラム左コンテンツ
• ３カラム右コンテンツ

ホームページ（トップページ）に何を表示するかの設定

”最近の記事”を設定した。

その他には「投稿ページや固定ページを表示しない」と「静的ページ」がある。

静的ページを選択すると固定ページを２つ設定できるようになる。

一方にホームページ、もう一方に投稿ページを指定する。ホームページ兼ブログの様な使い方をする時に便利かも

ブログのカスタム見出しを表示します

チェックした。

下記のブログの見出しとサブ見出しを表示する

ブログの見出し

”そう備忘録”を設定した。

ブログのサブ見出し

”blog”を設定した。

Apply a category filter to your home / blog posts

Huemanをバージョンアップしたら新しい項目が追加されていたので追記

ホームページでブログ一覧を表示する際に特定のカテゴリだけを表示するフィルターを設定できる

スタンダードリストを使用

チェックしなかった。

チェックすると過去記事の表示が１列表示（左にサムネイル、右に本文の抜粋）になる

Display featured images in their original dimensions in post lists

Huemanをバージョンアップしたら新しい項目が追加されていたので追記

この項目をチェックするとテーマの最適化された画像ではなく投稿した元画像のサイズで表示されるらしい（未検証）

このブログはEasy FancyBoxを使っている

1. 大きめの画像でアップ
2. 記事中は最適化されたサイズで表示
3. クリックするとEasy FancyBoxで拡大表示

としているので未チェック（最適化して表示）にした

抜粋の長さ

３４（文字）。

本文の先頭３４文字が抜粋されてサムネイルの横に表示される。

抜粋用の文章を別に書くことも出来るらしい

おすすめ投稿を一番上に表示する

チェックした。

おすすめのカテゴリーを選択

カテゴリーの中からオススメのカテゴリーを１つ選択する。

まだ何も選択してない。

おすすめ投稿数

とりあえず１を設定した。

投稿コンテンツをすべて表示

チェックしていない。

おすすめ投稿のスライドショーをアニメーションする

チェックしていない。

おすすめ投稿を複数指定してここをチェックするとおすすめ投稿が次々に自動でスライドして表示される。

トップページで複数の写真をつかったサイトでよく見るやつ。

カルーセルというらしい。

これはそのうちに試してみたい。

おすすめ記事と投稿一覧の両方に記事を表示

チェックしていない。

ヘルプでも同じ記事が二重に表示されてしまうのでオススメしないって書いてあるし。。。

「WEBページデザイン」「サイト情報」と同じ設定項目の為、割愛。

huemanを使っていて最初戸惑ったのが同じ設定項目が複数のメニューからアクセスできること。

便利と思うのか紛らわしいと思うのか。。。（自分は後者でした）

ヘッダーにロゴを表示

同上

サイト情報（タグライン）を表示

同上

Apply your custom background colors in priority for the topbar and the mobile menu

トップバーとモバイルメニューに設定した背景色を優先的に適用する

※Hueman Proで背景画像を設定する時のスイッチと思われる

オフにしている

トップバーの背景

元の色（#121d30）から変更していない

色パレットより指定する

ヘッダーの背景

元の色（#454e5c）から変更していない

ヘッダーメニューの背景

元の色（#454e5c）から変更していない

モバイルメニューの背景

元の色（#454e5c）から変更していない

スクロール時にトップバーとモバイルメニューを半透明にする

チェックした。

チェックした。

チェックするとヘッダータイトル、ロゴ、サイト説明、ヘッダー広告ウィジェットが無効化される。

ヘッダー画像の上にロゴかサイトタイトルとキャッチフレーズを表示する

チェックした。

以前の記事で設定したサイトのタイトルとキャッチフレーズを表示する。

新規画像

新規画像をクリックして画像を追加した。

画像のサイズは 1380 × 280が推奨との事。

複数のヘッダー画像を登録しておすすめヘッダーをランダムに表示する事もできる。

ホームのコンテキスト内の背景に全幅のヘッダーを表示するかどうかの指定と思われる

以下の３種類の設定が可能だが違いが分からなかった

• Inherit（継承）
• Yes
• No

チェックした。

チェックするとトップ画像の上にメニューが表示できる。

メニューの作成については別記事で。

ちなみにメニューが設定されていない場合、デフォルトのページメニューが使用されるらしい。

デスクトップデバイス : スクロール時のトップメニューの表示/非表示設定

「上スクロール時に表示」を選択した。

下スクロール時にメニューが隠れて上にスクロールするとメニューが現れる。

• 上スクロール時に表示
• スクロール時に非表示
• 常に表示

が選択可能

デスクトップデバイス : 検索フィールドを表示

「トップメニューの中に検索フィールド表示」を選択した。

メニューの右端に虫眼鏡アイコンが表示された。

• トップメニューの中に検索フィールド表示
• 検索フィールドなし
• ヘッダーメニューの中に検索フィールド表示

が選択可能

モバイル用に使うメニューを選択

「トップバーメニュー」を選択した。

モバイルの時の右上にハンバーガーボタン（横三本線のやつ）を押した時に表示されるメニューを設定する。

モバイル端末 : スクロール時のトップメニューの表示/非表示設定

「上スクロール時に表示」を選択した。

デスクトップデバイスと同じ

• 上スクロール時に表示
• スクロール時に非表示
• 常に表示

が選択可能

モバイルのメニューボタンスタイル

「アニメーション付き」を選択した。

• アニメーション付き
• シンプル

が選択可能

しかし手元のAndroid端末、NuAns NEO [Reloaded]では違いが分からなかった。

どこかに違いがあるのだとは思うのだけれども。。。

モバイル端末 : クリックでサブメニューを展開する

モバイル端末でハンバーガーメニューをクリックした時にサブメニューを展開するかどうか

サブメニューは存在しないが自動展開をさせたいので未チェック

モバイル端末 : 検索フィールドを表示

チェックした。

ハンバーガーボタンを押すと一番上に検索フィールドが表示された。