マンツーマンの個人教授です少人数で初心者の方向けのホームページ制作教室、ワードプレスセミナーを開いています。Tips1やさしいビジネスサイト制作教室ではワードプレスをホームページ形式で使う方が多いのですが、ブログとして使いたいいう方もいらっしゃいます。その場合、無料のブログテーマとして「Simplicity」「Stinger」「Mesoclumn」などをお勧めしています。ブログテーマとして簡単にカスタマイズが出来てとても便利です。CSSを書かなくても提供しているカスタマイズのオプションを調整していけば、かなり「自分好みのサイト」に仕上がっていきます。カスタマイズは管理画面の「外観」-「カスタマイズ」から設定できます。左のサイドバーに現れるカスタマイズ項目があまりにも多く、各項目を展開して内容を確認するのが大変だと感じました。このため、各項目を一覧表にして全体を把握できるように説明してみましたのでお役立てください。「Simplicity1」と「Simplicity2」があります。この記事では「Simplicity2」2.4.0を使って説明しました。本家のサイトはコチラからどうぞ。・サイトのタイトル、キャッチフレーズ・・・WP「設定」と同じ・サイトアイコンはサイトのアプリとブラウザーのアイコンとして使用されます。ピクセル以上である必要があります。2.色テーマで使用している色を変更します。・背景色:全体の背景色です。(デフォルト色:#ffffff)・・WPの当初「カスタマイズ」と同じでは?・リンク色:通常のリンク色です。(デフォルト色:#2098a8)・リンクホバー色:マウスカーソルが乗ったときのリンク色です。いっぱいに広がるヘッダーの背景色です。(デフォルト色:transparent)・ヘッダー内側背景色:ヘッダー内側の背景色です。(デフォルト色:transparent)・サイトタイトル色:サイトタイトルの文字色です。(デフォルト色:#222222)・サイト概要色:サイトキャッチフレーズの文字色です。(デフォルト色:#777777)・モバイル時ヘッダー背景色:画面幅いっぱいに広がるモバイルヘッダーの背景色です。(デフォルト色:transparent)・モバイルサイトタイトル色:モバイル時のサイトタイトルの文字色です。(デフォルト色:#222222)・モバイルサイト概要色:モバイル時のサイトキャッチフレーズの文字色です。(デフォルト色:#777777)・グローバルナビ色:グローバルナビ(メインメニュー)の背景色です。(デフォルト色:#f7f7f7)・グローバルナビリンク色:グローバルナビリンクの文字色です。(デフォルト色:#111111)・グローバルナビリンクホバー色:マウスカーソルが乗ったときのメニュー項目の背景色です。(デフォルト色:#dddddd)・メニューボタン色:モバイル用メニュー表示ボタンのアイコン色です。(デフォルト色:#333333)・メニューボタン背景色:モバイル用メニュー表示ボタンの背景色です。(デフォルト色:transparent)・トップへ戻るボタン色:トップに戻るボタンのアイコン色です。(デフォルト色:#ffffff)・トップへ戻るボタン背景色:トップに戻るボタンの背景色です。(デフォルト色:#aaaaaa)・フッター色:フッター部分の背景色です。(デフォルト色:#555555)3.ヘッダーヘッダーで使用する画像や、ロゴ、グローバルナビの幅に関する設定です。ピクセルを推奨しています。・ヘッダーの高さpx(デフォルト:100):画面トップからグローバルメニューまでの高さです。(※ヘッダー画像の設定をする前に高さの設定推奨)・ロゴ画像:タイトルテキストの代わりとなるロゴ設定します。(※表示させるには「ロゴを画像にする」を有効にする必要あり)・ロゴを画像にする:タイトルロゴを画像にするか。チェック・ヘッダー外側背景画像:画面幅いっぱいに広がるヘッダー画像を設定します。(※画像の高さは高めに設定しておいてください)・グローバルナビを横幅いっぱいにする:グローバルナビを画面幅いっぱいに広げて「ヘッダー外側背景画像」に合わせるか。チェック(※「色→グローバルナビ色」の設定も併せて行う必要があるかもしれません)・ヘッダーの高さpx(デフォルト:0):モバイルでの画面トップからグローバルメニューまでの高さです。(※0にするとデフォルト設定になります)・モバイルヘッダー背景画像:画面幅いっぱいに広がるモバイルヘッダー画像を設定します。背景画像は・・・WPの当初「カスタマイズ」と同じ5.スキン手軽にデザインを変更することができます。[P]マークがついているものは、フォルダ内のCSSファイルを結合して適用表示するパーツスキンです。※スキンで設定されたスタイルは親テーマ・子テーマで設定されたものより優先されます。以下の18種類のデザインが用意されています。自分でスキンを作成し、FTPでサイトにアップロードして利用することもできます。・ビジネスメニュー:色はデフォルトでメニューの形が四角で区切られる・ラージピクチャーヘッダー:ヘッダーが木目の画像付き・ラージピクチャー(ストロベリー)ヘッダーがイチゴの画像付き・ホワイティー:デフォルトに近い。メニューの枠線が無い・バブルラップメニュー(サブメニューなし):メニューが黒色で変化が付く・オレンジメニュー(サブメニューなし):メニューがオレンジで変化が付く・1カラム:サイドバーが無くなる・Monokai:真黒なムード・スキンテンプレート(独自カスタマイズ用):変化なし・子テーマスキンテンプレート(独自カスタマイズ用):変化なし6.レイアウト(全体・リスト)サイト全体や一覧リストページのレイアウトに関する設定です。・完全レスポンシブ表示を有効:パソコンとモバイルでシームレスな完全なレスポンシブデザイン表示になります。・PCでサイドバーをレスポンシブ表示:PC表示時にサイドバーをレスポンシブ表示するか。オフにするとレスポンシブ表示されません。サイトタイトルの中央寄せ:サイトのタイトルをヘッダーの中央にするか。グローバルナビを表示:グローバルナビ(メインメニュー)を表示させたくないときはオフにしてください。・一覧リストのスタイルトップページ一覧(インデックス)ページの表示スタイル設定。画像縦横比保存(要再生成)・固定ページも一覧リストに含める:固定ページを一覧リスト(インデックス)に含めるか。・エントリーカード全体をリンク化:インデックスリスト・関連記事のエントリーカードやブログカード全体をAタグで囲ってリンク化するか。・サムネイル表示:サムネイルを表示するか。サムネイル角のスタイル。1丸めない(デフォルト)2角を丸める3円形にする・抜粋文字数(デフォルト:70):インデックスリストや関連記事、ブログカードで表示される抜粋文字の文字数を設定します。・抜粋の末尾文字(デフォルト:...):抜粋文の末尾に付属する文字列を設定します。・抜粋に「メタディスクリプション」項目を利用:記事一覧・ブログカードのスニペットに投稿管理画面の「SEO設定」項目にある「メタディスクリプション」テキストを使用します。「メタディスクリプション」が入力されていない場合は「抜粋」が使用されます。(※双方とも未入力の場合は記事本文冒頭の抜粋文)・サイドバーの幅を336pxに(デフォルト300px):サイドバーを「レクタングル(大)」幅に設定します。(※ヘッダー画像を既に設定している場合は要再設定)・サイドバーの背景を白色に:サイドバーの背景色を白色に設定します。(※背景画像などを設定して、サイドバーが見づらくなったときなどに)・サイドバーを左側に表示:サイドバーを左側に表示するようにレイアウトを変更します。・検索ボックスのスタイル:検索ボックスのデザイン設定。・ページネーションタイプ:インデックス一覧リストのページ送りのタイプ設定です。1レスポンシブ(デフォルト)2旧ページネーション・フッターを背景色と同じにする:フッターを透過色にして背景を表示します。・メニューボタンのアイコン(デフォルト:fa-bars):メニュー表示ボタンのアイコンフォントを設定します。※モバイルや、レスポンシブ表示になった時に表示されるメニューボタン。いわゆるハンバーガーアイコン表示で、メニュー項目のアイコンではありません。アコーディオンツリーメニューのアイコンは変更できません。トップへ戻るボタンの表示:トップへ戻るボタンを表示するか。トップへ戻るボタンのアイコン(デフォルト:fa-angle-double-up)トップへ戻るボタンのアイコンフォントを設定します。Awesomeから取得します)・トップへ戻るボタンに画像を指定:こちらに画像が指定されている場合は、アイコンフォントが画像に入れ替わります。・カレンダーに枠線を表示:カレンダーウィジェットに枠線を表示します。・404イメージ:404ページに表示するイメージを設定してください7.レイアウト(投稿・固定ページ)投稿・固定ページのレイアウトに関する設定です。・本文文字サイズ(全角文字数):パソコン表示時の本文文字サイズを設定します。114px(1行48文字くらい)215px(1行45文字くらい)316px(1行42文字くらい:デフォルト)417px(1行40文字くらい)518px(1行37文字くらい)619px(1行35文字くらい)・長い単語を必要に応じて改行する:必要に応じて長い単語やURLを要素からはみ出さないように改行します。この機能を有効にすると単語の途中で改行されることもあります。・モバイルで<br>を表示:画面幅の狭いモバイル端末でbr改行を表示するか。・投稿日の表示:投稿日を表示するか。(※一覧リストにも表示されます。Consoleで構造化データエラーが出る可能性があります。)・投稿日と現在との時間差を表示:現在から投稿日を差し引いた人間の感覚的な時間差を表示します。・更新日の表示:更新日を表示するか。Consoleで構造化データエラーが出る可能性があります。)・カテゴリ情報の表示:カテゴリ情報を表示するか。(※一覧リストにも表示されます)・コメント数の表示:コメント数リンクを表示するか。(※コメントの設定でコメントを表示にしていないと表示されません。)・タグ情報の表示:本文フッター部分にあるタグ情報を表示するか。・投稿者情報の表示:本文フッター部分にある投稿者情報を表示するか。Consoleの構造化データエラーが出ます。IDに:投稿者にTwitterのIDリンクを表示します。ID設定がされている必要があります。)・編集リンクの表示:投稿・固定ページの管理画面に直接アクセスするための編集リンクを表示するか。・本文先頭にアイキャッチ画像を表示:投稿・固定ページ管理画面で設定したアイキャッチを自動で本文トップに挿入するか。←現在これにチェック入り。・先頭のアイキャッチにキャプションを表示:先頭のアイキャッチにキャプションが設定されているとき表示するか。(※「本文先頭にアイキャッチ画像を表示」設定が有効の場合のみ)・引用部分の幅を広げる:引用部分の横幅を広げ表示エリアを増やします。・大きな表は横スクロール:横幅の大きな表(TABLE)は、横スクロール表示するようにして、モバイル端末などでも画面の横揺れを防ぎます。・関連記事の表示:本文下の関連記事を表示するか。・関連記事表示タイプ:関連記事の表示スタイルの設定です。12)・関連記事の関連付け:関連記事をカテゴリに関連付けるか、タグに関連付けるか。1カテゴリに関連付け(デフォルト)2タグに関連付け関連記事表示数(デフォルト:10):関連記事の表示数を設定します。ナビの表示:ページ送りナビを表示するか。ナビタイプ:ページ送りナビの表示スタイルの設定です。1デフォルト2サムネイル付き・固定ページにパンくずリストを表示:固定ページにページの親子関係を利用したパンくずリストを表示するか。8.レイアウト(モバイル)モバイルのレイアウトに関する設定です。・タブレットはモバイル表示:タブレット端末をモバイルとして表示するか。・モバイルメニュータイプ:モバイル時、メニューボタンを押したときのスタイルです。スライドインライト(ボタン下)6スライドインダーク(ボタン上)7スライドインダーク(ボタン下)・スライドインメニューを日本語表示:スライドインメニューを日本語で表示するか。(※モバイルメニュータイプをスライドイン選択しているとき。・モバイルで1ページに表示する最大投稿数(デフォルト:10):モバイルのインデックスリストに表示される最大投稿数を設定します。・モバイル本文文字サイズ:主にスマホ表示時の本文文字サイズを設定します。投稿・固定ページの本文で使用されている画像に関する設定です。・アイキャッチを自動設定:本文に最初に出てくる画像を利用してアイキャッチを自動設定するか。←現在これにチェック無し。※7.レイアウト(投稿・固定ページ)との関係参照(※サーバーのphp.iniのallow_url_fopenがOffの時は外部サーバーから画像を取得できない可能性があります。Loadを利用して本文にある画像を、表示するタイミングで読み込みます。Loadのエフェクトを有効:フェイドインエフェクトを有効にするか。Loadで読み込むタイミング:ページスクロールのどのタイミングで画像を読み込むかを設定します。・画像リンク拡大効果のタイプ:ライトボックス(画像拡大効果)のタイプを指定します。それぞれは、jQueryライブラリ名です。詳細はリンク先を参照してください。Lightbox、Lity1拡大効果なし2Lightbox3Lity(軽い)・画像効果:本文画像の枠線の設定です。1なし(デフォルト)2ボーダー(枠線)3シャドー(影)・Alt属性値をキャプション表示:画像の上にマウスホバーするとAlt属性値を利用してキャプションを表示するかどうかを設定します。1表示しない(デフォルト)2管理者のみ(ログインユーザーのみ)3全てのユーザー10.SEOSEOに関する設定です。(※既にプラグインを使用している場合は設定をオフにしてください)11.SNSソーシャルサービスのシェアボタンやフォローボタンに関する設定です。Consoleに関する設定です。広告の表示や配置に関する設定です。14.ブログカード(内部リンク)サイト内にある投稿・固定ページへのリンクをブログカード化できる機能が標準で備わっています。サイト内のURL(内部リンク)を入力するとブログカードとして表示します。「ブログカード」とは、ブログに掲載したい記事のタイトルや概要、アイキャッチ画像などを読みやすくまとめて表示する埋め込み形式です。以下のようにリンク先が表示されます。本文記事の1行にサイト内URLのみが記載されていたらブログカード化する1行にURL以外も記載されているとブログカード化しないカード化されるのは「投稿ページ」「固定ページ」のみあくまで自サイトURLのみで他サイトのURLではカード化されないWordPressエディターなどで編集していて、その本文中の1行を「サイト内URL」のみで使用していれば、URLがブログカードに置き換わるという仕様です。Simplicityのカスタマイズ項目一覧15.ブログカード(外部リンク)外部リンクブログカードに関する設定です。ブログカード自体の使い方はブログカードの利用方法を。外部リンクブログカードに関する設定は外部ブログカードの設定を参照してください。ワードプレス「カスタム投稿」の超かんたん設定16.ソースコードソースコードのハイライト表示の設定です。ハイライト表示には、highlight.jsを利用しています。詳しくは、ハイライト設定を参照してください。17.コメントコメント表示欄・入力欄に関する設定です。Pages)に関する設定です。投稿ページをモバイル上で高速表示させるための仕組みです19.テーマ内テキストテーマ内で使用されている定型文を変更することができます。・パンくずリストのホームを変更(デフォルト:ホーム)パンくずリストの「ホーム」のテキストを変更します。設定は、投稿と固定ページ両方のパンくずリストに反映されます。・関連記事タイトルを変更(デフォルト:関連記事)関連記事のH3見出しを変更します。・コメントタイトルを変更(デフォルト:コメント)コメント欄ののH3見出しを変更します。・返信コメントタイトルを変更(デフォルト:コメントをどうぞ)コメントを促すテキスト変更します。・コメントサブミットラベルを変更(デフォルト:コメントを送信)コメント送信ボタンテキスト変更します。・コメント入力凍結時のメッセージ(デフォルト:コメントの入力は終了しました。)コメント入力欄を非表示にした時のメッセージを変更します。・匿名のユーザー名を変更(デフォルト:匿名)匿名でコメント投稿するユーザーのデフォルト名を変更します。・「記事を読む」の変更(デフォルト:記事を読む)一覧リストの「記事を読む」リンクのテキストを変更します。・「続きを読む」の変更(デフォルト:続きを読む)moreタグ以降の「続きを読む」リンクのテキストを変更します。・リストタイトルの「一覧」を変更(デフォルト:一覧)インデックスリストのタイトルに含まれる「一覧」部分を変更します。・日付表示のフォーマット(デフォルト:Y/n/j)投稿日や更新日の日付表示フォーマットを変更します。・一覧:年月日のフォーマット(デフォルト:Y年m月d日)インデクスリストの年月日表示フォーマットを変更します。・一覧:年月のフォーマット(デフォルト:Y年m月)インデクスリストの年月表示フォーマットを変更します。・一覧:年のフォーマット(デフォルト:Y年)インデクスリストの年表示フォーマットを変更します。・検索ボックスのプレースホルダー(デフォルト:ブログ内を検索)検索ボックスに表示されるテキスト変更します。・見つからなかった時のメッセージ(デフォルト:記事は見つかりませんでした。)記事が見つからなかった時に表示されるテキスト変更します。アドミンバー(管理バー)に独自機能を追加する設定です。21.その他ファビコンや、アップルタッチアイコン、その他の設定がまとめてあります。コメントをキャンセルメールアドレスが公開されることはありません。*サイト上に表示された文字を入力してください。(1)講習予約について現在、講師の都合により臨時休講しています。ご迷惑をおかけしますがよろしくお願いします。新規受講は現在受付けてません。title講習を始めるに当たり「事前アンケート」の記入をお願いします。2-5-3マンツーマンのレッスンです。自分専用のホームページアドレスを使う場合は独自ドメインを事前に取得しておくと効率的です。事前にご自分でレンタルサーバーの契約をしておくと、サイト制作がスムーズです。※ロリポップがおすすめです。MOUSE私も十数年使っています。日本製で安いし使いやすい。technology.。