Wednesday, June 18, 2014

New design

デザイン(template)を新しくしましたぁ。

「Read more」をつけてページを見やすくしました。
Blogger公式でも付いているけど、それだと毎回手動でつけないといけないし、記事ごとの要約の長さがバラバラになるので、自動追記機能を付け加えました。

メニューにLINKのページを追加しました。
Blog LinkとShop Linkをページでも見られるようにしました。
と言うのも、モバイルで見ると、ガジェットが表示されてなかったってことを最近知りました。ガジェットが表示されていないってことは、BlogrollもCategoriesもBlog Archiveもモバイルからは見えてなかった!知らなかったぁ。
それでモバイルからもBlogrollとShopは見えるようにLINKのページとして追加しました。
(どうして標準のモバイルテンプレートはガジェットを表示しないようにしているんだろう。。。)

「Back to Top」ボタンを設置しました。
ページ下へスクロールした時、ページトップへ戻るボタンがあったら便利かなぁと思ったので(前のデザインの時にあった方がよかったような気がする)
スピードとかはコントロール出来ないタイプだけど、さっと動いていいかなぁ思う。

この間書いたInternet Explorerで見ると写真が表示されていなかった!」件も直りました。
モバイル用のtemplateは、モバイル用を使うか、PCと同じにするか選択出来るんだけど、モバイル用にしました。
ただ、モバイル用だと埋め込むんだyoutubeのビデオが枠からはみ出てしまってて。
枠に収まるようにCSS追加したんだけど、まだはみ出てる。。。という問題が残ってます。
でも、モバイル用はカスタマイズしてないし。。。それでもはみでるということは、みんなもはみでてるってこと?
よくわかりません(_ _。)・・・

Bye-Bye 以前のデザイン。

新しいデザイン。

後、いろいろと。。。

ここからは独り言なので、気にしないでスルーしちゃって下さい。

画像と文字の幅を揃えるって言ってたの、画像の最大と最小の幅をCSSで設定したら、過去にいろいろなサイズ指定で投稿していた写真も揃うようになったぁ。

でも。。。


画像を投稿する時、配置をセンターにすると、Bloggerの投稿エディタがオートで”margin-left: 1em”を付けて、左側に1emのスペースが出来てしう。。。
画像をセンター寄せで、マックスの幅を100%にしたら、左のラインが文字と揃うはずなのに、1em画像が右にずれる。
”margin-left: 1em”は文字との余白をつける為にオートで付いているように思う。
だから画像を左寄せにセットしてみたら、”margin-left: 1em”は付かなかった。左寄せで投稿しようかなぁ。でも、”margin-bottom: 1em”が付いて下に余白が出来るけど。。。。これも、右側と下側に来る文字との余白の為に付いているのかなぁ、と思う。
もしまたデザイン変えた時に(変えるつもりは当分ないんだけど)左寄せにしていたら困るかもしれないから、これから投稿する画像はやっぱりセンター指定で、オートで付く”margin-left: 1em”は取ることにしよっかなぁ。
ちなみに、CSSで”.post-body img {margin-left: -1em}”って追加したら過去の画像もバシッって左側が揃ったけど、Read moreで表示される画像が今度は左にずれたぁ。
それは困る。やっぱりやめておこう。


ビデオが枠からはみ出るのはtemplateをPCと同じにしたら解決するから、そうした方がいいかなぁ。。。う〜ん、検討中。

No comments:

Post a Comment