たつブロ

アラフォーWebデザイナーの福岡のグルメや日々についての事など、いろいろ雑多なブログです。たまに阪神のことも...

「はてなブログ」カスタマイズの小ネタとカスタマイズ記事のまとめ

「はてなブログ」カスタマイズの小ネタ

どうも、たつとら(@tatsutora6) です。

 

皆さんの中には「はてなブログ」のカスタマイズをいろいろやられている方も多いと思います。

 

ボクも時間がある時、ちょっとずつやっていて紹介もしていますが、今回はちょっとした小ネタ的なカスタマイズの紹介と今年も最後なので今年紹介したカスタマイズのまとめを紹介してみようと思います。

 

 

ちょっとした「はてなブログ」カスタマイズ

TOPページのみ「はてなスター」、「Bookmark」を消す

「はてなブログ」では、「はてなスター」を表示させるか消すか悩むのは必ず通る道かと思います。

 

ボクもこの先、消すかどうか迷っていますが、とりあえずTOPページだけ「Bookmark」と一緒に消そうと思ってカスタマイズしました。

 

ブログのTOPページは「はてなブログPro」の人であれば「一覧表示」にした場合、それぞれで設定しているデザインテーマによって変わってきますが、「はてなスター」と「Bookmark」が表示されています。

 

ボクが設定しているテーマ「薄グレーなテンプレ」もTOPの記事毎に「はてなスター」と「Bookmark」の表示があります。

「はてなスター」と「Bookmark」の表示があります。

表示されていれば、このまま「はてなスター」や「Bookmark」を押すことができるので、記事を読まなくてもそのまま押すことができます。

 

記事を読まず押す人は、まぁいないと信じたいですが記事内の「はてなスター」はまだ残しておきたいので、念のためTOPだけ消すようにしました。

 

方法は簡単、この下のコードを【ダッシュボード】>【デザイン】>【カスタマイズ】>【デザインCSS】に入れるだけで消すことができます。

.archive-entry-body .social-buttons {display: none;}

 

やはりブログを書いている以上、記事を読まれてから「はてなスター」や「Bookmark」を押されたいし、TOPページだけ見て離脱されたら記事のアクセスも減りますからね...

 

タイトルの文字の太さや大きさを変更

次にタイトルの見た目を変えてみたいなら、タイトルをちょっといじってみましょう。


普通何もしてなければこういう見た目ですが、

何もしてない見た目

 

個人の好みになりますが、「ちょっと野暮ったいかな」と思ったので下のように変更しました。

タイトル変更

 


とりあえず、文字の太さと大きさを変更しています。

 

太さを変更する場合は下記のコードを入れます。

.entry-title{ font-weight: normal;}

 

大きさを変更する場合は、

.entry-title{ font-size: 00%;}

 

 

上の00%の部分は好きな数字を入れましょう。ちなみに上の画像のタイトルの大きさは170%で、これより大きくしたい場合はこれより大きい数字を、小さくしたい場合は小さい数字をいれましょう。

 

上2つのコードはまとめることができるので、

.entry-title{
font-weight: normal;
font-size: 00%;
}

 

このように書く事も可能です。

 

 

このコードも【ダッシュボード】>【デザイン】>【カスタマイズ】>【デザインCSS】に入れるだけです。

 

過去記事を簡単に差し込む方法

そしてこれはカスタマイズとは言えないかもしれませんが、記事を書く際に過去の記事をブログに入れる事もあると思います。


その場合、普通こちらの赤丸のリンクをクリックしてURLを記述して記事を差し込むと思われますが、

赤丸の中のリンクをクリックしてURLを記述して

 

いちいちURLをコピーして過去の記事を入れるは面倒の場合もあるかと思います。


そういう時は、今から紹介する方法で差し込んだら比較的楽に済むかと思われます。


記事を書く際に、右にある赤丸の「+」のアイコンをクリックします。

+のアイコンをクリック


すると「編集サイドバー」が出てくるので、ここにある「過去記事貼り付け」の項目をタブに追加しましょう。

「過去記事貼り付け」の項目をタブに追加しましょう。



先ほどの「+」の所に「過去記事貼り付け」のアイコンが表示されるので、このアイコンをクリックします。

「過去記事貼り付け」のアイコンが表示されるので、このアイコンをクリック



クリックすれば、アイコンの右側に過去記事の一覧が出てくるので入れたい場所にキーワードで検索した過去記事をクリックします。


すると下に「選択したアイテムを貼り付け」
のボタンが表示されるので、そのボタンをクリックすれば記事内に挿入されます。

「選択したアイテムを貼り付け」のボタンが表示されるので、そのボタンをクリックすれば記事内に挿入されます。


ただ、下の画像のように「ブログカード」のみでの挿入になるので、

「ブログカード」のみでの挿入になる

ブログカード

 

テキストで挿入したい場合はリンクボタンから入れる必要があります。

 

その他にも「編集サイドバー」には、便利で使えるショートカット機能があるので一度目を通してみるのもいいかもしれません。


以上、ちょっとした「はてなブログ」のカスタマイズの小ネタでした。
気になった方は試してみて下さいね。

 

スポンサーリンク

 

カスタマイズ記事まとめ

そして、とりあえず今年も最後の投稿になり、大して多くなく羅列になりますが一年間で紹介したブログのカスタマイズ記事(厳密にカスタマイズと言えないものもありますが...)も載せておきます。

 

1.「はてな」ブログで記事を書く際「大見出し」がh3タグとズレているので、注意が必要ですよ。

www.tatsublo.net

 

2.ブログで表を入れることもあるかと思いますが、このツールを使えば簡単に作成できます。

www.tatsublo.net

 

3.ブログの「見出し」と「目次」デザインを変更したので記事にしました。

(余談ですが、よく「目次」にindexという表記がありますが、indexは「索引」であって「目次」はcontentsですよ)

www.tatsublo.net

 

4.上に戻る時に一気に戻りたかったので「戻るボタン」を設置しました。

www.tatsublo.net

 

4.箇条書きやリストをオシャレに変更したかったので、簡単にできるいくつかのデザインを載せました。

www.tatsublo.net

 

まだまだ、ボクのブログもカスタマイズしたい箇所は沢山あり、他の方のブログを読んでいると気になって取り入れたいカスタマイズもあるので、時間があるときにカスタマイズし紹介できるものは紹介していきたいと思います。

 

では、また。 

 

 

 

 

スポンサーリンク

  

アフィリエイト始めるなら

初心者でも安心のサポート!アフィリエイトを始めるならA8.net

 

もしもアフィリエイト

 

こちらも合わせてお読みください

www.tatsublo.net

 

www.tatsublo.net

 

www.tatsublo.net