Bloggerを使っていると、デザインに色々と不満が出てきます。色々なテーマを試してみたのですが、パソコン表示が良いとスマホ表示がイマイチだったり、またその逆だったりします。
htmlを編集する知識は持ち合わせていないので、テンプレートをhtmlの編集以外方法で何とか出来ないかと調べてみたのですが、予想通り、無理みたいでした。
しばらく、Bloggerで提供されているテンプレートのテーマで試行錯誤していたのですが、あとちょっとのところで、バグというか、上手くいかないところが残ってしまいました。
どんなデザインを考えているかを話しておかないと、訳がわからないと思いますので説明しておきます。
トップページは、上から、タイトル~メニュー~メニューページ~記事~関連コンテンツ(人気の投稿)です。
各記事のページは今ご覧の通りで、上から、タイトル~記事~関連コンテンツ(人気の投稿)と言う感じです。
これにプラスして、AdSenseを適度に組み込んだ感じが理想なのですが、Bloggerのテンプレートだと、重なったところがあたり、文字位置がおかしかったりと、微妙に気になる部分があり増した。
と言うことで、思い切って無料で提供されているBlogger用のテーマを使ってみることにしました。
Bloggerテーマで検索すると、テーマをたくさん提供しているサイトの紹介や、お勧めテーマを紹介しているサイトがあるのですが、今回使ってみた「Vaster2 」だけが、単体でテーマを紹介していたので、これを使ってみることにしました。
まぁ、テーマのサイトや、何種類も紹介されても良く解らないというのが一番の理由ですが。(^_^;)
ここからは導入方法の説明です。
先ずは、テーマのダウンロードです。
トーマススイッチというホームページからダウンロードします。→
こちら
ページの中間あたりにダウンロードリンクがあります。
レスポンシブ対応、SEO対策済みのblogger日本語テンプレートとなっているようです。
テンプレートデザイナー付きのものと、無しのものがありますが、私は有りのものを選びました。
ダウンロードしたら、下の図のバックアップ復元をクリックします。
そうすると、次のようなウインドウが出てくるので、テーマのダウンロードを選択して、現在のテーマを保存しておきます。
続いて、ファイルを選択をクリックして,先ほどダウンロードしたテーマを選択して、アップロードボタンを押します。
これで、テーマが読み込まれて変更されます。
はい、とっても簡単ですよね。
ただ、このままでは使い物にならないので、配置を色々と変更しなければいけません!
まぁ、配置に関しては好みもありますので、お好きにと言いたいところですが、折角なので、このブログの配置を紹介しておきます。
header
「ページ」ガジェットは下記のような配置にしてあるます。
サイトマップってどうやって作るんだよ~~と言う方のために、サイトマップの作り方は、別ページで説明します。→
こちら
main
ちなみに、HTML/scriptは空のままです。
sidebar-section
こちらも、HTML/scriptは空のままです。
footer
現状はこんな感じでレイアウトしてあります。※現在は若干変更してあります。
これでどんな表示なるのかは、ご覧の通りですので、ご確認ください。
とりあえず、このテンプレートのおかげで、パソコンもスマホも理想のデザインに近づきました。
欲を言えば後1点あるのですが、現状でもかなり満足できました。
まだ、配置以外は特に変更していないので、文字の種類や色なども色々変更して行きたいと思います。
作成し、無料で公開してくださった作者に感謝致します!
コメント
コメントを投稿