はじめてのTumblr覚書

最近まで、Bloggerを使用していたが、新しい年を迎えるにあたりブログシステムも新しく・・・と考え、Tumblrを使用することにした。TumblrもBlogger同様、HTMLを自由に編集することが可能であるため、カスタマイズには事欠かない。

今回、はじめてTumblrを使用するにあたり、導入事例としてメモを残すことにした。

コメントシステム

Tumblrには標準のコメントシステムが用意されていないので、Disqus ? The Web’s Community of Communitiesを使用することに。筆者が使用しているテーマは、”Optica”であるが、Disqusに対応しおり”Disqus shortname”を設定するだけで利用できる。

Googleアナリティクスとウェブマスターツール

ブロガーであれば誰しも導入している定番のツール。サイトマップは以下のとおり。

http://jkuntum.tumblr.com/sitemap1.xml
http://jkuntum.tumblr.com/sitemap-pages.xml
http://jkuntum.tumblr.com/rss

※サイトマップにアクセスする前に、必ず記事とページを一つ以上投稿しておく必要がある。そうでないとサイトマップが正常に作成されず、以降修復不可能になる。

ページタイトルのフォーマット変更

ブログ名+ページタイトル → ページタイトル+ブログ名

<title>{block:SearchPage} ({lang:Search results for SearchQuery}){/block:SearchPage}{block:PermalinkPage}{block:PostSummary}{PostSummary} − {/block:PostSummary}{/block:PermalinkPage}{Title}</title>

アドセンス

筆者の利用しているテーマ”Optica”は、モバイル端末にも対応しているため、パソコン・モバイル端末共通で同一アドセンスコードが利用できる。よって、アドセンスはレスポンシブを採用する。

タグクラウド

Tumblr Tag Cloud Widgetを使用。

関連記事

以下のコードを貼り付けるだけ。

<!-- 関連記事 開始 -->
{block:Permalink}
{block:HasTags}
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript"></script>
    <script src="http://tumblr-in-link.googlecode.com/svn/trunk/js/tumblr-in-link.1.0.js?num=5&len=60&css=simple&title=Related Posts&tags={block:Tags}{Tag},{/block:Tags}" type="text/javascript"></script>
{/block:HasTags}
{/block:Permalink}
<!-- 関連記事 終了 -->

Markdownエディタ

TumblrはMarkdownに対応しているので、Markdownエディタで記事を書くことに。また、画像はFlickrを利用している関係で、HTML→Markdown変換にHTML を Markdown へ変換を利用することにした。

15540015674_7f759a5408_o.png

共有ボタン

Twitter・Facebook・Google+などの共有ボタンは、忍者おまとめボタンを使用することにした。

以上、簡単ではあるがメモまで。まだ記事数が少ないため、検証できない項目もあるが、追ってチェックしたいと考えている。

admin
カテゴリ:ブログサービス
タグ:忍者 tumblr
2015/01/02 00:01 | Comment(2)
この記事へのコメント
突然の書き込みすいません。
Tumblrの超初心者です。
画像の部分にGoogleカレンダーを表示させたいと思っています。
どうすればいいかアドバイスをいただけないでしょうか?
htmlを編集するようになるのでしょうか?

よろしくお願いいたします。

画像
http://www.geocities.jp/saru666666/img/img2017.jpg

デモサイト
http://phoenix-theme.tumblr.com


Googleカレンダー
<Iframe src = "https://calendar.google.com/calendar/embed?src=...> </ iframe>
Posted by 武田誠 at 2017/01/07 21:23
コメントありがとうございます。

Googleカレンダーの貼り付けたいカレンダーの”詳細”にある・・・

「このカレンダーを埋め込む
このコードを自分のサイトやブログに貼り付けると、カレンダーが埋め込まれます。 複数のカレンダーを埋め込むには、[カスタム リンク] をクリックしてください。」

に表示されている・・・ (例 ↓)

<iframe src="https://calendar.google.com/calendar/embed?src=xxxxxxxx%40gmail.com&ctz=Asia/Tokyo" style="border: 0" width="800" height="600" frameborder="0" scrolling="no"></iframe>

タグを”HTML編集”で表示させたい場所に貼り付ければOKです。

Tumblr独自のタグに関しては、下記参照願います。

Tags of tumblr.
http://tagblr.tumblr.com/
Posted by 管理人 at 2017/01/08 06:50
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]