より長続きするブログ

続けていきたい気持ち。

Tumblrで画像付きブログを投稿する方法

Tumblrテンプレート作ってます

とあるご縁があり、WebデザインをTumblrテンプレートに
落とし込む作業を行っております。
画像+文章の、シンプルなブログスタイルです。

ところで、Tumblrは画像をText投稿からも入力できたりして、以外とややこしい。
ですので、自分が調べた、画像+文章をTumblrの投稿する方法について、
基本的な部分を2通りメモします。

その1 Photo投稿

画像がメインコンテンツの場合、この投稿方法を使います。
ログインすると表示されるメニューから、「Photo」を選びます。

f:id:neilling:20160409030646p:plain

 

画像をアップロードするか、Web上にあるURLを指定するか聞かれます。

f:id:neilling:20160409030901p:plain

 

今回はアップロードする方法にしますので、左側の「Upload photos」を選びます。
適当な画像と選択すると、画像が投稿フォーム上に表示されます。

f:id:neilling:20160409030943p:plain

 

一つの投稿に複数の画像を入れたい場合は
「Add another」でさらにファイルを選択します。

文章を入力する場合、
「Add caption, if you like」に入れておきます。

タグを付ける場合は、#は自分で入力しなくても大丈夫 (しても大丈夫ですが)。
複数のタグを付ける場合は「,」か「Tab」をキー入力すると区切ることができます。

 

例えばこのように入力してみました。

f:id:neilling:20160409031212p:plain

 

後はPostを押せば投稿完了となります。

その2 Text投稿

Photo投稿よりもより普通のブログチックな投稿方式です。
メニューの左端のアイコンから投稿フォームを開きます。

f:id:neilling:20160409031546p:plain

 

投稿フォームが表示されます。

f:id:neilling:20160409031628p:plain

 

この画面で画像を挿入する場合、「Your text here」と表示された欄に
カーソルを合わせてください。何か+マークが表示されます。

f:id:neilling:20160409031738p:plain

 

+マークをクリックするとメニューが展開!

f:id:neilling:20160409031821p:plain

 

この中から一番左のカメラマークをクリックすると画像ファイルを選択できます。
すると画像をカーソルの位置に挿入可能です。*1

画像ファイルを挿入し、記事タイトル・文章・タグを入力していきます。この辺りはPhoto投稿と全く同じ。

f:id:neilling:20160409031915p:plain

 

これでPostを押せば投稿完了です。

2つの投稿方法、どちらを使えばいいの?

一長一短です。今僕が作成しているテンプレートに関して言えば、Photo投稿をおすすめします。

Photo投稿の特徴

  • 写真が高解像度で保存できます。
    (ブログ記事の写真をクリックすると、大きな写真が表示されるはず)
  • 高解像度の写真の間に文章を書き込むことができません。Text投稿と同じ方法なら可能)
  • 記事タイトルが入力できない*2

Text投稿の特徴

  • 記事タイトルを設定できる
  • 解像度の高い画像を保存できない(最大540px(?)に縮小されるそう)

締め

以上で画像+文章投稿の基本的な流れは抑えたつもりですが、
他にも色々と機能があります(公式ドキュメント参照)。

Tumblr、シンプルだけど調べると大抵のことができて、その上無料。
なんてありがたいんだ。

*1:別の画像挿入方法として、Ctrl+vでクリップボードの画像をカーソル位置に貼り付けることもできます。

*2:作成中のテンプレートではこの欠点をフォローするため、タグの内容から記事タイトルっぽいものを表示させるようにしています。