WordPress Ashe （アッシュ）テーマのカスタマイズ ～後編～
目次
前回からのつづき
WordPressに海外製のテーマAshe（アッシュ）の無料版をインストールした時の備忘録。
前回はインストールからおすすめリンクまでの記事だったので今回はその後編とする。
また今回はカスタマイズメニューの”ブログページ”以降を対象とする。
ブログページ
ブログページ（投稿一覧ページ）の表示形式に関する設定を行う。
General
|
投稿説明 |
投稿一覧での本文の表示方法に関する設定
|
||||||
|
投稿ページネーション |
投稿一覧ページが複数ページある時のページネーションの仕方
|
Post Elements
投稿の何の項目を表示対象にするかの設定。
|
カテゴリーを表示する |
チェックするとカテゴリーが表示される（表示例参照） |
|
日付を表示する |
チェックすると日付が表示される（表示例参照） |
|
コメントを表示する |
チェックするとコメントが表示される（表示例参照） |
|
先頭文字を大きくを表示 |
チェックすると本文抜粋の先頭文字が大きく表示される（表示例参照） |
|
投稿者を表示 |
チェックすると投稿者が表示される（表示例参照） |
|
Show Facebook |
チェックするとFacebookへのシェア用アイコンが表示される（表示例参照） |
|
Show Twitter |
チェックするとTwitterへのシェア用アイコンが表示される（表示例参照） |
|
Show Pinterest |
チェックするとPintrestへのシェア用アイコンが表示される（表示例参照） |
|
Show Google Plus |
チェックするとGoogle Plusへのシェア用アイコンが表示される（表示例参照） |
|
Show Linkedin |
チェックするとLinkedinへのシェア用アイコンが表示される（表示例参照） |
|
Show Reddit |
チェックするとRedditへのシェア用アイコンが表示される（表示例参照） |
|
Show Tumblr |
チェックするとTumblrへのシェア用アイコンが表示される（表示例参照） |
|
関連投稿 – 表示 |
ヘルプによると”関連”を選択するとブログページの記事毎に「これも好きかも」と関連記事が表示される様だが、記事数が少ない為なのか当方の環境では表示されなかった |
個別投稿
記事詳細ページの表示形式に関する設定を行う。
Post Elements
|
カテゴリーを表示する |
チェックするとカテゴリーが表示される（表示例参照） |
|
日付を表示する |
チェックすると日付が表示される（表示例参照） |
|
コメントを表示する |
チェックすると日付が表示される（表示例参照） |
|
投稿者を表示 |
チェックすると投稿者が表示される（投稿ページ下部表示例参照） |
|
投稿者の説明を表示 |
チェックすると投稿者の説明が表示される（投稿ページ下部表示例参照） |
|
関連投稿 – 表示 |
”関連”を選択すると記事の下に「これも好きかも」と関連記事が表示される ※こちらは関連記事が表示された
|
ソーシャルメディア
TOPバー※に自分の利用しているソーシャルメディアへのアイコンを最大４つまで表示させる事ができる。
|
新しいウィンドウでソシアルリンクを開く |
チェックをするとソーシャルメディアアイコンをクリックした時に新しいウィンドウで開く |
|
Social Icon #1～#4 |
ソーシャルメディアアイコンを最大４つまで指定できる |
|
アイコンを選択 |
プルダウンの中からSNSのアイコンを選択する 2019年2月27日現在、下記の６２種類のアイコンがあった
|
|
URL |
アイコンをクリックした時のリンク先を指定する 自SNSのページを設定する |
タイポグラフィ
フォントファミリーを指定する。
但し、ここで指定したフォントが反映されるのは英字のみなので日本語についてはWebフォントを使ってフォントを変えるのが良いと思う。
Logo
|
フォントファミリー |
ロゴのフォントファミリーを指定する 但し指定したフォントが反映されるのは英字のみ |
Navigation
|
フォントファミリー |
ナビゲーションのフォントファミリーを指定する 但し指定したフォントが反映されるのは英字のみ 上記の例だと”WordPress”の文字列のみフォントファミリーが反映される |
|
イタリック |
チェックをするとイタリックになる |
|
大文字 |
チェックをすると大文字になる |
ページのフッター
フッターの表示に関する設定を行う。
|
著作権テキスト |
フッターに表示する著作権のテキストを設定する $year（年）、$copy（Copyrightのマーク）などの変数が使用できる |
|
スクロールのトップボタンを表示する |
チェックをするとトップに戻るアイコンが表示される |
プリローダー
|
アニメーションのプリロード |
チェックをするとページを表示する前にアニメーションが表示される この後にページが表示される 表示されるアニメーション
|
レスポンシブ
この設定はモバイル表示の時のみ適用される。
|
上部メニューとメインメニューを結合する |
チェックをすると上部メニューとメインメニューが結合されるのだと思うのだが当方の環境では違いは見られなかった 誰か分かる方がいれば教えてください |
|
特集スライダーを表示する |
チェックをするとモバイル環境でおすすめスライダーが表示される おすすめスライダーの表示設定でチェックを入れると、パソコンではおすすめスライダーが表示されるがモバイルではそのままでは表示されない こちらのチェックボックスをチェックする事によりモバイル環境でもおすすめスライダーが表示される様になる
|
|
特集リンクを表示する |
チェックをするとモバイル環境でおすすめリンクが表示される おすすめリンクの表示設定でチェックを入れると、パソコンではおすすめリンクが表示されるがモバイルではそのままでは表示されない こちらのチェックボックスをチェックする事によりモバイル環境でもおすすめリンクが表示される様になる
|
|
関連する投稿を表示する |
チェックをすると記事の下部に「これも好きかも」の関連リンクが表示される 個別投稿の関連投稿ー表示で関連を選択すると、パソコンでは記事の下部に「これ好きかも」関連リンクが表示されるがモバイルではそのままでは表示されない こちらのチェックボックスをチェックする事によりモバイル環境でも「これ好きかも」が表示される様になる
|
メニュー
メニューについてはWordPressの他のテーマと同様の設定なので割愛
ウィジェット
ウィジェットについても設定方法は基本的に他のテーマと同様だがashe独特のウィジェット表示位置として「代替サイドバー」があった。
代替サイドバー
メインメニューの左に表示されるハンバーガーメニューのアイコン。
クリックすると左から代替サイドバーが表示される。
その他
ホームページ設定と追加CSSも他のテーマと同様なので割愛。
以上でAsheの無料版を色々といじってみた時の備忘録を終わりにする。
はじめまして。Asheの解説しているサイトが少なくて、とても助かりました。
メインナビゲーションのところの「logo」についてなのですが、数値を調節しても幅が変わらず…
元画像のサイズに合わせられる仕様なのでしょうか？わかる範囲で教えていただければ幸いです。よろしくお願いいたします。
ふかひれさん こんにちは。
こちらの環境では「ロゴの幅」の数値を変えればそれに応じて幅が変わりますね。
幅30のロゴ
幅70のロゴ
当サイトのスマホ版サイトだとうまく適応されないのかもしれないです。ありがとうございます。
もう一つ伺いたいのですが、ページ下部の投稿者の部分はどこから引用しているかご存知ですか？？
お手数をおかけしますが教えていただければ幸いです。
スマホの方は80×80のサイズ固定にしているみたいですね。
レスポンシブデザインでWindowの横幅がある一定以上の幅の時だけ設定したサイズが反映されるようにしているテーマの様です。
ページ下部の投稿者ですがWordPressのメニューのユーザ、プロフィール、プロフィール情報で設定できます。