WordPressの無料テーマAttitudeの使い方(固定ページ活用方法)

18

1.WordPressの無料テーマAttitudeの使い方
2.WordPressの無料テーマAttitudeの使い方(固定ページ活用方法)
3.WordPressの無料テーマAttitudeの使い方(フッターエリア使用方法)

前回に引き続き、WordPressの無料テーマAttitudeの使い方を
説明していきたいと思います。
今回は固定ページを作成しトップへ展開するところまでを説明します。
前回と同様の完成サイトのトップページを元に説明していきます。

制作サイト

業種:歯科医院
ページ数:10ページ程度

グローバルメニュー
・トップページ
・院長のあいさつ
・診療科目
—一般歯科
—小児歯科
—口臭歯科
—予防歯科
—歯周病
—ホワイトニング
・初めての患者様
・アクセス
・お問い合わせ

28

 

固定ページの作成

下記のページを固定ページで作成します。
ダッシュボード / 固定ページ /

・院長のあいさつ
・一般歯科
・小児歯科
・口臭歯科
・予防歯科
・歯周病
・ホワイトニング
・初めての患者様
・アクセス
・お問い合わせ

固定ページにはアイキャッチ画像を設定してください。

 

院長あいさつ、診療科目、ご案内、新着情報

 

19

 

1.院長あいさつ
ダッシュボード / 外観 / Theme Options / Advance Options / Home Slogan Options

スライダー下に院長あいさつを掲載します。
キャッチコピーを別で作成し、
「院長あいさつ」の固定ページにリンクをしています。

20

・Disable Slogan Part
表示の有無

・Slogan Position
表示の位置
Above Slider → スライダーの上
Below Slider → スライダーの下

・Home Page Slogan1
キャッチコピー

・Home Page Slogan2
サブコピー

・Redirect Button Text
ボタン文字

・Redirect Button Link
ボタンリンクURL

 

メインコンテンツ
ダッシュボード/ 外観 / ウィジェット

診療科目、ご案内、新着情報を掲載します。
ウェジットを使い掲載する固定ページ設定します。

「 カスタムウィジェット画面」に移り「Business Page Sidebar」にウェジットパーツをドラッグ&ドロップします。
Theme Horse:Services → 診療科目
Theme Horse: Featured Widget → ご案内
最近の投稿 → 新着情報

21

 

2.診療科目
ダッシュボード / 外観  / ウィジェット / Business Page Sidebar / Theme Horse:Services

Theme Horse:Servicesの「▼」を押すと項目が出てきます。
固定ページを6件まで設定することができます。
診療科目の一覧を作りたいので、作った固定ページをセットし保存します。

22

トップページには、固定ページのアイキャッチ、タイトル、本文の抜粋が
掲載されます。

23

 

3.ご案内
ダッシュボード / 外観  / ウィジェット / Business Page Sidebar / Theme Horse: Featured Widget
Theme Horse: Featured Widgetの「▼」を押すと項目が出てきます。
タイトルと固定ページを4件まで設定することができます。
ご案内の一覧を作りたいので、タイトルに「ご案内」と入力し
作った固定ページをセットし保存します。

24

トップページには、ウェジットで設定したタイトルと各ページの
アイキャッチとタイトルが表示されます。
25

 

4.新着情報
ダッシュボード / 外観 / ウィジェット / Business Page Sidebar / 最近の投稿

ここでは、ブログ機能を使ってアップした最新の記事を
トップページに掲載しようと思います。

最近の投稿の「▼」を押すと項目が出てきます。
タイトルと記事を何件表示するか設定します。

26

トップページには、ウェジットで設定したタイトルと
設定した件数の記事タイトルが表示されます。

27

これで、メインコンテンツ作成は終わりです。
これだけなら、簡単にできそうな気がしませんか、
興味のある方は是非トライして見てください。

次回はフッターエリアの設定の説明をします。

 


WordPressの無料テーマAttitudeの使い方

18

1.WordPressの無料テーマAttitudeの使い方
2.WordPressの無料テーマAttitudeの使い方(固定ページ活用方法)
3.WordPressの無料テーマAttitudeの使い方(フッターエリア使用方法)

