戯れ言葉

戯れ言葉

テンプレの変更

テンプレートを変更しました。 例によって Akira氏  のテンプレートで La_Vita  と云うテンプレートですが 今回もかなり手を入れてます。 要約表示といって トップページが 記事の要約リストになっているという タイプにしたかったので。 暫く不具合が出るかも知れませんが お目こぼしを。...

サーチコンソールのモバイル ユーザビリティで問題のあるページがゼロに

グーグルサーチコンソール ( Search Console )の モバイルユーザビリティで 問題のあるページが長い間0にならなかったのですが 4月に入ってから急に0になりました。...

ブログのテンプレート(基本デザイン)移転

最近、ブログのテンプレート(基本デザイン)を 変更しました。 The other way round と云うブログを運営されている Akira氏デザインの Synchronisity と云うテンプレートです。 Akira氏のテンプレートはかなりお洒落で 私のような老人にはかなり気恥ずかしい そんな中で、一番地味なテンプレートが Synchronisity です。 当然レスポンシブ完全対応です。 変更した理由は、 サイドコラムの表示の仕方なんですが 記事...

スマホ対応のレスポンシブ スマホの横幅を超える表示でスクロールバー

 以前の記事 スマホ対応のレスポンシブ その他 3 記事内アフィリ で書いた様に、 記事内のバナーやアフィリがスマホの横幅より広いときに横スクロールさせて、 スクロールバーを常時表示させる処理をしているのですが、 私が今回手に入れた楽天モバイルのスマホ、Aquos SH-RM02 での表示で、 Chrome では上の画像の様にバーが表示され、バナーやアフィリを横スクロールさせることができると明示できます。 ところがAndro...

スマホ対応のレスポンシブ スマホにPC のデザインで表示

環境設定から出来る様になりました。せっかくスマホにも対応したデザインにしたのですからスマホ専用のテンプレートを使用せずこれをスマホにそのまま表示する様にしています。 いただいたのは こちらほんっとにはじめての HTML5 と CSS3 様の(ちょっとメモ)FC2ブログで PC用テンプレートをスマホで適用させるの方法です。 私は スマートフォンで見たときに出るスマートフォン版で表示のバーを表示させない#change_mobile {...

スマホ対応のレスポンシブ Youtubeの横幅を可変に

スマホ対応のレスポンシブで、今度はYoutube の貼付けも、どうにかしなくてはいけなくなりました。 そこはさすがにネット社会。捜してみると色々出てくるものです。 例によってセンター表示も可能にする為に私がとった方法は次の通りです。 まず、CSS で次の様に定義しておきます。 殆どパクリです。 最下段の提供記事を参照してください。 .iframeObj { position: relative; padding-bot...

スマホ対応のレスポンシブ アフィリの横幅

 スマホ対応のレスポンシブにした結果、派生した問題の第3弾です。 私も人様のまねをして記事内やサイドカラムに広告をいれています。 で、問題になるのは横幅が狭まったときに右側がケラレてしまう記事内の横長な広告と、横配置したブログランキングのバナーです。 特に、アフィリエイトリンクのHTML のソースやサイズ等の変更は禁止されているので、縮小表示とかはできません。 色々調べて見ると、横幅が狭くなったとき横ス...

スマホ対応のレスポンシブ tableタグで

映画のエンディングでのキャスト等の紹介画面。 特に洋画では必ず担当と人名の文字列をセンターから左右に振り分けて んな風にデザインしています。 あちゃらの人たちが使っている文字は ひとつひとつの文字の横幅が全部違っています。 また、日本のように縦横の文字数の決まった原稿用紙に書くという感覚がないようで 縦書きで文字間隔は全部同じという日本の文化とは 文字配置のデザイン感覚が全く違うと感じます。 ...

スマホ対応のレスポンシブ 画像のサイズ指定は

 2017/02/08 色々不具合があり修正  せっかく可変幅にしたのですが、過去に貼付けた画像が旨く縦横比を保ったまま小さくなってくれません。  で、色々試行錯誤の結果、良好なのが次の様な方法でした。  私のブログは、画像に枠線を付けるているのでCSS に下記のように書いてます。 .entry_body img { max-width: 97%; height: auto; /* 画像に枠 -------- */ margin: 5px 1em;/* すべての画像の左右に...

ブログのデザインを変更 可変幅

ブログをスマートホンとかに対応する為には専用のテンプレート(デザイン)を用意するのが本来なのでしょうがそこまでの気力もないしなにしろスマホ自体を持ってないのでパソコン用に作ったものの幅を大きくしないでスマホにそのまま表示させるとかやってきたのですがやっと、ブログの横幅が自動で可変するテンプレートを見つけました。てつぼのFC2ブログテンプレート工房 さんのMont-St-Michel というテンプレートです。今まで...