読者です 読者をやめる 読者になる 読者になる

初心者ブロガーの今すぐ使える アクセスアップにつながる5つの小技

ブログ アクセス数 

 

ブログを書くときいろいろな種類のブログサービスがあります。

 

このブログは現在はてなブログを使用して書いてます。

 

他にも

 

ライブドアブログ・F2ブログ・シーサーブログ・ワードプレス

 

それぞれ使いやすい機能が搭載されてます。

 

私もいろいろなサービスを使って書いてます。

 

中でもこのはてなブログはレイアウトや文章の飾りつけはすごく使いやすいです。

 

はてなブログでは当然のように出来ることが他ブログでは簡単にできない。

 

はてなブログから引っ越しするとうまく表示できないなんてことがよくあります。

 

今回は、どのブログからでも使える、または引っ越しした時にでも使える小技を取り上げていきたいと思います。

 

 

☆目次


 ▶1 目次を作りたい
 ▶2 見出しを作りたい
 ▶3 ブログに表を表示させたい
 ▶4 ブログにAmazonアソシエイトと楽天アフィリエイトの商品リンクを同時に貼る
 ▶5 ブログに自分の記事の紹介をかっこよく貼る
 

 

 

 

 

1 目次を作りたい

 
 ▶1 目次を作りたい
 ▶2 見出しを作りたい
 ▶3 ブログに表を表示させたい
 ▶4 ブログにAmazonアソシエイトと楽天アフィリエイトの商品リンクを同時に貼る
 ▶5 ブログに自分の記事の紹介をかっこよく貼る
 ▶ここをいじります

 

 ↑こういうやつです。

 

これはこの記事の目次です。

HTMLを作れる方は簡単にできますが私のようにHTMLが理解できない人でも簡単に作れる方法を紹介します。

 

まず

目次の部分のHTMLは

▶<a href="#title1">1 目次を作りたい</a><br />  ▶<a href="#title2">2 見出しを作りたい</a><br />  ▶<a href="#title3">3 ブログに表を表示させたい</a><br />  ▶<a href="#titl4">4 ブログにAmazonアソシエイト楽天アフィリエイトの商品リンクを同時に貼る</a><br />  ▶<a href="#title5">5 ブログに自分の記事の紹介をかっこよく貼る</a><br />  ▶<a href="#title6">ここをいじります</a></p>

 

こうなってます

 

ここをいじります

 

 ↑実際に飛ばしたい部分のHTMLは

 

<h3 id="title5">ここをいじります</h3>

 こうなってます。

 

目次一覧を挿入したい場所に

 

▶<a href="#title1">1 目次を作りたい</a><br />  ▶<a href="#title2">2 見出しを作りたい</a><br />  ▶<a href="#title3">3 ブログに表を表示させたい</a><br />  ▶<a href="#titl4">4 ブログにAmazonアソシエイト楽天アフィリエイトの商品リンクを同時に貼る</a><br />  ▶<a href="#title5">5 ブログに自分の記事の紹介をかっこよく貼る</a><br />  ▶<a href="#title6">ここをいじります</a></p>

 

飛ばしたい記事の見出し部分に

<h3 id="title1">1 目次を作りたい</h3>

<h3 id="title2">2 見出しを作りたい</h3>
<h3 id="title3">3 ブログに表を表示させたい</h3>
<h3 id="title4">4 ブログにAmazonアソシエイト楽天アフィリエイトの商品リンクを同時に貼る</h3>

<h3 id="title5">5 ブログに自分の記事の紹介をかっこよく貼る</h3>

<h3 id="title6">ここをいじります</h3>

 

こうするとブログに簡単に目次を挿入することができます。

 

 

目次にもどる

 

 

2  見出しを作りたい

↑の2 見出しを作りたいもみだしなんですが、

 

例えば、

 

2 見出しを作りたい

 

 こういうやつです。

 

この部分のHTMLは

 

<span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>2 見出しを作りたい</b></div></span>

 

こうなってます。

 

この

:#F2B33DがL字に入っているオレンジ色