以前、「WordPressで無料テーマAttitudeを使ってのサイト制作」を書いたところ、
思いのほかアクセスがあったので、WordPressの無料テーマAttitudeの使い方を
3回に分けて詳しく説明していきたいと思います。
再度、無料テーマAttitudeの説明しますので以前の内容と重複する箇所がありますので、ご了承ください。今回も、初心者の方もできるように、CSSの変更は行いません。
サイト内容は前回と同様の内容で行いたいと思います。

制作サイト

業種:歯科医院
ページ数:10ページ程度

グローバルメニュー
・トップページ
・院長のあいさつ
・診療科目
—一般歯科
—小児歯科
—口臭歯科
—予防歯科
—歯周病
—ホワイトニング
・初めての患者様
・アクセス
・お問い合わせ

 

完成サイトのトップページを元に説明していきます。

28

ちなみに無料テーマAttitudeはレスポンシブ対応なので
スマートフォンだとこんな感じに見えます。

2

 

はじめに

無料テーマAttitudeはブログ用のテーマですので、
コーポレートサイト用のテンプレート切り替える必要があります。

テンプレートの設定

固定ページの作成

新規にページを作成します。記事タイトルを記入、テンプレート欄で「Business Template」を選択、【公開】ボタンを押します。
本文は空白のままでOKです。

7

作った固定ページをフロントページとして使用
ダッシュボード / 設定 / 表示設定

今作った固定ページをトップページに設定します。
フロントページの右側にあるリスト内から指定し設定を保存します。

8

そうすると、コーポレートサイト用のテンプレート切り替わります。

 

ページレイアウト設定

ダッシュボード / 外観 / Theme Options / Design Options

9

サイト全体の幅の設定 (Site Layout Options)
Narrow Layout → 狭いレイアウト
Wide Layout → 広いレイアウト
基本のページレイアウト設定 (Default Layout Options)
No Sidebar → サイドバーなし
No Sidebar, Full Width → サイドバーなし全幅
No Sidebar, One Column → サイドバーなし1カラム
Left Sidebar → 左サイドバー
Right Sidebar → 右サイドバー

※ページごとにレイアウトを変更することはできます。

背景の設定

ダッシュボード / 外観 / Theme Options / Design Options / Custom Back Ground

全幅のレイアウトを選択していると意味がないですが、
背景に画像設置や背景色変更ができます。

10 11

 

ヘッダー、メニュー、スライダー

3

 

1.タイトル部分

タイトル形式
ダッシュボード / 外観 / Theme Options / Design Options / Custom Header

12

・Header Logo
ロゴ画像を設定できます。

・Show
Header Logo Only → ロゴ画像のみ表示
Header Text Only → テキストのみ表示
Disable  → 非表示

・Need to replace Header Image?
ヘッダー画像変更

・Hide Searchform from Header
検索窓の有無

※ロゴの部分をテキストのみにする場合
ダッシュボード / 外観 / カスタマイズ / サイトタイトルとキャッチフレーズ

5

サイトタイトルとキャッチフレーズを入力します。

 

2.ソーシャル
ダッシュボード / 外観 / Theme Options / Social Links

6

使用しているソーシャルサービスのURLを入力します。

Facebook
Twitter
Google Plus
Pinterest
Youtube
Vimeo
LinkedIn
Flickr
Tumblr
Myspace
RSS

 

3.メニュー
ダッシュボード / 外観 / メニュー

13

必要なメニューを設定して
テーマの位置 Primary Menu にチェックを入れます。

 

4.スライダー
無料テーマAttitudeで使用しているスライダーは、
固定ページもしくは投稿ページのIDを設定して表示します。
画像はアイキャッチ画像を使用し、
タイトルと本文の一部を表示します。

15 16

 

スライダーの基本設定
ダッシュボード / 外観 / Theme Options / Featured Post / Page Slider / Slider Options

14

・Disable Slider
表示、非表示

・Number of Slides
スライド枚数

・Transition Effect
画像切替の効果

・Transition Delay
スライド時間

・Transition Length
切替時間

スライダーの内容設定
ダッシュボード / 外観 / Theme Options / Featured Post / Page Slider / Featured Post/Page Slider Options

17

IDを設定することによりトップページにスライダーが表示されます
以上でヘッダー~スライダーまでの使い方になります。

