初めての方必読！無料版はてなブログでまず最初にやるべきこと

こんにちは。

今回の記事では初めてはてなブログに登録して最初にやって置くべきことを書いて行きたいと思います。

具体的にはてなブログの管理画面や参考になったサイトなど記載しています。

f:id:livefree00:20190622213552j:plain

設定内容をきっちり記載する
- 基本設定→詳細設定
グループ登録
デザイン
- おすすめデザインテーマ
- カスタマイズすべきこと
  - グローバルナビの設置を行う
  - シェアボタンの追加
無料版はてなブログでトップページに記事一覧を表示する方法
スマートフォンの設定
まとめ

設定内容をきっちり記載する

まずはじめにブログを登録した基本となる設定を登録して行かなければなりません。

ブログのタイトルやどういったブログなのか補足を記載したり、誰が見てもわかるようにしていかなければなりません。

ほんとはタイトルだけ見てどのようなブログがすぐわかればいいのですが、良い感じのタイトルが思いつかないので補足としてどう行った記事を書いていくのか記載すれば問題はないと思います。

基本設定→詳細設定

ブログ名、ブログアイコン、ブログの説明を記載してください。

ここはタイトルはブログで1番大事なところなのでじっくり考えくださいね。

f:id:livefree00:20190506020108p:plain

aboutについては詳しく書かれていた記事がありましのでリンクを貼っておきます。

ここも以外とアクセスがあるみたいなのできっちり書いておきましょう。

ruchan2.hatenablog.com

グループ登録

グループに参加して、同じ興味のブログ仲間とつながろう。グループに登録できるのは3つまでです。そのため、ご自身のブログ内容に沿ったグループに参加すれば問題ないと思います。

因みに、僕は旅行と書評をメインに書いておりますので旅行と読書のグループに参加しております。後一つは、適当にどこか人が多いところに入ろうかなと思っています。グループの参加退出自由ですので気兼ねなくグループに参加して見てくださいね。

hatenablog.com

デザイン

皆さんが1番気になっているのはブログのデザインをどうするかではないでしょうか。

僕もはじめ無料ブログを作る時にどのデザインがよいのか全くわかりませんでした。

はてなブログをやっている記事は検索するとたくさん出てくるので色々調べて良さそうで現在僕が実際に使用している物を紹介しますね。

他に良いものがあればぜひ教えてください。

カスタマイズすべきこと

テーマ入れたままの状態ですと本来の美しいサイト構造になりません。

カスタマイズしていきましょう。

グローバルナビの設置を行う

以下の記述をコピーしてURL部分は自分のリンク先に変更し、ヘッダのタイトル下に入れください。

<nav id="gnav"><nav id="gnav">

<div class="gnav-inner" id="menu-scroll"> <div class="menu"><a href="URL">HOME</a></div>

<div class="menu"><a href="URL">ABOUT</a></div>

<div class="menu"><a href="URL">Trip</a></div>

<div class="menu"><a href="URL">Review</a></div> </div>

</nav>

そうするとタイトル下にナビゲーションが出てくるはずです。

これを追加することにより閲覧者がかなり見やすくなります。

大事なのは誰に何を見せるということと、快適にブログを見てもらうということです。

そうすれば必然的にブログの閲覧数は伸びてくるはずです。

シェアボタンの追加

せっかく一生懸命書いたブログなのでシェアしてもらいたいですよね。

そのままですと、シェアボタンがないので追加する必要あります。

以下のコードを記事→記事上と記事下にコピーしてください。

すると記事上と記事下にシェアボタンが追加されます。

<div class="shrbtn">

<a href="http://b.hatena.ne.jp/entry/{URLEncodedPermalink}" class="share_btn">
<span class="htvcenter" style="line-height: 1.6;">
<i class="blogicon-bookmark" style="font-size:22px"></i>
</span>
</a>

<a href="http://twitter.com/intent/tweet?text={Title} {URLEncodedPermalink}" class="share_btn">
<i class="fa fa-twitter"></i>
</a>

<a href="http://www.facebook.com/sharer.php?u={URLEncodedPermalink}" class="share_btn">
<i class="fa fa-facebook"></i>
</a>
<a href="http://getpocket.com/edit?url={URLEncodedPermalink}" class="share_btn">
<i class="fa fa-get-pocket"></i>
</a>

<a href="http://feedly.com/i/subscription/feed/http://ブログURL/feed" target="_blank" class="share_btn">
<i class="fa fa-rss"></i>
</a>
</div>

無料版はてなブログでトップページに記事一覧を表示する方法

５記事くらい書き終わってなんか変だなと思いました。無料ブログのトップページは記事がズラズラ並んでいる状態でかなり違和感ありました。そのため、一つ前の記事を目にしてもらうまでに、時間が掛かりました。

調べたら無料でもTOP記事を一覧にする方法がありました。

手順以下ですので順を追って試して見ください。

ブログ管理画面の『設定』を開く
『設定』画面上部の『詳細設定』を開く
「検索エンジン最適化」って項目の『headに要素を追加』欄に下記コードをコピペ。
張り付けたコード内のURLとブログタイトルを自分のものに置き換える。
一番下にある『変更する』ボタンをクリック。

<script type="text/javascript">
if( location.href == 'TOPページのURL/'){
location.href='TOPページのURL/archive';}
</script>
<noscript>
<p><a href="TOPページのURL/archive">タイトル</a></p>
</noscript>