#F8F8F8は背景のグレー色

です。

 

この部分をいじると色の変更も可能です。

 

www.color-sample.com

このサイトを見ながらお好みの色にモデルチェンジできます。

 

 

 

 

 

 

3 ブログに表を表示させたい

 

 

 小技大技
SEO やや効果有 効果有
セッション やや上がる

上がる

 

 ↑こういうやつです。

 

出来たら便利。

 

 エクセルシートをHTMLテーブルに変換しちゃう君(ββ)を使います。

 

f:id:adurable:20161008163244j:plain

 

  

 こういう奴です。

 

これで簡単にブログ記事に表を挿入することができます。

 

 

4 ブログにAmazonアソシエイト楽天アフィリエイトの商品リンクを同時に貼る

 

 

↑こういうやつです

 

カエレバヨメレバ

 というツールを使います。Amazon楽天はもちろんいろいろなアフィリエイトサイトのリンクを同時に作成することができ便利です。

 

書籍はヨメレバ

 

商品はカエレバを使ってください。

 

初めにID等の登録が必要ですが、簡単に終わります。

 

Amazon楽天市場のボタンは最初テキストで表示されます。

 

いろいろなボタンのカスタマイズ方法も詳しく解説してくれてるブログがググればありますので、参考にされてカスタマイズしてみてください。

 

 

 

 

5 ブログに自分の記事の紹介をかっこよく貼る

adurable.hatenablog.com

↑こういうやつです。

 

ブログに自分の記事の紹介をかっこよく貼る

 

 これは、はてなブログで簡単に作れ他のブログでも作成したHTMLをコピーすることで簡単に貼り付けることができます。

 

例えば

 

f:id:adurable:20161008171108j:plain

 

 初心者ブログ アクセス数アップ 10人のTOPブロガー直伝7手法 のリンクを作ろうとすると

 

上のように種類が選べます。

 

下の埋め込みを選択してリンクを作成します。

 

その部分のHTMLをコピペすることで他のブログサービスでも記事内に自分の記事のかっこいいリンクを貼ることができます。

 

 

 やりだしたらキリがないと思いますが、少しづつ研究していってください。

 

最近やっとブログは書くというより、作るものだとわかってきました。

 

私は全然ですが、皆さんはアクセスのある売れる記事を作っていってください。

 

 

 

 

 

最後にコピペ用に

 

 

<h4 id="mokuji">☆目次</h4>
 ▶<a href="#title1">目次1</a>
 ▶<a href="#title2">目次2</a>
 ▶<a href="#title3">目次3</a>
 ▶<a href="#title4">目次4</a>
 ▶<a href="#title5">目次5</a>
 ▶<a href="#title6">目次6</a>
 ▶<a href="#title7">目次7</a>

 


<h3 id="title1"><span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>1 目次1</b></div></span></h3>

▶<a href="#mokuji">目次にもどる</a>

<h3 id="title2"><span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>2 目次2</b></div></span></h3>

▶<a href="#mokuji">目次にもどる</a>

<h3 id="title3"><span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>3 目次3</b></div></span></h3>

▶<a href="#mokuji">目次にもどる</a>

<h3 id="title4"><span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>4 目次4</b></div></span></h3>

▶<a href="#mokuji">目次にもどる</a>

<h3 id="title5"><span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>5 目次5</b></div></span></h3>

▶<a href="#mokuji">目次にもどる</a>

<h3 id="title6"><span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>6 目次6</b></div></span></h3>

▶<a href="#mokuji">目次にもどる</a>


<h3 id="title7"><span style="font-size: large;"><div style="padding:10px 10px;border-color:#F2B33D;border-width:0 0 1px 7px;border-style:solid;background:#F8F8F8;"><b>7 目次7</b></div></span></h3>

▶<a href="#mokuji">目次にもどる</a>

 

 これをご自分のブログにHTMLで記入して使ってください。

 

 

 

 

 

 

にほんブログ村 その他趣味ブログ マイブームへ
にほんブログ村

 


人気ブログランキングへ