次回は固定ページなどの扱いを説明します。


制作事例 (株)しゅんあぐり様

しゅんあぐり

農家が潤い、生活者も喜ぶ。そんな農業スタイルを仲間たちと作り上げたい。

公開 2015年6月5日
URL http://www.syun-agri.com/
TYPE コーポレートサイトリニューアル

●リニューアル目的
・デザインのリニューアル。
・ページ構成を見直し、ユーザビリティの向上。
LINEスタンプと合わせて制作


ウェブマスターツールの「検索クエリ」が新しくなり「検索アナリティクス」に!

21
今回は「検索アナリティクス(ベータ版)」の使い方を説明したいと思います。

ウェブマスターツールの検索トラフィックにある「検索クエリ」が新しくなり、
「検索アナリティクス(ベータ版)」がリリースされました。

1

 

検索アナリティクスって何が出来るの?

 

サイトがどれくらいの頻度でGoogleの検索結果に表示されたかがわかります。
4種類のデータを6種類のカテゴリでレポート表示できます。

 

検索アナリティクスの使い方

 

4種類のデータをグラフと表で表示できる。

赤枠部分の項目を追加してグラフに表示させることができます。

2

3
◾クリック数:Google検索結果ページに表示されたあなたのサイトをクリックして移動した回数
◾表示回数:あなたのサイトがGoogleの検索結果に表示された数
◾CTR(クリック率):Googleの検索結果においてサイトのコンテンツがクリックされた割合、クリック数÷表示回数
◾平均掲載順位:Googleの検索結果におけるサイトの「最上位」の平均掲載順位

 

6種類のカテゴリを表で表示できる。

赤枠部分のカテゴリごとに表示させることができます。

22

・クエリ:検索されたキーワードごとのカテゴリ
・ページ:あなたのサイトのページごとのカテゴリ
・国:検索された国ごとのカテゴリ
・デバイス:PC、モバイル、タブレットごとのカテゴリ
・検索タイプ:ウェブ、画像、動画ごとのカテゴリ
・日付:指定した日付ごとのカテゴリ

 

クエリ
Googleで検索されたキーワードごとのデータを表示します。
あなたのサイトがどのようなキーワドで検索されているかわかります。
4

 

ページ
あなたのサイトのページ別のデータを表示します。
ページごとのパフォーマンスを比較できます。
5

 


検索された国ごとのデータを表示します。
特定の国のみでの検索パフォーマンスを確認できます。
6

 

デバイス
PC、モバイル、タブレットごとのデータを表示します。
デバイスごとの検索パフォーマンスを確認できます。
7

 

検索タイプ
ウェブ、画像、動画ごとのデータを表示します。
基本ウェブの検索ですが画像や動画でもあなたのサイトを検索しているかを確認できます。
8

 

日付
指定した範囲の一日ごとのデータを表示します。
日付単位で検索パフォーマンスを確認できます。
9

 

フィルタ機能
各カテゴリでフィルタ機能が使えます。
フィルタを使うことで見たい情報だけに絞り込むことができます。

10

 

・クエリ:キーワードで絞り込みが行えます。

11

 

・ページ:URLの文字で絞り込みが行えます。

12

 

・国:検索された国を選んで絞り込みが行えます。

13

 

・デバイス:PC、モバイル、タブレットで絞り込みが行えます。

14

 

・検索タイプ:ウェブ、画像、動画で絞り込みが行えます。

15

 

・日付:指定した日付絞り込みが行えます。

16

 

比較機能
今回、追加された機能としてデータの比較をすることができるようになりました。

例として掲載順位のデータだけでデバイスの「PC」と「モバイル」を比較します。
23

「PC」と「モバイル」を選択

17

グラフ上に「PC」と「モバイル」順位の変動が同じグラフで見ることができます。
19

 

補足

画像のグラフ上にある「更新」ですが、2015/4/21に行われた
モバイルフレンドリーアップデートの日です。
20
「更新」の日を境にモバイルの検索順位の推移も調べることができます。
SEO対策の効果測定や改善のためには、検索アナリティクスはかなり実用的なツールになります。
Googleアナリティクスでは得られない貴重な情報がありますので、
工夫すれば様々な使い方ができます。

是非、使ってみてください。