サイトHの道 6 ~パンくず設定~

「Breadcrumb NavXT」 プラグインインストール
パンくずを表示するためのプラグイン。

閲覧者からすると、サイト内回遊していくなかで、
今どの順序でどのページにいるか、

運営側からすると、
回遊率を助けることにもなるしSEO対策としても有効。

複雑かついろんなページが存在するサイトをつくる際は
あったほうがいい。

修正箇所
・デフォルトではトップヘージ=サイトタイトルとなっている
⇒これを「ナビゲーションメニュー」の表記に合わせて『HOME』に変更設定

パンくずリストの設定を変更する(Breadcrumb NavXT)

こちらを参考にさせていただきました。
ありがとうございます。

修正箇所
・トップページではパンくずを表示させないコードを設定

Breadcrumb NavXT で、TOPページだけパンくずを表示しな方法  wordpress フォーラム

こちらを参考にしました。

今回は無難にヘッダー表示にしたので
header.php内の下部にコード埋め込み。
フッターでもいいかもと思って試してみたが、後々考える。

single.phpに埋め込んだ場合は単一記事表示のときに、
アーカイブ、カテゴリー、固定ページのときには、それぞれのテンプレートに。

ただ、そこまで細部にこだわりなく、
TOPページ以外の全てのページに表示させてOKだったので、
ヘッダーかフッターに埋め込むのが一番早い。

サイトHの道 5 ~お問い合わせ/404 エラーページ~

「contact form 7」 プラグインインストール
定番のお問い合せフォーム作成プラグイン。
コメントによる書き込みではなく、管理者へのメール送信。

機能も豊富なようで、
スパム防止の簡単なクイズ入力や、サンクスメールもできる。

サンクスメールとは、
送信者からサイト管理人に送られるメールとは別に、
送信者に「あなたのメールはこの内容で確かに送信されましたよ」と
送信者宛にも送ってくれる確認メールのこと。

よくネットショップなどで買い物をしたときにも
自動注文確認メールや、サンクスメール(店主からのまずは挨拶やお礼)が
送信されたりするが、そういう類にも近い。

「404 エラーページ メッセージ修正」
特定URLでアクセスしようとして、該当ページが存在しないときの
エラーメッセージ画面のこと。

googleウェブマスターツールでも拡張ウィジェットがあるようだけれど、
よくわかりそうになかったので断念。
こちら ⇒ 404 ページのカスタマイズ googleウェブマスターツール ヘルプ

WordPressエラーページのメッセージ「おっと、失礼しました」を変更したい 西沢直木のWebサイト


こちらを参考にさせていただきました。
ありがとうございます。

ほんと、プラモデルのように、
ひとつひとつ、大なり小なり、部品やページを組み立てていくよう。

 

サイトHの道 4 ~トップページ新着情報~

「What’s New Generator」 プラグインインストール
トップページに新着情報やお知らせを表示させる。
表示させたいページやカテゴリーを選べたり、
表示順序も公開ベースか更新ベースかを選べたり、
表示件数も設定できる。

Newマークを付ける期間も設定できるので、
サイトの入口で、まずお知らせしたいこと、更新情報などを、
ひと目で見せることができる。
Newマークもオレンジ色で結構目立ってよい。

WordPress BizPlugin プラグイン制作 公式サイト
設定方法も、どういうレイアウトになるかも見れます。
もうひとつの「Post List Generator」という記事一覧を表示させるもの。
これはこのブログで使うことに。
全記事一覧リストとして。

こういう感じにできないかな~?とあれこれ探せば、
まあ大枠でお目にかなうプラグインはだいたい見つかる。

もっとカスタムした使い方や、ちょっと足りない、もうちょっとこうしたい、
そんなときは、自分でコードを書く。

プラグインを使わずに、コードやソースを扱えればいいんだけど、
それができないので、プラグイン。

容量もかさばるし読み込み速度も遅くなるので、
必要以上になんでもプラグインで解決しようとはしないほうがいい、
ということ。

 

サイトHの道 3 ~トップページ ヘッダー/フッター~

ブログサイトではないので、
トップページを独立させてつくろうと決めていた。

いわばTOPページは入口のようなもの。
開いた瞬間に情報満載の複雑なページもできるけれど、
サイトHではシンプルな入口にしたかったので。

トップページは大きくサイトを象徴する画像と、
どういうサイトなのかというナビゲーションメニューやサイトマップ、
新着情報やお知らせ、リンク一覧などがあればいい程度。

「トップページの画像作成」
お手製よろしく自作してみた。
意外にシンプルで気に入っている。

「ナビゲーションメニュー」
イメージボードを見ながら、サイトに必要になってくるであろう
ページ(固定ページ)やカテゴリーを作ってしまう。
ロジックツリーのように階層化していく。

