たけもものなんとなくな日々

記事一覧ページのモバイル対応？

2017-06-22T12:54:00.000+09:00

前回の記事一覧ページをつけてみましたのモバイル表示が解決したように思われますので、記録しておきます。

記事一覧ページのモバイル表示の対応

そのままではこのようになっていた表示が

文字が重ならないようになりました。

リストの表記が「■」から「・」になってしまいましたが、「＜ul＞」の指定の仕方がまだよくわかっていないので、まずはこのままです(^^ゞ

ここまでやったことを記録しておきます。

linkのスタイルシートの読み込みを止める

Blogger 記事を一覧表示するページの作成方法
3．編集ページにおいて、以下のソースコードをコピーして貼り付けます。
30 <link rel="stylesheet" type="text/css" href="…css" />

こちらのコードの30行目の<link…>を「」で囲むみます。

このままでは「NEW」の表示が黒いままなので下記のコードを追加します。

<style>

#main .poststoc-new

{ color: #eb2142; font-weight: bold; }

</style>

これで「NEW」と赤く表示されるようになりました。このようにほしいと思ったところを抜粋して追加するのもありかと思います。

投稿日も表示させたい

デモページでもう一度コードを作成して書き直しました。

時刻はここでは必要が無いと思いましたので、日付の「HH:mm:ss」を削除しました。

このようになりました。

リストのマーカーは、まあ、些事ということにしておきましょう(⌒▽⌒)

にしても、コードをきれいに表示させてたいという欲望が強くなってまいりました。

記事一覧ページをつけてみました

2017-06-21T20:20:00.000+09:00

記事一覧のページがほしい

記事一覧表示のページを作りました。

参考にしたのはこちらです。
garafuさんの「galife」

Blogger 記事を一覧表示するページの作成方法
Blogger の記事一覧を表示するページを作成します。ここで紹介する方法では、ソート順（タイトル名、公開日付、更新日付）、表示方法（一覧、ラベル別）を任意に指定できます。また、各要素にクラス名が割り振られているので、好きな表示を簡単に実現できます。

書いている記事はまだそれほど多くはないのですが、一覧表示があるととてもいいなと思いましたので、将来のために設置してみました。

記事一覧表示するために

丁寧な説明にもかかわらず、「DATA LOAD…」で止まってしまうことしばし。ちゃんと表示されるまでに手間取ってしまったので、備忘録として。

作成手順にしたがって作業する

コードが公開されているので手順通りにコピペしましたが、「DATA LOAD…」で止まってしまい、表示されません。何度も繰り返してみたのですが、うまく行きませんでした。

デモページで試してみる

デモページも何度も使わせていただきました。表示されないこともありましたが、なぜなのかは自分ではわかりません(^^ゞ

おそらく、アレもこれもと欲張ったことが原因かと思われます。

やっと一覧が表示されるようになったのですが、ここまで来てもまだブログで動かすことができませんでした。

デモページにはコードが表示さる

何度も読み返しながらやっているうちに、やっとデモページには生成されたコードが表示されているのに気が付きました。そのコードをコピペします。

このブログは「https:リダイレクト」で作成しておりますので、コードの中の2箇所の「http:」に「s」をつけました。

~~その他に自分のBloggerのドメインの「.jp」を「.com」に変更しました。~~
これはお問い合わせページ作成時にやっていたことなので、ここでもそうしてみました。

※ 2018-11-20追記

2018年05月くらいからだと思いましたが、

Bloggerの国別リダイレクトがなくなったようです。

記事一覧ページにメッセージを添える

ここまでの状態が下記の画像です。

ここに簡単なメッセージをつけました。

やはり、メッセージがある方が良いように思います。

モバイル表示の問題

なんとか記事一覧が表示されるようになりました。ところがモバイル表示がこのようになっています。

記事一覧の文字が重なってぐちゃぐちゃです…。

これはについては大本でもこのように記されています。

スタイルシート設定
スタイルシート
各要素に対してできるだけクラス名を割り振るよう作成されています。あらかじめあるスタイルシートで思うような表示ができていない場合、 <link /> を利用せず、自前で stylesheet を記述することができます。

これからの道のりのほうが、遥かに長く感じます。

直せる日が来ることを祈って、今日はおしまいにします。

お問い合わせページに背景色を足しました

2017-06-20T15:59:00.000+09:00

やっとの思いでお問い合わせページの背景色を変えました。

お問い合わせページの作成その1：お問い合わせページを作ってみました
お問い合わせページの作成その2：お問い合わせページにメッセージを付けてみました

テーマ(テンプレート)「Emporio」でお問い合わせページをつくる

お問い合わせページの作成はこちらの2つのサイトを参考にさせて頂きました。

トーマスイッチさんのページ

Bloggerの連絡フォーム機能を使ってお問い合わせページを作る方法
Bloggerの長所は、何といっても「本当に無料ブログかよ」と突っ込みたくなるぐらい、充実した機能とカスタマイズ性にあります。
その高機能っぷりを示しているのが、「連絡フォーム」と言うコンタクトフォームを気軽にブログに設置できる、と言うことではないでしょうか？

Crosgre（クロスグリ）さんのページ

Bloggerでお問い合わせページ（メールフォーム）を作る方法
Bloggerには「連絡フォームガジェット」というメールフォーム機能があります。
しかしサイドバー向けのデザインという前代未聞の仕様。使い勝手がすごく悪いです。文字は打ちづらいし、気づく人はいないし……多くのユーザーが不満を持っています。

上記2つのページを参考にして作ったのが、こちらです。

これはこれで良さそうなのですが、糸関連のブログの背景色は「夏虫色」。そうすると、このようになります。

スクショの縮尺が違いますが、そこはオトナの目でお願いしますm(_ _)m
これは美しくありません。はっきり言って「なにこれ？」という状態ですので、なんとかしたかったのです。背景色を「白系」にしたら？という誘惑と闘いました。

トーマスイッチさんのCSSコードにプラスα

CSSコードに背景色とパディングの指定を書き込みました。

.ContactForm h2{
background: #f7f7f7;
padding: 20px;
font-size:26px !important;
}
.form{
background: #f7f7f7;
padding: 20px;
font-size:16px !important;
}

赤字が書き加えたものです。その結果がこちらです。

だいぶ良くなったように思うのは、わたしだけでしょうか？

たったこれだけのことかもしれませんが、とても長い道のりでした。
これで、404Errorページもきれい、もとい、それなりなものを作ることができそうです。

Windows10のクリーンインストールが新しくなったようです

2017-06-15T12:21:00.000+09:00

クリーンインストールの手順が新しくなったようなので、まとめてみました。
MSの正式なアナウンスはこちらになります。

Windows Defender でデバイスとパフォーマンスの正常性を追跡する
Windows Defender セキュリティセンターの、デバイスのパフォーマンスと正常性のページでは、デバイスをクリーンインストールしたり、Windows 10 の最新バージョンに保持したりすることができます。デバイス正常性アドバイザーは、デバイスを監視し、正常性レポートにより、記憶域容量、デバイスドライバー、バッテリー残量、Windows Update の一般的な問題に対処するための情報と推奨事項を提供します。
さらにデバイスのパフォーマンスと正常性では、[新たに開始] の機能により、デバイスに Windows の最新のクリーンインストールを行うことができます。たとえば、デバイスでパフォーマンスの問題があったり、多数の不要なアプリがある場合などに使用できます。

再インストールの手順

何はともあれいちばん大切な作業はバックアップです。
再インストールの細かな注意事項は改めて調べてくださいね。わたしがいつも参考にさせていただいているのはこちらです。

「ぼんくんちのTV別館」
Windows 10 のクリーンインストール手順後半 (Creators Update 以降)「Windows 10 をクリーンインストールする手順」の解説ページ、後半です (前半はこちら) 。Creators Update 以降の手順を紹介しています。

では、本題に入りましょう。

ギアのようなマークの設定を開く

「設定」→「更新とセキュリティ」をクリック

「Windows Defender」をクリック。

「Windows Defender セキュリティセンターを開きます」をクリック。

ここから別のウインドウで「Windows Defender セキュリティセンター」が開きました。

Windows Defender セキュリティセンター

メニューがたたまれていてわかりにくいので赤丸をクリックして展開させます。

このように表示されます。

「デバイスのパフォーマンスと正常性」をクリック。

ここが少しわかりにくいと思いましたが、「新たに開始」の「追加情報」をクリックします。

「開始する」をクリックするとできるようです。

まだ実行していないので、なんとも言えないというとても無責任な説明です(^^ゞ。

以前よりはわかりやすいところに表示されるようになったと思います。

さて、ここでは「クリーンインストール」となっています。本当にまっさらにしたい場合、「例えばウイルスに感染してクリアにしたい」このようなときはメディアからのほうがいいと思います。

そのような場合に備えて、インストールメディアも用意しておいたほうがいいですね。

「ぼくんちのTV別館」さんの「Windows 10 をクリーンインストールする手順」が参考になると思います。

Win10の大型アップデートについて

2017-06-14T22:41:00.000+09:00

「Windows 10 Creators Update」がやって来た

1時間ほどで終わったので（ダウンロード時間を含みません）、思ったよりも早く終わりました。終わってから一度再起動して、トラブルは今のところありません。

夜間モードがあるらしい

今回のアップデートでやってみたいと思っていたのが、「夜間モード」です。
早速、設定してみました。

既定値ではあまりにオレンジ系に傾きすぎていたので、スライダーを右に寄せたのですが、これ、リセットがないんです。
自分なりに合わせてね、ということなのでしょう。

コントロールパネルはどこ？

その他はさっと目を通しただけなのですが、タスクバーのWindowsアイコンを長押しした時のメニューが違っていますね。
ここに「コントロールパネル」がありません。とうとう「設定」一本にしたの？！と探しました。
　ライフボートさんの解説でやっと見つかりました。

Windows 10 Creators Update後のコントロールパネルの位置
Windows 10は大規模アップデートして4月11日からWindows 10 Creators Update(クリエイターアップデート)を公開しました。
大規模Updateがあると、画面回りや各メニューの位置が変わることがあります。今回のアップデートでは「コントロールパネル」のメニューの位置が分かりにくくなっています。「プログラムのアンインストール」やら「ユーザーアカウント」追加などで「コントロールバネル」は使用されますね。

ある筈のものがない！というのはこれほどまでに焦ってしまうものなのですね。

クリーンインストールしたいなぁ

「無くて七癖」という言葉がありますが、自覚している癖は「あって四十八癖」だそうです。自覚している癖のなかに、自分の思考が行き詰まるとOSの再インストールをしたくなるというものがあります。XPは何度やったことでしょう。

Windows8からの繰り返しのアップデートなので、そろそろクリーンインストールをしたいと思っていたところに今回の大型アップデートの発表でした。

　少し使ってみてからOSをきれいにしようと思います。

お問い合わせページにメッセージを付けてみました

2017-06-02T15:20:00.000+09:00

お問い合わせページには、なにがしかのメッセージがあったほうが良いように思いました。そのままではぶっきらぼうというか、味気ないというか、そういった気分の問題だけではないようです。

前の記事：お問い合わせページを作ってみました

「お問い合わせページ」にメッセージを付ける

先日作成したお問い合わせページにメッセージを付けてみました。
Crosgre（クロスグリ）さんの記事を参考にさせていただきました。

ー核を書くーKaKuKaKu
Bloggerでお問い合わせページ（メールフォーム）を作る方法
　連絡フォームガジェットを個別ページに表示する方法と、CSSカスタマイズ、お問い合わせの雛形を掲載しています。コピペでOKです。

あいも変わらず、まるっとコピペですが、備忘録として。
テンプレートを編集する際にはバックアップを忘れないようにしましょう。

雛形に手を加える

クロスグリさんの雛形はそのままでも使えます。

その雛形を参考にさせていただくために行ったこと。

下書きとして「新しい投稿」もしくは「新しいページ」を雛形用に作成する。わたしは、新しいページで作りました。他の記事に埋もれないようにするためです。
HTMLモードにして雛形のコードをコピペします。
作成モードにして雛形の文章を整え保存します。
HTMLモードにし、作成したコードをコピーします。
ドラフトに戻り、「テーマ」→「HTMLの編集」→「ウィジェットへ移動」→「ContactForm」を選択します。
~~「<h2><data:title/></h2> </b:if>」~~「<div class='contact-form-widget'> <div class='form'>」というコードが少し下にあるので、その次にコピーしたコードを貼り付けます。
「テーマを保存」し、表示を確認します。

大体、このような手順だったはずです。

メッセージを付ける前と、つけた後の比較画像です。

なんだかいい雰囲気が出ました。やはり気分だけの問題では？と言われてしまいそうですが、気分も大切だと思います。

ちなみにテーマ(テンプレート)を「Emporio」にして適用した場合はこうなります。

この編集はまだ思うようにできませんが、おいおいできるようになったらいいなと思います。

この記事の続き

お問い合わせページその3：お問い合わせページに背景色を足しました

お問い合わせページを作ってみました

2017-05-31T14:23:00.000+09:00

私的な備忘録ブログですが、お問い合わせページを作ってみました。

お問い合わせページを作る

参考にしたのはトーマスイッチさんのこの記事です。

Bloggerの連絡フォーム機能を使ってお問い合わせページを作る方法
Bloggerの長所は、何といっても「本当に無料ブログかよ」と突っ込みたくなるぐらい、充実した機能とカスタマイズ性にあります。
その高機能っぷりを示しているのが、「連絡フォーム」と言うコンタクトフォームを気軽にブログに設置できる、と言うことではないでしょうか？

自分でやってみたことの確認です。

お問い合わせページをサイドバーに作ってみる

サイドバーに入れてみました。その結果が下の画像です。

かなりバランスの悪い配置になりました。

お問い合わせページをメインカラムで作ってみる

メインカラムに移してみました。

バランスも良く、見た目もスッキリしたと思います。

赤線で囲ったバーはサイドバーのときにはありません。

これはメッセージ送信時、上のバーには送信失敗のエラーメッセージが、下のバーには送信に成功した場合のメッセージが表示されます。

失敗した場合のメッセージを確認しておりませんのでわかりませんが、送信に成功した場合は「メッセージの送信成功」といった内容が表示され、間もなく消えてしまいます。

送信ボタンの表記を変えてみる

トーマスイッチさんの方法そのままでは送信ボタンが「Send」になっています。このままでは何か落ち着かないので「送信」と表示されるようにしてみました。

<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Send'/>

<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='送信'/>

赤い文字のところを「send」から「送信」に変えるだけです。

ここに何か気の利いたメッセージがあればなお良いのでしょうが、しばらくはこのままになりそうです。

この記事の続き

お問い合わせページその2：お問い合わせページにメッセージを付けてみました
お問い合わせページその3：お問い合わせページに背景色を足しました

「自分のページビューの追跡を管理」どうしていますか？

2017-05-15T12:32:00.000+09:00

Bloggerの「自分のページビューの追跡を管理」の設定は、そのままだとちゃんと機能していないようなのです。いくら「このブログの自分のビューを追跡しない」にチェックを入れても自分のアクセスがカウントされてしまいます。

この解決方法を書いてくださっている記事がありました。

Blogger でブラウザにブロック Cookie を追加する必要があります。って何？

ブログを引越していると、表示の確認やらで簡単にページビューの数値が二桁になってしまいます。「このブログの自分のビューを追跡しない」にしてもです。

このままではまた、スパムブログ認定されるのではないかとドキドキします。

ところが「Blogger でブラウザにブロック Cookie を追加する必要があります。」の意味がわかりませんでした。
調べていくうちにp--qさんが解決方法をまとめてくださっていました。

p--qさんの記事

Blogger：ページビュー設定(3)Chromeで自分のビューを追跡しないChromeでもCookieをいじる
ページビュー設定(2)Bloggerの設定だけでは自分のビューは除外されずの「Sleipnir4でCookie書き換え」と同じ手順を踏みます。

いつもありがとうございます。
詳しいことはp--qさんのところでご確認くださいね。

ちなみに今更ですが、自分のための備忘録として。

赤丸のところをクリックするとcookieが削除されます。
下記のコードはこのブログのアドレスに書き換えたものになります。

[
{
"domain": ".takemomo-bloggerotameshi.blogspot.jp",
"expirationDate": 1680603499.805707,
"hostOnly": false,
"httpOnly": false,
"name": "_ns",
"path": "/",
"sameSite": "no_restriction",
"secure": false,
"session": false,
"storeId": "0",
"value": "2"
}
]

3行目の自分のアドレスの先頭に「.（ピリオド）」を入れないと

「SyntaxError: Unexpected token in JSON at position 48」とErrorで弾かれてしまいますので、お忘れなく。

4行目の「"expirationDate": 1680603499.805707,」という設定はおそらくですが、Cookieの期限のことだと思われます。ここを削除してしまうと記憶されなってしまうようです。
5行目の「"hostOnly": false,」書き換える前の値は「"hostOnly": true,」となっていますが、このままではブラウザの再起動でリセットされてしまいますので、「.jp」だけではなく「.com」も書き換えました。

これでブログを表示してもページビューのカウンターが動かなくなりました。
安心して表示確認ができるようになりました。

2017-11-13　追記
コードはきちんと［］で囲まないと「SyntaxError: Unexpected end of JSON input」とErrorになります。
今更ですが、自分のために書き加えておこうと思います。

個別記事へのリンクが切られる

2017-04-30T21:35:00.000+09:00

bloggerをはじめて、初めて「FeedBurner」を使いました。
ここの設定次第で、ブログ記事へのリンクが切られてしまうこともあります。

引っ越し中のブログはブログ村と人気ブログランキングに登録しています。
そこで個別記事へのリンクが切られる、という現象が発生してしまいました。
その顛末？とまでは行きませんが、記録しておきます。

ブログ村等で個別記事へのリンクが切れてしまう！

ブログの先達よりのメッセージで、個別記事のタイトルからわたしのブログに入ることができない状態であることを教えていただきました。

問題として把握できたのは、下記の条件のときでした。

firefox + uBlock Origin ＝ NG　タブが開こうとするが開かない。
ログインした状態＝不明　ログアウトの状態＝ NG

google Chrome 広告ブロックアドオンなし＝ OK
ログインした状態＝OK　ログアウトの状態＝ NG　タブが開こうとするが開かない。

MS Edge ＋ AdBlock ＝ OK
ログインなしでも表示OK

ここでのログインは各ブログランキング等にログインしている状態か否かのことです。

このような状態だったはずです。

この現象をもう一度再現させて確認する度胸はわたしにはありませんので、確かかどうかと言われると…。

uBlock Originに追加しているJPN: ABP Japanese filters (日本用フィルタ)で捕縛されておりました。その際のメッセージ画面の画像です。

個別のアドレスにパラメーターが付加されたために ABP Japanese filtersの「_campaign=$document」項目にページまるごと広告扱いされてしまったか、もしくは解析付きなのではねられたかですね。

やってみたこと

なぜこうなったのかわかりませんでしたので、思い当たることを1つずつやってみました。

FeedBurnerの登録をし直す。（既存のものを削除して新規で再作成）
Bloggerの「設定ーその他」の「サイトフィード・フィードリダイレクト URL の登録」を空欄にする。
「FeedBurnerスタッツ」の「記事のクリックスルー集計のチェックを外す」

当然ながら「1」は必要のないことです。

そして「2」、これは空欄にしないほうがいいですね。ここを空欄にするとRSS等の配信がソースのみの表示になり、とてもわかりにくい画面になりました。

1つずつやってみてはブログ村等の管理画面から記事をすべて削除、再読込を繰り返しました。その結果、ようやく解決したのが「3」でした。
よくよく考えればわかりそうなものなのですが、その時は本当に思い至りませんでした。

もしかしたら同じようなことで迷路に迷い組んでしまう人もいるかもしれない、ということと、何より自分自身の備忘録として記事にまとめてみました。

もう少し詳しく掘り下げてみようかとも思ったのですが、これ以上はちょっと(^_^;)

Bloggerのこれは良いと思ったこと

2017-03-30T19:59:00.002+09:00

So-netブログとBloggerを使ってみて「これはいいな」、そう思った点を挙げてみようと思います。

下書きを自動保存してくれる
記事のタグ管理がとっても楽
何よりスマホ版表示でも広告がない（コントロールできる）

下書きを自動保存してくれる

So-netブログは下書きの保存に時間がかかります。

手動ですし、サーバーとの接続中は作業の一時中断が必要になります。数秒から、時には十数秒、それ以上に感じることもあります。この時接続が途絶えてしまったら下書きはなくなります。もちろん、初めからやり直しです。このダメージは計り知れません。

粗忽者のわたしは、保存前に無くしてしまった下書きがいくつかありました。

自動で下書きを保存してくれるこの機能がとても助かります。

「元に戻す」も便利♪と思った機能です。

ほかのツールを使って記事をアップしたらいいのかもしれません。

「Windows Essentials」を使ってみたこともありますが、「下書き」で投稿したはずが公開になっていたこともありました。

BloggerでWindows Essentialsを使っておられる方もいらっしゃるようなので試してみようかな？と思っています。

と書いてから改めてWindows Essentialsを調べてみたらこのようなメッセージがありました。
サポートは終わっているようです。

「Windows Essentials」を検索していると「Windows Essentials 2016」というものもあったのですが、これはMicrosoftのサイトでは見つけられませんでした。
フォトギャラリーが便利で使っていたのですが、サポートも終わっていますのでアンインストールすることにしました。

Windows Essentialsからの移行提案

「Windows Essentialsからの移行提案」としてまとめられているMicrosoftのコミュニティページを見つけましたので、リンクを張っておきます。

投稿ツールは「Open Live Writer」というのが代替えツールとして挙げられていました。

記事のタグ管理がとっても楽

So-netブログの記事を移そうと思ったきっかけの一つが「タグ」です。

So-netブログはタグを直そうと思うと、記事を下書きで開いて修正しての繰り返しになります。そのタグもブログのサイドコンテンツとして表示されるようにしておかないと、自分でもどんなタグをつけたのかわからなくなります。

ところがBloggerは管理画面から一括でタグをつけたり外したりできます。これはとても感動しました。

何よりスマホ版表示でも広告がない

広告がないというよりも、自分でコントロールできるということですね。

So-netブログから記事を移動しようと思った一番の理由が広告表示の在り方です。

So-netブログは広告を非表示にできるということでした。わたしはスマホを所有しておらず、パソコンにも広告対策をしていたこともあり、自分のブログの表示確認がおろそかになっておりました。

昨年、2016年10月31日「スマホ表示での関連記事の表示を追加」の告知で改めて確認してみたところ、驚きました。

アダルト広告もバンバン入ります。

手織りや手編みといった趣味のブログです。

自分ならこんなページは二度と来ない、そう思ってしまうような状態でした。

有料会員になってもスマホ版の広告表示がなくなるわけではないそうです。

So-netブログが悪いわけではありません

比べるブログがほかにないので「Bloggerいいところ」と思った点を挙げますと、どうしてもSo-netブログの旗色が悪くなってしまいました。

ですが、So-netブログが悪いわけではありません。

ツールの使い分けの話でしかないのかもしれません。

しばらくはSo-netブログとBloggerの両方を使ってみようと思っています。

サンプル代わりによろしかったらどうぞ

So-netブログにはこれからは身近な鳥や花のことなどを書き続けていきたいと思います。

「たけもも織り編みじゃない日記」

So-netブログから引っ越し中のブログはBloggerの新テーマ(テンプレート)「Emporio」を使っています。実際にどう動くかのサンプルにはなるかもしれません。

「たけもも織り編み日記」

Bloggerのテンプレート初期化

2017-03-23T14:22:00.001+09:00

2017-03-21、Bloggerに新しいテーマ(テンプレート)がありました。

メッセージのスクリーンショット撮っておけばよかったと今になって反省。

テンプレートを試しているうちにレイアウト等がごちゃごちゃになってしまうことがあります。そんな時のためにBloggerのテーマ(テンプレート)の初期化の方法を教えてくださっているサイトがありましたのでご紹介します。

その前に、今現在のテーマ(テンプレート)をバックアップしておいてください。

Bloggerテーマ(テンプレート)の初期化

syunkichi様が「おしゃれな気分でプログラミング」で詳しく書かれていらっしゃいますが、わたしなりに備忘録としてまとめてみます。

テーマ(テンプレート)の変更はBloggerの設定画面（ダッシュボード）から行います。

「テーマ」を選択し、使用しているテーマの「HTMLの編集」をクリックします。

HTMLのコードが書かれているところを全て選択します。

Windowsでしたら編集画面をクリックして「Ctrl+A」でもできます。

そこに魔法のコード「空のテンプレート」を貼り付けます。

<?xml version="1.0" encoding="UTF-8" ?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<b:skin></b:skin>
</head>
<body>
<b:section id='mainSection'>
<b:widget id="Blog1" type="Blog">
<b:includable id="main">
</b:includable>
</b:widget>
</b:section>
</body></html>

※ 2017-11-09 上記コードの最終行に誤りがありましたので修正しました。
</html>とあるべきところが</ht3ml> になっておりました。
匿名様、ありがとうございます。

「テーマを保存」します。
「戻る」を選択すると「dreft.blogger.comの内容:保存されていない変更は失われます」というメッセージが出ますが「OK」をクリックします。

「ブログで使用中」のテーマが真っ白になっています。
ここで任意のテーマを適用してもよさそうなのですが、このままだとレイアウトが崩れたりなど、表示に不具合が出る場合があります。
そこで念のため、シンプルテーマ（テンプレート）を一度読み込ませます。

これできれいなテーマ（テンプレート）が適用されるようになります。

レイアウト等設定していた内容は失われていますので、細かな設定はもう一度してくださいね。

Navbarを削除している場合の注意点

2017-03-25　追記

シンプルテーマ(テンプレート)を読み込んだ場合、Navbarが自動で組み込まれてしまいます。その場合は新テーマ(テンプレート)を読み込んでみてください。

ただし、レイアウトで手を入れないといけないことは変わらないのでどちらが楽か？ということになります。

シンプルテーマ(テンプレート)と新テーマ(テンプレート)とではベースが異なっているようなのでいろいろ試してみるのも面白そうですね。

新しいテーマ(テンプレート)を適用

「Contempo」「Soho」は素通りしてしまいました。

おしゃれなテストページではないので参考になるかかなり怪しいですが、一応画像をつけますね。

「Emporio」適用例

上の記事は写真ありです。下の記事は写真なしの場合になります。

「Notable」適用例

これはいいかも？と思ったのですが、このテーマ(テンプレート)はモバイル端末はいいと思うのですが、パソコンはかなり微妙な感じになりました。

「Emporio」をちょっといじった後の引っ越し予定のブログはこんな感じになりました。

縮尺も違うので本当に参考にならないかもしれません。

記事ページはこのような感じになりました。

ほかの方の検証を楽しみに待つことにします。

静音マウスの代わりにペンタブレット

2017-03-18T18:02:00.001+09:00

ポインティングディバイスとしてマウスの代わりにペンタブレットにしてみました。
GAOMON S56Kというものです。

使用して2週間の感想ですが、静音マウスでお悩みの方にお役に立てたらと思います。

使用しているOS：Windows10
モニター　　　：24ワイド(1920×1200)
パソコン本体　：Win8が出たころに購入したもの
以上の環境です。

静音マウスを探して彷徨う

パソコンに標準でついてきた5ボタンマウス

とても使い勝手が良いのですが、これがカチカチとうるさいのです。
このマウスをきっかけに、マウスのクリック音が気になるという方がたくさんいることを知りました。静音マウスなるものもあることを学びました。

初めての静音マウスはユニークのM335G

確かにだいぶ静かでした。
耐久性は保証期間+αというところでしょうか。

当時店頭にあった数少ない静音マウスでしたので選びようもありませんでした。
売り場担当の方に「クリック音の静かなマウスありますか？」と聞いたところ、そういった需要があることを知らなかったそうです。
その後売り場が拡充されたかは、わかりません。

その後購入したのはバッファローのBSMBW13

Amazonで購入しました。
dpiの切り替えもできて5ボタンです。
この形、エルゴノミクスということなのですが、わたしは合いませんでした。
1年半経ってもなれません。ポインタを思ったところに動かすことにも慣れません。

それどころか時々手首が痛くなるようになってしまいました。
これでは音どころの話ではありません。

都市部で売り場が選り取り見取りの環境ではありませんので、ネット上を放浪したくさんのレビューを読みましたが決めきれません。

そこで半ば思い付きのようにペンの形なら？と探してみたところ、ペン型マウスというのもあるのですね。
ならば、ペンタブレットはどうだろう？
その程度の発想でしたが、これが大正解でした。

GAOMON-S56K

ペンタブレット」のセット内容

タブレットセンサー(20㎝×20cm程)、ペン、単4電池、UBSケーブル1.5mくらい、
マニュアル、付属CD

英語のマニュアルですが、イラストもありますので何とかなるでしょう。
ただ、このマニュアルには「タブレットをパソコンに接続してからドライバーをインストールする」と書いてあるのですが、CDに入っているマニュアルには「ドライバーを入れてからタブレットを接続」となっていました。
ほかにペンタブレットを使っていないのならば差しさわりはないようです。
ちなみにわたしはタブレットを接続してからドライバーを入れました。
問題ないようですね。

大きさの参考

サイズ参考にはがきの試し刷り用紙を載せてみました。

これは購入一週間ほどの時に書いてみました。
マウスよりはだいぶきれいに書けていると思っています。

傷防止？と手の滑りが良いようにコピー用紙(A5)を載せて使っています。

裏紙をごくごく普通のマスキングテープでとめているので美しい画ではなく申し訳ありません。鉛筆で薄く補助線を引いて感覚を覚えているところです。

結果としてこの選択は大正解です。
今のところですが…。

マウスの代わりということであればもう少し小さいものでもよかったかも？と思います。

ペンタブレットの不便なところ

非アクティブウインドウのスクロールができない。

あとは、ペンのボタンに何を指定しようか悩ましいというくらいです。

ペンタブレットにしてから手首の痛みはなくなりました。

耐久性は、これから使ってみたですね。

更新日を表示するようにしました

2017-03-09T21:50:00.000+09:00

記事の公開日と一緒に更新日が出ているのって、いいなと思いました。

書いた記事を編集したときに注釈として日付を書いたりすることがあります。
ですがちょっとだけ直したときって、どうでしょう？
そんなときに便利だなと思ったのです。

Bloggerで更新日を表示する

更新日が表示される前と表示されるようになった後の違いの画像です。

更新日が表示される前と表示後の見た目の違い

もっときれいな表示にできるのでしょうけれど、記事の公開日と更新日が表示されるようになったので目的達成です。

参考にさせていただいた二つのサイト

某氏の猫空さん

Bloggerで記事に最終更新日を付ける方法
記事を投稿した後に、更新することもあろうかと思います。そういう時に、最終更新日を自動で付けれたら良いのにと思ったことはないでしょうか？
Bloggerの場合、Feed（RSS)情報には最終更新日があるので、それを取得して表示します。(内部では、投稿日時と別に更新日時を持っていると思われる）

p--q様

Blogger：レイアウト編集(9)各投稿の更新日時の表示をする（成功編）
ようやく更新日時を表示をすることができました。ついでにタイトル下の部分も改造しました。
(2016.11.27追記。Blogger:表示速度向上のためCSSとJavaScriptの置き場を考える:その4でdocument.write()とjQueryを使わない方法に変更しました。)
わたしは某氏の猫空様のコードを使用しました。

丸っとコピペです。
ありがとうございます。

コピペの位置

使用しているテンプレートはトーマスイッチ様のVaster2-テンプレートデザイナーです。

を探して

<p class='kousin'>
<span class='post-timestamp'>
<i aria-hidden='true' class='fa fa-clock-o'/>
<b:if cond='data:post.dateHeader'>
<script type='text/javascript'>var hiduke = "公開日：<data:post.dateHeader/>"</script>
</b:if>
ここにコードを挿入

こんな感じです。
今度はコードがきれいに表示できるようにしたくなりました…。

カスタマイズに欠かせないこと

2017-02-27T20:27:00.000+09:00

テンプレートをテキスト化する

テンプレートをカスタマイズするためには、そこに何が書かれているかわからないといけません。
わたしは保存したテンプレートを眺めることから始めました。
OS標準のテキストエディタで開いても英数字の羅列にしか見えません。
使用しているのは窓10です。

保存したファイルをブラウザで開いてみましょう。

ブラウザで表示されたら「ページのソースを表示」します。
そこで「Ctrl+A」などでまるっと選択してコピーしましょう。
既定のテキストエディタなどに保存してください。

これだけでだいぶ見やすくなったと思います。
もっと簡単な方法もあるでしょうけれど、明文化できる方法がこれしか思い当たりませんでした。この程度でも、カスタマイズはできるんですよ、ということでお許しください。

これをプリントアウトして眺めていました。
はじめはわからなくてもいいと思います。
ただ眺めているだけでも何となく、それなりに気になるところが出てきます。
気になったところは調べましょう。

テキストエディタを探してみました

いま試しているのは「Visual Studio Code」です。

保存したファイルを開いただけでスキルアップしたような錯覚に陥ります。
なかなか見やすいので、しばらく使ってみようと思います。

追記：2017-06-22
「Visual Studio Code」はちょっと重いようなので、「Notepad++」を使ってみています。使い方は、今のところほぼ眺めるだけですが(^^ゞ

引っ越し検討中にブログ復活

2017-01-25T21:07:00.000+09:00

削除されたブログが復活

Spamブログと認識されてしまったようです。
記事を公開しないままにしていたのが良くなかったのか、一度削除したものとそっくりなものを作ったのが良くなかったのか、思い当たるのはこの二つですね。
こんなことがあったと備忘録として記しておきます。

2017-01-24 15:43　ブログ削除のメールが届いていました。

Google サービスをご利用いただき、ありがとうございます。 http://takemomo-oriori.blogspot.com/ のブログを確認させていただいたところ、SPAM に関する利用規約違反が見つかりました。規定によりブログを削除し、URL のご利用を中止させていただきました。詳細については、以下のリソースをご確認ください。利用規約: https://www.blogger.com/go/terms Blogger コンテンツポリシー: https://blogger.com/go/contentpolicy -Blogger チーム

2017-01-24 16:01　2段階認証プロセスでアカウントは無事有効になりました。

2017-01-24　20:30過ぎ　ブログがブロックされていることに気がつき、上記ものとアカウントが無効になっているという2通のメールを確認しました。
この後「申し立て」をして、フィードバックからso-netブログからの引っ越しを考えていてコピーサイトではない旨のメッセージを送りました。

2017-01-25　15:03　復活の連絡メールが届いていました。

ブログ http://takemomo-oriori.blogspot.com/ についての申し立てをいただき、調査しました結果、ブログが自動システムによって誤って利用規約に違反していると認識されたと判断し、ブログを復帰させました。ご迷惑をお掛けしましたことをおわび申し上げるとともに、調査の間のご辛抱に感謝申し上げます。今後とも Blogger をよろしくお願い申し上げます。 Blogger チーム

まずは公開限定にしました。
これがだいぶ長いこと書き記したものの場合はかなりのダメージだと思います。
バックアップは大切ですね。

今回ブロックされたことで、改めて利用規約や低品質のブログ・Spamブログとは何？
などを調べてみました。
そのこと自体が今まであまり考えていなかった何よりの証しだと思います。

規約違反にひっかかってしまった・・・

2017-01-24T21:00:00.000+09:00

ブログがブロックされてしまった

ブログの引っ越しを検討される皆様の参考に少しでもなればと思います。
引っ越しの準備が整うまで一般公開にしてはいけません。

こちらに引っ越そうと地味にデータを写していました。
ええ、コピー作業です。
テンプレートをいじっているうちに訳が分からなくなり、一度ブログを削除しました。
そうしてもう一度新しく作り、データをアップし、設定を確認しておりました。

一般公開にしたまま…。

雪かきしてたらこうなってしまいました。
どうか、無事復活できますように…。

「申し立て」はしました。
フィードバックにもメッセージを入れました。
後は、祈るだけですね。

記事が下書きのままだったのがいけなかったのだろうか？

カスタマイズできる＝底なし沼な気分

2017-01-17T19:51:00.001+09:00

「Vaster2」を使ってみたい

テンプレートをトーマスイッチさんの「Vaster2」にしてみました。

Vaster2|レスポンシブ対応済みのblogger日本語テンプレート
レスポンシブ対応、SEO対策済みのblogger日本語テンプレートが完成したので、無料公開します。

その名は、「Vaster2」です。がっつりカスタマイズできるんだそうです。

四半世紀以上前にBasicやC言語だとかアセンブラキャッスルやらを学びました。
習得とは言えない、本当にかじった程度なのですが…。
今度はHTMLやらＣＳＳですって。
ついて行けるんでしょうか？

なんだか、底なしの沼の予感・・・。
好きで突き進んでいるんですが(^-^;

ちなみに学習のためと称して、「テンプレートデザイナーなし版」を当ててみました。

さて、カスタマイズできるんでしょうか？

追記：2017-06-22
後日、「テンプレートデザイナーあり」にしました。
こちらがやはり便利です。

ブログ引っ越しの先人たちに感謝申し上げます

2017-01-03T14:44:00.000+09:00

ブログ引っ越しの記事を書いてくださった方々、感謝申し上げます。
おかげさまで引っ越し作業の手順が分かってきました。

たくさんの参考記事があったのですが、わたしの場合は記事が100件未満ということもあり、ひとつずつコピペすることにいたしました。
So-netブログでシリウスさんがBloggerへの引っ越し記事を書いていてくださっていらっしゃいました。

手作業によるブログ引っ越し方法　[BLOGGER]
2015.09.15現在、SO-NETブログからGoogleの運営するBLOGGERへ引っ越し作業を進めているところだ。

本当にありがとうございます。

So-netブログを始めて1年と少し、まだまだ覚えることがたくさんあるのだと思います。
なので、まだ迷い中です。

bloggorってどんな感じなんだろう

2016-12-27T14:14:00.001+09:00

はじめまして

別の場所（So-netブログ）でのブログを書いているけれど、スマホ版の表示がすごく気になる…。
ほかのサービスって、どうなんだろう？
そんな思いから試してみようと思いました。

どうでもいいようなことしか書かないかもしれませんし、
もし使い勝手が良かったら、こちらに移るかもしれません。

どうぞよろしくお願いいたします。

たけもものなんとなくな日々

記事一覧ページのモバイル対応？

記事一覧ページのモバイル表示の対応

linkのスタイルシートの読み込みを止める

投稿日も表示させたい

記事一覧ページをつけてみました

記事一覧のページがほしい

記事一覧表示するために

作成手順にしたがって作業する

デモページで試してみる

デモページにはコードが表示さる

記事一覧ページにメッセージを添える

モバイル表示の問題

お問い合わせページに背景色を足しました

テーマ(テンプレート)「Emporio」でお問い合わせページをつくる

トーマスイッチさんのCSSコードにプラスα

Windows10のクリーンインストールが新しくなったようです

再インストールの手順

ギアのようなマークの設定を開く

Windows Defender セキュリティ センター

Win10の大型アップデートについて

「Windows 10 Creators Update」がやって来た

夜間モードがあるらしい

コントロールパネルはどこ？

クリーンインストールしたいなぁ

お問い合わせページにメッセージを付けてみました

「お問い合わせページ」にメッセージを付ける

雛形に手を加える

この記事の続き

お問い合わせページを作ってみました

お問い合わせページを作る

お問い合わせページをサイドバーに作ってみる

お問い合わせページをメインカラムで作ってみる

送信ボタンの表記を変えてみる

この記事の続き

「自分のページビューの追跡を管理」どうしていますか？

Blogger でブラウザにブロック Cookie を追加する必要があります。って何？

個別記事へのリンクが切られる

ブログ村等で個別記事へのリンクが切れてしまう！

やってみたこと

Bloggerのこれは良いと思ったこと

下書きを自動保存してくれる

Windows Essentialsからの移行提案

記事のタグ管理がとっても楽

何よりスマホ版表示でも広告がない

So-netブログが悪いわけではありません

サンプル代わりによろしかったらどうぞ

Bloggerのテンプレート初期化

Bloggerテーマ(テンプレート)の初期化

Navbarを削除している場合の注意点

新しいテーマ(テンプレート)を適用

静音マウスの代わりにペンタブレット

静音マウスを探して彷徨う

パソコンに標準でついてきた5ボタンマウス

初めての静音マウスはユニークのM335G

その後購入したのはバッファローのBSMBW13

GAOMON-S56K

ペンタブレット」のセット内容

大きさの参考

ペンタブレットの不便なところ

更新日を表示するようにしました

Bloggerで更新日を表示する

参考にさせていただいた二つのサイト

コピペの位置

カスタマイズに欠かせないこと

テンプレートをテキスト化する

テキストエディタを探してみました

引っ越し検討中にブログ復活

削除されたブログが復活

規約違反にひっかかってしまった・・・

ブログがブロックされてしまった

カスタマイズできる＝底なし沼な気分

「Vaster2」を使ってみたい

ブログ引っ越しの先人たちに感謝申し上げます

bloggorってどんな感じなんだろう

はじめまして

Windows Defender セキュリティセンター