Tumblrのテーマをカスタマイズして簡単にブログを作る方法

投稿者：KIKUMA

Effector Theme

Tumblr大好きkikuma(@circustic)です。旅行などをすると写真や記録などをブログとして残したくなりますよね？

今回はTumblrを使った簡単なブログの作り方をご紹介致します。

もし宜しければトラベルハックTumblrアカウントもぜひフォローして下さい！

1.Tumblrでブログを作るメリット

広告がないのに無料で使える
容量は無制限（正確には一日ポスト出来る上限がある）
独自ドメインを割り当てる事が出来る
投稿が簡単（スマホやメールからの投稿にも対応している)
無料デザインテーマが豊富（カスタマイズをする事も出来る）
TwitterやFacebookとの連携にも対応している
関連ツールが豊富

１からデザインをするというのは難しいので既存の「テーマ」と呼ばれるモノをカスタマイズして簡単なブログを作る方法をご紹介致します。

2. Tumblrの無料テーマ「Effector」をインストールする

僕がオススメするテーマは「Effector」です。シンプルな２カラムのデザインに加え、かなり柔軟なレイアウトのカスタムが可能な点が魅力です。

Effectorをインストールする

3. テーマのカスタマイズ

カスタマイズの方法として管理画面で編集する方法と直接HTMLを編集する方法がありますが、今回はテーマ自体が持っている管理画面を使ってベースの形を整えて行きます。

Tumblrのテーマをカスタマイズする

押さえておきたいポイント

クリックで拡大

カスタマイズ画面の左メニューにデザイン設定という項目があります。

Background (背景画像の設定)
Banner (タイトルの下に大きな画像を設置する)
Large Sidebar Portrate (サイドメニューに写真を追加する)
Logo (サイトのロゴを設置する)

ロゴを上部に配置する場合デザイン設定の中にあるBlog in top barのチェックボックスをオフに、Logo in Top barのチェックボックスをオンにする事で上部に配置する事ができます。

4. 背景画像を用意する

背景画像を用意するにあたって気をつけたいのが継ぎ目が出ないような画像を用意する事。パターンと呼ばれる繰り返しても継ぎ目のない背景素材を用意するか1600×1400くらいのかなり大きな画像を用意しましょう。

背景に使えるパターンいろいろ | DesignWalker
サイトの背景を変えるだけでもサイトの印象は大きく変わります。今回は、簡単に使える背景パターンのジェネレータとパターン素材をまとめてみました。 …

押さえておきたいポイント

背景を暗めの画像にする時はカスタマイズ画面のinvertにチェックを入れる事で文字色やアイコンが白に反転します。

クリックで拡大

背景に大きな一枚絵を使用したい場合はFixed Backgroundにチェックを入れる事で背景の大きな画像を固定で配置する事が出来ます。

5. Google Analyticsのアクセス解析をつける

自分のサイトに何人アクセスをしているか気になりますよね。Tumblrにも勿論Google Analyticsのアクセス解析を導入する事が出来ます。

まずはGoogle Analyticsに登録して下さい。

登録が完了すると「このコードを貼付けて下さい」というコードが発行されるのでそのコード中からプロパティIDというモノをコピーします。

「UA-000000-1」のような部分がプロパティIDなので、それを書き留めカスタマイズ画面に戻ります。

先ほどのデザイン設定項目よりさらに下へスクロールして貰うとGoogle Analytics Web Propertiy IDという項目がありますので、そこにプロパティIDを記入すれば設定が完了です。

ね、簡単でしょ？

6. DISQUSに登録をしてTumblrにコメント機能を付ける

DISQUSというコメントやソーシャルネットワークでの反応を表示してくれるプラグインサービスがあります。今回はDISQUSを使ってTumblrにコメント機能を追加します。

まずはDISQUSにアクセスしサイトの登録をして下さい。

必要事項を記入するとDisqusShotrnameというIDが発行されますので、それをアクセス解析の時と同じように書き留めておきカスタマイズ画面に移動します。

今度はDisqus Shotnameという項目に先ほど書き留めたDisqus Shotnameを記入して保存ボタンを押せばあら簡単！

Tumblrのページにコメント機能が追加されています。

7. タグリストをつける

Tumblrにはカテゴリーという概念がないのでこれをタグを変わりに使う事にします

【連載】『Tumblr』のおさらい (11) タグを付けて投稿&タグクラウドを表示させる | ネット | マイナビニュース
記事にタグを付けて投稿しただけでは、自分のTumblrのサイトに変化はない(図7)。そこで、次はTumblrにタグのリスト(タグクラウド)を表示する方法を見ていこう。タグリストの表示には、Tumblr …

8. 独自ドメインを割り当てる

先日ドメインを割り当てる方法を書いたのでそちらで説明しています。

ムームードメインで取得した独自ドメインをTumblrに設定する方法 | トラベルハック｜あなたの冒険を加速する
深夜の時間帯になると肌色の画像がダッシュボードに流れて来るのが楽しみです。ムームードメインで取得した独自ドメインをTumblrに設定する方法を今回はご紹介致します。 …

9. Tumblrでブログライフを送ろう

ロゴのデザインやBanner画像などを用意するには、多少専門的な知識も必要ですが友人に頼むなどをすれば、そこそこクオリティの高いブログが出来上がると思います。最近では芸能人や企業サイトでもTumblrをブログとして使う事例が増えて来ています。

Tumblrで作った有名人・企業・ブランドの公式サイトまとめ – NAVER まとめ
Tumblrはミニブログのホスティングサービス。Twitterと同じカテゴリとされるが、テンプレートのカスタマイズ性の高さ、リッチコンテンツの扱いやすさ、独自の情報伝播の仕組みなどの特徴を持つ。3月に …

10.これからTumblrを始める人へ

今回の記事は比較的Tumblrを使った事のある人へ向けた記事となっておりますので、まだこれからTumblrを始めたいと思っていらっしゃる方はこちらの記事が参考になります。

Tumblrをこれから始める人へまず読んでおきたい記事１０選 | A!@attrip
Tumblrをはじめようかな？と思うんだけど、ぜんぜんわからない！とかメモなの？とか twitterとどう違うの？とかいろんな質問をされるのですが、まずこの辺を読んでみるとなんとなくどん …

次回もTumblr強化月間としてもう少し記事を書いてみようと思いますので、気になった方は(Facebook , twitter , tumblr , RSS)で定期購読をして頂けますので登録の方宜しくお願い致します！！