伊藤
士業ウェブ集客NO.1 宣言

ウェブ集客をお約束!

貴社のサイト集客を全面的にバックアップいたします!

集客プロ集団!

必ず集客できるサイトを制作いたします!

検索上位連発!

士業関連キーワードで検索上位表示の自信あります!

満足3プランをご用意!

お客様のご予算やニーズに合わせてご提案させて頂いております!

無料相談実施中!

土日祝日関係なく、お電話でもご相談承ります!

士業のためのワードプレス講座~上級編~

ここでは、ワードプレスで記事投稿以外でできることについて説明します。

 

 

目次

1.トップページの編集・更新方法

2.サイドメニューの項目を追加する方法

3.プラグインの追加方法

4.表の作成方法

 

 

1.トップページの編集・更新方法

 

トップページの編集方法について説明します。

 

それぞれ文章とその下の画像を合わせて確認して下さい。

 

 

 

 

まず、「外観/テーマ編集」から「メインインデックスのテンプレート」を選択します。

 

bandicam 2014-01-30 23-12-52-262     bandicam 2014-01-31 00-17-00-271

 

 

 

 

トップページの編集をするとき多いのは、既にある記事の編集や新しい項目の追加、画像の挿入であると思います。

 

既にある記事の編集や新しい項目の追加はHTMLコードを用いて編集します。

 

HTMLコードの編集方法はこちら

 

画像の挿入方法はこちら

 

 

 

 

編集完了後、「ファイルを更新」をクリックして下さい。

 

ファイルを更新

 

 

 

 

 

 

 

 

 

 

2.サイドメニューの項目を追加する方法

 

サイドメニューに項目を追加する方法について説明します。

 

「外観/テーマ編集」から「サイドバーのテンプレート」を選択します。

 

bandicam 2014-01-30 23-12-52-262     bandicam 2014-01-31 00-17-25-311

 

 

 

 

 

 

ここで、サイドバーに下記画像のような項目を追加するためには、赤枠内のHTMLコードを入力します。

 

bandicam 2014-02-05 00-26-34-338

<h3>タイトル</h3>
<ul>
<li><a href=”http://no1.com”>その1</a></li>
<li><a href=”http://no2.com”>その2</a></li>
<li><a href=”http://no3.com”>その3</a></li>
<li><a href=”http://no4.com”>その4</a></li>
</ul>

 

 

 

 

ここから、HTMLコードのそれぞれについて詳しく記載して下さい。

 

まずはタイトルについて説明します。

 

サイドバータイトル

<h3>タイトル</h3>

<ul>
<li><a href=”http://no1.com”>その1</a></li>
<li><a href=”http://no2.com”>その2</a></li>
<li><a href=”http://no3.com”>その3</a></li>
<li><a href=”http://no4.com”>その4</a></li>
</ul>

 

この項目に追加していきたい記事のカテゴリーなどをタイトルにしましょう。

 

例えば、「会社設立について」、「建設業許可申請について」など。

 

 

 

 

続いて、書いた記事のリンク先を作ります

 

記事の書き方についてはこちら

 

サイドバー項目その1

 

<h3>タイトル</h3><ul>

<li><a href=”http://no1.com”>その1</a></li>

<li><a href=”http://no2.com”>その2</a></li>
<li><a href=”http://no3.com”>その3</a></li>
<li><a href=”http://no4.com”>その4</a></li>
</ul>

 

 

 

 

上記の赤枠部分内の「”http://no1.com”」をリンクさせたいURLに設定します。

 

リンクの貼り付け方はこちら

 

 

 

編集完了後、「ファイルを更新」をクリックして下さい。

 

ファイルを更新

 

 

 

 

 

 

 

3.プラグインの追加方法

 

そもそも「プラグイン」とは何か?

 

プラグインとはワードプレスの機能を追加・拡張するための外部のプログラムのことを言います。

 

 

ワードプレスはこのプラグインをインストールしていくことによって、

SEO対策にも効果的でより便利に記事が更新できるようになります。

 

 

 

「プラグイン/新規追加」を選択します。

 

bandicam 2014-01-30 23-22-13-437

 

 

 

 

 

 

ここで追加したいプラグインの名前を検索します。

 

bandicam 2014-01-31 22-04-15-142

 

 

 

 

 

 

「いますぐインストール」

 

bandicam 2014-01-31 22-07-45-256

 

 

 

 

 

 

 

確認ダイアログが表示されるので、「OK」ボタンを押します。

 

bandicam 2014-01-31 22-10-40-848

 

 

 

 

 

 

 

有効化しないとプラグインを利用できないため、忘れずに「プラグインを有効化」

 

bandicam 2014-01-31 22-12-43-506

 

 

プラグインを利用して、より便利で効果的にして下さい。

 

 

 

 

 

 

 

 

4.表の作成方法

 

ここでは、表の作成方法について記載します。

 

 

表とは、料金表などのように、ホームページを見ていただいている人が、より見やすくするためのツールです。

 

 

そのため、是非ここで作成方法について簡単なものを覚えて下さい。

 

 

表とは下記のようなものを指しています。

