はてなブログを開設して設定したことを忘れないようにメモりました
【はじめてサイトに来た人はこちら】←ブログ運営のいろはをまとめたページです。
ブログの記事の作成やカスタマイズに慣れてくると、導入した設定項目も増えて、どのコードが、どのカスタマイズか分からなくなります。
そこで、本ブログのカスタマイズ記録としてこのページを作成し整理してみました。
この記事は基本的に、はてなブログPROユーザー向けとなっています。
1.はてなブログPRO開設してから最初に行ったこと
①はてなブログで使用する独自ドメインを取得する
②取得した独自ドメインをはてなブログで使用する設定を行う
③トップページの表示形式（PC版）を「一覧形式」にする
はてなブログトップページの表示形式は、「全文形式」と「一覧形式」があり、「一覧形式」にすると記事がコンパクトに表示されるので個人的には「一覧形式」がお気に入りです。
④記事にキーワードリンクを付与しない設定にする
キーワードリンクとはこんな感じに、はてなキーワードに登録されている言葉に自動機にリンクされているリンクです。はっきり言って目障りなので私はキーワードリンクを付与しない設定にしています。
⑤「はてな」による広告を表示しない設定にする
はてなPROに変更しても自動的に「はてな」による広告は消えないので設定しましょう。
⑥「はてな」のヘッダとフッタを表示しない設定にする
ブログの一番上にあるやつです。不要なら表示しない設定にしましょう。
⑦ブログをAMP対応設定にする
AMP対応とは、簡単に言うと、ウェブページをモバイル端末で高速に表示させることに対応させるということです。ページの読み込み速度が上がれば読者のメリットにもなるのでAMP対応の設定で問題ありません。
2.はてなブログカスタマイズ編
①はてなブログにデザインテーマをインストールする
まず、使用するテーマは、ID「shiromatakumi」さんが作成したテーマ「Brooklyn」をインストールします。私のブログでも「Brooklyn」を使用しています。
上記にアクセスして、右側にある「プレビューしてインストール」を選択して下さい。
②デザインテーマ「Brooklyn」にグローバルメニューを導入する
グローバルメニューとは、タイトル下に表示されるメニューのことです。はてな一般ユーザー用と、はてなPROユーザー用の2つあります。はてなPROユーザー用は、ページを下にスクロールするとグローバルメニューも上部に固定されます。
はてなPROユーザー用は、はてな一般ユーザーが使用するのは禁止です。
はてな一般ユーザーは、はてなブログの標準ヘッダーを隠す機能が使用できない為、はてな一般ユーザーが使用すると、はてなブログの利用規約違反になる為です。無断で利用してブログが消えても文句は言えなくなります。
グローバルメニューの設置コード（はてなPROユーザー用）
<div id="trigger-point">
</div>
<div id="global-menu">
<div id="mobile-head">
<div id="nav-toggle">
<div>
<span></span>
<span></span>
<span></span>
</div>
</div>
</div>
<ul class="global-menu-list">
<li><a href="リンク先のアドレス">メニュー1</a></li>
<li><a href="リンク先のアドレス">メニュー2</a></li>
<li><a href="リンク先のアドレス">メニュー3</a></li>
<li><a href="リンク先のアドレス">メニュー4</a></li>
<li><a href="リンク先のアドレス">メニュー5</a></li>
</ul>
</div>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$(function (){
var $nav = $('#global-menu');
var $content = $('#content');
var $offsetTop = $('#trigger-point').offset().top;
function fixedNav() {
if($(window).scrollTop() > $offsetTop){
$nav.addClass('fixed');
} else {
$nav.removeClass('fixed');
}
};
$(window).scroll(fixedNav);
$('body').on('touchmove', fixedNav);
$('#nav-toggle').click(function (){
$nav.toggleClass('open');
});
$('#content').click(function (){
if($nav.hasClass('open')){
$nav.removeClass('open');
}
})
});
</script>
このコードをダッシュボードの「デザイン」→「カスタマイズ」→「ヘッダ」→「タイトル下」にコピーペーストして下さい。
その後、「リンク先のアドレス」と「メニュー1」を自由に変更して下さい。
上記のコードは、はてな一般ユーザーが使用するのは禁止です。
グローバルメニューの設置コード（一般ユーザー用）
<div id="global-menu">
<ul class="global-menu-list">
<li><a href="リンク先のアドレス">メニュー1</a></li>
<li><a href="リンク先のアドレス">メニュー2</a></li>
<li><a href="リンク先のアドレス">メニュー3</a></li>
<li><a href="リンク先のアドレス">メニュー4</a></li>
<li><a href="リンク先のアドレス">メニュー5</a></li>
</ul>
</div>
このコードをダッシュボードの「デザイン」→「カスタマイズ」→「ヘッダ」→「タイトル下」にコピーペーストして下さい。
その後、「リンク先のアドレス」と「メニュー1」を自由に変更して下さい。
コンセプトのあるブログとテーマの選定について
【はじめてサイトに来た人はこちら】←ブログ運営のいろはをまとめたページです。
1.ブログのコンセプトを決める
①コンセプトがあるブログとは？
突然ですが【コンセプト】とは何でしょうか？
Wikipediaで調べると、
作者がその作品に込めた意図・意匠・目的・思い等の概念を有し、これを表現しており、「作品のコンセプト」等と言われている。また、受け手の感じ方によって新たな概念が付加される場合があり、作品に接する時代性や社会的価値観などの変化に伴って変わる。
と記載されています。
要は、作者がこだわっているポイントです。こだわるポイントがないと読者に対して自分はどういう人間であるのかイメージしてもらえません。
コンセプトがあるブログは記事にまとまりができ、読者も読みやすいブログになります。
②コンセントはどのように決める？
結論から言いますとコンセントは自由に決めて大丈夫です。下記にコンセプトのブログ例を上げます。
- 記者の個性にこだわるブログ（自分の個性をブログに出す）
- 文章にこだわるブログ（文章力で勝負する or 子供でもわかる文章にする）
- 写真にこだわるブログ（感動できる写真を使う or 面白い写真を使う）
- イラストにこだわるブログ（私は絵が下手なので無理ですが・・・）
何でもよいので１つコンセプトを決めるとブログが書きやすくなります。
2.ブログのテーマを決める
①自分の好きなことを書こう
自分の好きなことを伝えることで読者にポジティブな記事のイメージを持ってもらえます。嫌いなことより好きなことを書いた方が自分のよさがでて読者にも伝わります。
②テーマが決められない場合は？
テーマが決められないから雑記ブログにして何でも書いていくと記事の内容が分散してしまい自分自身の知識が増えていきません。そして決まりがないので、最終的に何を書けばよいのか分からなくなってしまうこともあります。
１つのテーマを決めなくてもよいですが、最大でも５つまでのテーマに絞って書くようにして下さい。そして今後そのテーマの中で知識が増えてきたものが見えてきたらそのテーマに絞っていくとよいです。
③テーマがあることで専門性が増すブログとなる
テーマを絞って書いていくと自然とテーマのことに詳しくなると共に、そのブログの専門性が上がり、他のブログと差別化できます。
俺、私は、雑記ブログで何でも書いていく！って方針でも構いませんが芸能人でもない限り一般人が書いたブログは思った以上に読んでもらえません。
雑記ブログで何でも間でも書いたら、それは雑記ブログではなく「日記ブログ」です。
いろいろな記事を書いている雑記ブログよりもテーマがあり専門性があるブログの方が読者に対してメリットがあると思います。
④それでもテーマ決まられない時は？
どうしてもテーマが決められない時は、
- これから勉強したいこと
- これからはじめる趣味のこと
をテーマにして下さい。
これから勉強することをブログに書く場合、仕事や資格試験の為のブログを書くことで記録することもできます。勉強する為に勝った本や読んだ本を紹介することも立派なブログです。
これからはじめる趣味でもブログ上で情報発信することで同じ趣味の仲間ができるかもしれません。
お名前.comで取得したドメインをはてなブログで利用する設定方法
【はじめてサイトに来た人はこちら】←ブログ運営のいろはをまとめたページです。
1.お名前.comでドメインの設定を行う
独自ドメインが決定し無事取得できたら、お名前.comでドメイン設定を行います。
まだ独自ドメイン取得していないよって方は下記のページを見て独自ドメインを取得して下さい。
①お名前.comにログインしてドメイン設定のタブを選択する
お名前.comにログイン後、画面上部の「ドメイン設定」を選択して下さい。
②DNS関連機能の設定を選択する
「ドメイン設定」内の「DNS関連機能」を選択してください。
選択後、内部ドメイン一覧の設定するドメインにチェックを入れて、「次に進む」を選択して下さい。
③DNSレコード設定を利用するを選択する
ページ下に「DNSレコード設定を利用する」横の「設定する」を選択して下さい。
④「入力」項目で「ブログ」を選択する
ページ中段の「入力」項目で「ブログ」のタブに切り替えて下さい。
⑤入力欄に必要情報を入力する
- ホスト名「ｗｗｗ」
- TYPE「CNAME」
- VALUE「hatenablog.com」
⑥「DNSレコード設定用ネームサーバー変更確認」にチェックを入れて「確認画面へ進む」を選択する
ページ下段に「DNSレコード設定用ネームサーバー変更確認」にチェックを入れて「確認画面へ進む」を選択して下さい。
⑦画面下部にある「設定する」を選択する
以上で「お名前.com」で行うドメイン設定は完了しました。
上記で設定した情報がサーバーに反映されるまで数時間程度かかるので、次に説明する「はてなブログ」でのドメイン設定は次の日に行うと確実です。
2.はてなブログでドメインの設定を行う
はてなブログでドメインの設定を行う前に、はてなブログPROに変更していない方は先にPROに変更しましょう。無料版でもブログの作成はできますが独自ドメインでの運用ができない為、Googleアドセンスに登録して広告を貼ることができません。
はてなブログPROってどんな機能があるの？って方は以下のページを見て下さい。
①はてなブログにログインして左側にある設定を選択する
- 管理画面にログインしたら左側の設定を選択する
- 設定項目内の詳細設定タブを選択する
- お名前.comで取得したドメインを入力する
- ドメイン設定をチェックを選択する
アドレス下の「ドメインの設定状況」が「有効」になればOKです。エラーになる場合は、お名前.comでドメイン設定を行ってから数時間たってからもう一度行なってみて下さい。次の日に行うと確実です。
- 「ドメインの設定状況」が「有効」になればページを下にスクロールして、「変更する」を選択して下さい。←忘れやすいです。
②ドメイン設定完了
お疲れ様です。以上でドメイン設定が完了しました。検索窓にアドレスを入力してブログが表示されるか確認してみて下さい。
ドメイン変更後はサーバーが一時不安定になる為、ページが表示されたり、されなかったりしますが、２～３日後には安定しますので心配ありません。
はてなブログを独自ドメインで利用する為に独自ドメインを取得する
【はじめてサイトに来た人はこちら】←ブログ運営のいろはをまとめたページです。
1.はじめに
下記の記事がはてなブログの公式ヘルプページです。
専門用語が多くて分かりにくい方はページをスクロールして下さい。
2.独自ドメインを取得する
ドメインを取得する為のドメイン登録事業者はいくつもありますが、その中でもおすすめなところは、日本でのドメイン登録事業者最大手の「お名前.com」です。理由としては、はてなブログで独自ドメインを設定されている方の多くが「お名前.com」で取得している為、設定方法の解説が多くあります。
①ドメイン名を決める
お名前.comに行ったら検索窓に好きな名前のドメインを入れてください。
http://www.※※※※.com ←※※※※の部分です。
ドメイン名はブログに書く記事に合わせた方がよいです。
例えば、iPhoneを紹介する記事の場合、http://www.iphone-blog.comのように。
ただし、他の人に先に取得されている同じ名前は取得できません。
試しに、「bifyaiknu」と入力しました。※適当に入れました。
②ドメイン種類を決める
ドメインの種類はいろいろありますが、「.com」を選べば間違いありません。
「.xyz」とかの方が安いですが、もしあなたが初めてのサイトにアクセスする際によく分からないドメインだと不安ですよね？
特にこだわりがない場合は「.com」にチェックを入れて、右側にある「申し込みへ進む」をクリックして下さい。
③Whois情報公開代行にチェックを入れる
申し込み内容が表示されるのでドメインが正しいか確認して、Whois情報公開代行にチェックを入れて下さい。これは何かというとドメインは取得すると、どこの誰が取得したのか名前やメールアドレス等を他人が調べることができます。Whois情報公開代行に申し込むと、お名前.comの会社の名前やメールアドレスが公開されるので、個人のプライバシーを保護できます。必ず申し込みましょう。
下に進むと「２.サーバー選択」がありますが、「利用しない」にチェックを入れて、右側にある「次へ」をクリックして下さい。
④支払方法を登録する
支払方法を登録したら右側にある「申し込む」をクリックして下さい。
登録したメールアドレスにドメイン登録完了通知が来たらドメイン取得完了です。
⑤次にドメイン取得後に行う設定について説明します
どのブログサービスを使うの？迷ったら【はてなブログ】で決定！
【はじめてサイトに来た人はこちら】←ブログ運営のいろはをまとめたページです。
「ブログサービス」と「CMS」
ブログを書き始める際、大きく分けて２つあります。
- ブログサービスを利用してブログを始める。
- CMSを利用してブログを始める（ワードプレス等）。
どっちを利用してもメリット、デメリットありますがWEBの知識が無ければブログサービスを利用してブログを始めるのがおすすめです。
ブログサービスって何？
ブログサービスとはWEBの知識が少なくても簡単にブログを始められるようにブログを作る場所を提供しているサービスです。
ブログサービスを提供してる会社は数えきれない程あります。
ブログサービスを選ぶポイント
ブログサービスを選ぶべきポイントは、
- 独自ドメインが使えるか。
- アフェリエイトが掲載できるか。
- GoogleアナリティクスやGoogleサーチコンソールが登録できるか。
ブログサービスのメリット・デメリット
メリット
- WEBの知識が少なくても簡単に始められる。
- 自分でサーバーを借りたり管理する必要がない。
デメリット
- 突然のサービスの終了の恐れ
- 運営会社にブログを消さる恐れ
デメリットがありますが、独自ドメインを取得し運営していればリスクは回避できますし、普段からルール、規約に則った記事を書いていれば消される心配もありません。
で、どのブログサービスがおすすめなの？
上記のブログサービスを選ぶポイントを考慮して現在おすすめなブログサービスは、
はてなブログです。
はてなブログの一番の特徴は、初心者でも簡単にブログを始めることです。
まずは、はてなブログで作成しましょう。