ここでパーマリンク設定のときに学んだスラッグが活躍する。
URLに記載されるのは各ページやカテゴリーの名称ではなく
スラッグに記載した名前。
なので、きちんと英語で入力しておく。

こうしておけば、ゆくゆくページ・カテゴリー名を変更しても
スラッグの英語表記は変わらないので、URL上問題ない。

例えば、今回初期段階では、すべてカテゴリーを英語表記している。
ホームはHOME(スラッグ表記:home)
ブログはBLOG(スラッグ表記:blog)
後々、やっぱり日本語のほうがわかりやすいかなと思った場合、
名称だけ変えて、スラッグは変更しなくて大丈夫なので、
URLに影響してくることはない。

これを学んだのは素人としては大きい。
webに詳しい人は当たり前のことかもしれませんが。

「ヘッダー編集」
TOPページは画像をメインに、そこにサイト名も明記している。
ヘッダーテキストは表示しないように。

「フッター コピーライト表示」
コピーライト(著作権)の意味や必要性、
やり方や、年度の自動更新コードなど。

フッターに設置しているCopyright表記の年度は2013年に変更しよう SEOのホワイトハットジャパン

wordpress3.5.1 Twenty Twelveカスタマイズ追記 ただ今子育て(られ)真っ最中☆

このあたりを参考にさせていただきました。
ありがとうございます。

 

サイトHの道 2 ~wordpress初期設定~

「wordpressテーマ(テンプレート)選び」
当初いろいろデザイン性に凝ったテーマを選ぼうと。
なんといっても見栄えがいいので。
自分でデザイン的なカスタムできないし。

でも・・・
イメージボードのサイト構造を眺めてたら、
やっぱり箱(テーマ)はシンプルなほうがいいかなと。
変に最初から凝っているつくりだといじりにくい。
自分の思うように修正できないこともある。

このブログ引っ越しの時にもあったけれど、条件として
・汎用性が高くカスタムしやすい web公開の修正実例も豊富
・レスポンシブ(PC/タブレット/スマホ)対応している

そうなると、やっぱりTwenty Twelveがいいのかな、ということに。
ブログとは分けてもおもしろかったんだけど、いいか。

次に具体的にサイトをつくる前に、wordpressの初期設定を。

「一般設定」
サイトアドレスを自分の独自ドメインに変更させたり、
メールアドレスを設定したり。

「表示設定」
検索エンジンにインデックスしてもらうようにしておく。
新しいサイトを認知してもらうまでに時間がかかるし、
アクセスが増え始めるのにも2-3ヶ月かかったりするので、
先にならしておく、というイメージなのかな。

「メディア設定」
画像の初期設定を決めておく。

「パーマリンク設定」
勉強になった。
サイト構造とどうつくっていきたいかを考えて、今回は、
カスタム構造で、[/%category%/%post_id%/]という、
カテゴリー+ページNoを表示するアドレスに。

これは本当に最初にしか設定できない大切なこと。
できるけれど、あとあと修正すると、検索エンジンにエラーが起こる。
各ページのURLが変わってしまうということなので。

固定ページやカテゴリー、投稿記事ごとのスラッグの意味も
なるほど理解しました。

ちなみにこのブログの場合のパーマリンク、つまり個別アドレスは、
サイトアドレスの次に、日付+投稿タイトル(日本語)となっている。

検索エンジン結果では、そう表記されているけれど、
URLをシェアしようと思ったときなどは、日本語は意味不明な
英数字のアルファベットに置き換わるので、やたら長くなる。

たまにそういう経験ないですか?
アドレスコピーして、どこかに貼りつけた時に、すごく長いURLに。

サイトHの場合は、スラッグを活用して、
各ページのURLをシンプルに、パンくずともリンクしてるような、
わかりやすい表記にしたかった。

もう1点。こちらのほうがすごく大切。
日付やタイトルなどを公開後修正していく可能性があったので。
もしこれをしてしまうと、日付+タイトルのアドレスだと、大変なことになる。
URLにも変更がかかるので「ページが存在しません」状態に。

なので、初期設定してから概ね変更かけない、
カテゴリーのスラッグや、日付に影響されないページIDを
パーマリンクに設定することで、柔軟に対応できるようになる。

WordPressのパーマリンクはどの形がベストなのか~日本語URLのデメリット~ パシのSEOブログ

こちらを参考にさせていただきました。
非常にわかりやすく解説されてあります。
ありがとうございます。

「Akismet」 プラグイン設定
スパムコメントをブロックしてくれるプラグイン。
最初から入っている。
APIキーを取得して設定終了。