上位表示対策!アメブロでSEO集客する方法とは?

ホームページ・アメブロをYahoo Googleの検索エンジンで上位表示させSEO集客する為の方法


テーマ:
私のメッセージボードのカスタマイズ方法について、教えて欲しいと言うリクエストがございましたので、公開したいと思います。

ブログの目的によってカスタマイズもさまざまな方法を用いますが、私がこのような形にした理由は…
過去に書いた記事を見つけやすくする為
トップページからリンクを貼ることでのSEO効果
メッセージボードの告知部分と記事との間をコンパクトする

どの記事ページからの訪問者があってもコンテンツページ(読んでもらいたい記事)へと誘導ができPV(ページビュー)が上がるのでははてなマークと勝手に思っています(^o^;)

ただ、設置方法は少々メンドウなんです汗なるべくわかりやすく解説したいと思いますが、少々設置にはハードルは高めです(ノ_・。)
※私と同スキンの2カラム仕様を使用しているブログが対象ですので予めご了承ください。


用意する素材


リストマーク 23px × 28px
リストマークのURL:http://myisland.jp/image/folder.png
※素材は無料アイコン配布サイトで、Folderのリストマークは、こちらからゲットビックリマーク


スタイルシートの編集


▼CSSの編集ページよりメッセージボードの所を下記のように追加してください。
編集前にメモなどにコピーして保存をしておくことをお勧めします。


/* (3-5) メッセージボード
--------------------------------------------*/

.skinMessageBoard{
/* 注 ベースのcssに margin-bottom の記述有り */
border:1px solid #dddddd;/*メッセージボード枠のライン*/
height:350px;/*メッセージボード枠の縦幅*/
overflow:auto;
}

.skinMessageBoard a{
font-size:0.9em;/*リンク文字サイズ*/
line-height: 1.5;/*リンクの間隔*/
}

.skinMessageBoard2{}
.skinMessageBoard3{
padding:16px 0px 16px 8px;/*メッセージボード内枠*/
}


メッセージボード


メッセージボードに下記のコードを改行なしで書く必要があります。一度、メモにコピーして修正してから貼り付けると楽です。
▼修正するとところ
リストマークのURL
・テーマページのURLとテーマページタイトル
・記事のURLと記事のタイトル


<div style="width:310px;float:left;">
<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;">
<a href="テーマのURL">テーマタイトル</a></h3>
<ul>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
</ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;">
<a href="テーマのURL">テーマタイトル</a></h3>
<ul>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
</ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;">
<a href="テーマのURL">テーマタイトル</a></h3>
<ul>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
</ul>
</div>

<div style="width:310px;float:left;padding-left:10px;">
<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;">
<a href="テーマのURL">テーマタイトル</a></h3>
<ul>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
</ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;">
<a href="テーマのURL">テーマタイトル</a></h3>
<ul>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
</ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;">
<a href="テーマのURL">テーマタイトル</a></h3>
<ul>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
<li><a href="記事のURL">記事のタイトル</a></li>
</ul>
</div>



▼最終的に改行をなくし、このような状態でメッセージボードに貼り付けます。


<div style="width:310px;float:left;"><h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;"><a href="テーマのURL">テーマタイトル</a></h3><ul><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li></ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;"><a href="テーマのURL">テーマタイトル</a></h3><ul><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li></ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;"><a href="テーマのURL">テーマタイトル</a></h3><ul><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li></ul></div>

<div style="width:310px;float:left;padding-left:10px;"><h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;"><a href="テーマのURL">テーマタイトル</a></h3><ul><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li></ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;"><a href="テーマのURL">テーマタイトル</a></h3><ul><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li></ul>

<h3 style="padding-top:3px;background: url(リストマークのURL) no-repeat;text-indent: 32px;height:27px;margin-bottom:-10px;"><a href="テーマのURL">テーマタイトル</a></h3><ul><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li><li><a href="記事のURL">記事のタイトル</a></li></ul></div>


再編集するとき、メッセージボードから直接編集をしようとするとレイアウトが崩れてしまいますので、メモで編集をして、それをコピーして貼り付けると楽に編集ができます。

かなりメンドウな作業ではありますが、効果は抜群だと思いますので、是非トライしてみてください。
ヽ(゜▽、゜)ノ


パソコン上位表示が狙えるアメブロカスタマイズ制作
手紙SEO成果報酬承ります。お問い合わせフォーム
携帯090-3146-0264
AD
いいね!した人  |  コメント(2)  |  リブログ(0)

上位表示@渡部新一さんの読者になろう

ブログの更新情報が受け取れて、アクセスが簡単になります

AD

Ameba人気のブログ

Amebaトピックス

      ランキング

      • 総合
      • 新登場
      • 急上昇
      • トレンド

      ブログをはじめる

      たくさんの芸能人・有名人が
      書いているAmebaブログを
      無料で簡単にはじめることができます。

      公式トップブロガーへ応募

      多くの方にご紹介したいブログを
      執筆する方を「公式トップブロガー」
      として認定しております。

      芸能人・有名人ブログを開設

      Amebaブログでは、芸能人・有名人ブログを
      ご希望される著名人の方/事務所様を
      随時募集しております。