列A 列B 列C
行1 A1 B1 C1-C2
行2 A2 B2
行3 A3 B3-C3

 

この表は下記htmlコードにより作成しています。

 

<table class=”basic-table”>
  <tr>
   <th width=”15%”></th>
   <th width=”25%”>列A</th>
   <th width=”25%”>列B</th>
   <th width=”25%”>列C</th>
  </tr>
  <tr align=”center”>
   <th>行1</th>
   <td>A1</td>
   <td>B1</td>
   <td rowspan=”2″>C1-C2</td>
  </tr>
  <tr align=”center”>
   <th>行2</th>
   <td>A2</td>
   <td>B2</td>
  </tr>
  <tr align=”center”>
   <th>行3</th>
   <td>A3</td>
   <td colspan=”2″>B3-C3</td>
  </tr>
</table>

 

 

 

「<th>」は「Table Header」の略で、各項目の小見出しを意味しています。

 

「<td>」は「Table Data」の略で、各項目の値を入力して下さい。

 

 

 

 

 

それでは、それぞれの項目について、説明していきましょう。

列A 列B 列C
  <tr>
   <th width=”15%”></th>
   <th width=”25%”>列A</th>
   <th width=”25%”>列B</th>
   <th width=”25%”>列C</th>
  </tr>

 

 

また、各枠内の横幅を「width=”15%”」と指定しています。

 

 

 

 

この数字を変えることで、例えば下記のように変わります。

 

それぞれの枠の横幅の長さが変わっていることがわかると思います。

列A 列B 列C
  <tr>
   <th width=”40%”></th>
   <th width=”20%”>列A</th>
   <th width=”30%”>列B</th>
   <th width=”10%”>列C</th>
  </tr>

 

 

 

 

 

 

次の説明に入る。

行1 A1 B1 C1-C2
行2 A2 B2

  <tr align=”center”>
   <th>行1</th>
   <td>A1</td>
   <td>B1</td>
   <td rowspan=”2″>C1-C2</td>
  </tr>
  <tr align=”center”>
   <th>行2</th>
   <td>A2</td>
   <td>B2</td>
  </tr>

 

「<tr align=”center”>」で文字を真ん中揃えにしています。

 

「”center”」の代わりに「”left”」で左揃え、「”right”」で右揃えになります。

 

 

 

また、枠をを縦に結合させたい場合には、「rowspan=”2″」を使います。

 

例えば、3つ組み合わせたい場合には、下記のように「rowspan=”3″」とします。

 

行1 A1 B1-B2 C1-C2-C3
行2 A2-A3
行3 B3

  <tr align=”center”>
   <th>行1</th>
   <td>A1</td>
   <td rowspan=”2″>B1-B2</td>
   <td rowspan=”3″>C1-C2-C3</td>
  </tr>
  <tr align=”center”>
   <th>行2</th>
   <td rowspan=”2″>A2-A3</td>
  </tr>
  <tr align=”center”>
   <th>行3</th>
   <td>B3</td>
  </tr>

 

 

 

 

 

 

最後の説明に入ろう。

行3 A3 B3-C3

  <tr align=”center”>
   <th>行3</th>
   <td>A3</td>
   <td colspan=”2″>B3-C3</td>
  </tr> 

 

枠をを横に結合させたい場合には、「colspan=”2″」を使います。

 

例えば、3つ組み合わせたい場合には、下記のように「colspan=”3″」とします。

行3 A3-B3-C3

  <tr align=”center”>
   <th>行3</th>
   <td colspan=”3″>A3-B3-C3</td>
  </tr>

 

 

 

 

 

 

以上、いかがでしたでしょうか。

 

トップページの編集やサイドの編集、プラグインと表の作成。

 

特にプラグインを追加することで、更に便利に更に効果的に変わってきます。

 

より良いホームページ作りに、是非活用してみて下さい。

カテゴリー: ワードプレスの使い方について | 投稿日: | 投稿者: ito

いつでもお問い合わせ承ります!contact

お問い合わせ前に、サービス料金を確認する

クリックするとお問い合わせページが開きます。

メールでご相談・ご注文

営業時間:9:00〜20:00 土日祝日対応!

電話番号

ブログ

メディア実績

R25

R25

Yahooニューストップ

Yahooニューストップ

情熱社長

情熱社長

中国テレビ局 CCTV

中国テレビ局 CCTV

魅せるデザイン

魅せるデザイン

NAVER

NAVER

イラスト雑誌
COOL JAPAN

イラスト雑誌<br>COOL JAPAN

月商倍々の行政書士事務所8つの成功法則

月商倍々の行政書士事務所8つの成功法則

日本一分かりやすい!「創業融資」を成功に導く最強ノウハウ

日本一分かりやすい!「創業融資」を成功に導く最強ノウハウ

会社概要

会社名
:株式会社ウェイビー

住所
:東京都千代田区五番町12-6
五番町マンションB1F

Tel
:03-5216-2121(Tel)

事業内容
①マーケティング事業
②WEB制作事業
③経営コンサルティング事業

顧問弁護士
仲村 晋一
(第二東京弁護士会
 登録番号:23134)

▲ PAGE TOP ▲

ページトップへ戻る