【はてな】「Minimalism」リライト記事の更新日自動化カスタマイズ
どうも、ヨリミチです。
今回はリライト時の更新日時自動化カスタマイズをやってみようと思います。
ボクのテーマは「Minimalism」です。それ以外を使っている方は、結果が違うことになるかもしれませんので、ご注意ください。
また、カスタマイズする前にちゃんとバックアップを取るようにしておいてくださいね。
リライトしたけど日時が古いまま
WordPressならリライトすれば当たり前に更新されるけど、はてなはなぜか未対応。
更新日時を表示するシステムがはてなにはありません。なのでカスタマイズして表示させようってことです。
前々から気にはなっていたけど、放置してた（笑）
今回やっとこさ、やろうと思い立った。が…コピペでパパっとできると思っていたけど、つまづいて、1時間ぐらいかかってしまった。
それではさっそくやってみよう
上記の記事では「Minimalism」の様々なカスタマイズがまとめられています。更新日カスタマイズ以外にもいろいろあるので、参考にしてみてください。
それではまず、上記の記事で「記事の更新日を記載」というタイトルを探してください。基本はここの手順通りですが、少し詰まりました。
ここからは、非常にリンクだらけで、ややこしいですが、がんばりましょう。
①jQueryとFont Awesomeの読み込み設定
まず、下記の記事通りに設定していきます。
kurokinomizuiwa.hatenablog.com
②HTMLの設定
下記の記事を参考に進めます。
ボクはここのサイトマップバージョンを使いました。
ここのコードを「記事下」にコピペ。
その際、サイトマップURLの記入を忘れないように！
この時点で更新日は表示されるものの、更新日の表示がバグってます。
③②のコードを修正します
上記の記事のコードをそのまま張ると、今度は更新日が表示されなくなります。
そこで以下のコードで張りかえます。
function appendLastmod(lastmod) { var $container = $('<div></div>', {'class': 'lastmod'}).text(lastmod.replace(/T.*0/,"")); if ($('.entry-header > .date').get(0).tagName.toLowerCase() === 'span') { $('.entry-title').before($container); } else { $('.entry-date').append($container); }
<div></div>の部分が抜け落ちていたんですね。
これでちゃんと表示されると思います。
④デザインCSSの設定
下記の記事を参考にしながら進めます。
ここでは②でコピペしたコードの一部を修正しています。
これも手順通りやっていけました。
ボクはこのようにしました。
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
デザインCSSに張るコードも上記の記事のコードをそのまま張っても問題なかったですし、下記の記事のCSSコードを張っても問題なかったです。
kurokinomizuiwa.hatenablog.com
僕は修正してこのようにしました。
/*↓----更新日時表示----↓*/ .lastmod { background-color: transparent; padding: 5px 0px; text-decoration: none; font-size: 15px; display: inline; margin-left: 0px; font-family: 'Montserrat', sans-serif; } .lastmod::before { margin-right: 5px; margin-left: 10px; padding-left: 3px; font-family: "Font Awesome 5 Free"; font-weight: bold; content: '\f01e'; } /*↑----更新日時表示----↑*/
ボクのは投稿日時の左にアイコンがありません。
どれでも好みのを選んでください。自分なりに改変するのもいいですね。
試しに
content: '\f01e';
の部分を
content: '\f2f1';
に変えてみてください。
ブラウザを更新すると反映されているはずです。
以上で更新日が正しく表示されるようになったと思います。
お疲れさまでした。
【はてなブログ】お客様のサイトにリーチできません【アドセンス】
※2019年5月7日追記
アドセンス再申請時にURLが変更できない問題発生
検索すると他にも同じ状況の人がたくさんいました。
ちょっとほっとしました
告白してないのに振られました
ウケた(笑)
お客様のサイトにリーチできません
2019/05/03
アドセンス不承認メールが届いた
理由は「価値が低い」だとか、ポリシーがーとか色々言われました。
素直にアクセスが少ない記事を削除した。
1時間後に再申請しようとしたら、URLがおかしいことに気づいた。
http://yorimichiblog.com
嫌な予感がしてきた・・・
「https://www.yorimichiblog.com」と入力すると
https://yorimichiblog.com
httpsにはできたけど、相変わらずwwwは無し。
URLが違う状態で完了ボタンを押すと、
「お客様のサイトにリーチできません」
と表示されて再申請できない。
そして完了ボタンを何度も押していたら
「24時間後にまた来てね」と追い返されてしまった(笑)。
（申請した時にURLを間違えてしまったのか？）
最初に申請したときに来た「ようこそ！設定を完了して利用を開始しましょう」のメールにブログのURLが記載されてある。
でも今確認したら、https://wwwじゃなくてhttp://wwwなんですよね・・・
Googleアドセンスの申請をする - はてなブログ ヘルプ
この記事の通りに設定したんだけど、どこかでミスった？
そもそも、最初の申請時にこのコピペする作業は問題なく通過していたので、やはりGoogleに不具合があるとしか考えられない。
おそらくこの不承認メールは、申請時のURLが不具合で変更されて、それをbotがアクセスできないサイトと判断し、「価値のないサイト」として不承認メールを送ってきたんじゃないかと推測しています。
4月26日頃からブログ関連のGoogleのツールが不具合頻発していて、おそらくそれの影響なんじゃないかと思っています。
この不承認のメールの信ぴょう性すら怪しいので、今は静観しているのがいいように思います。
正常に稼働後も不承認の可能性はあるけど(笑)
それにしてもたくさんのひとが何度も再申請して努力しているのを知って勇気づけられました。僕は今回のを除き1回落ちてます。admobやっていたので重複アカウントだとかで。そして2週間後にこの事態です。間が悪かった。
ちなみに、2019年4月下旬頃から無料はてなブログでアドセンス申請できるようになったとか(笑)
いろいろタイミングが悪いボク
長年アドセンスを広告で張り続けたはてなの努力が実ったと考えるべきか。
いや、はてなブログで記事を書いてきたみなさんの努力ですね。
解決？
現段階で早急に対処するにはやはりURL転送するしかないようです。
お名前.comは仕様でhttpsではなくhttpでないとURL転送できないようなので
アドセンスに申請するときはhttpのwwwなしで登録することになります。
ムームーでも同じようにしたほうがいいと思います。
まとめ
アドセンスのヘルプでも4月26日頃から同様の報告がなされているようです。
アドセンスのシステムに変更があったため、このようなことが起きたようです。
いろいろ調べていたら、そもそもこういう仕様は2018年10月頃に。既にアドセンスを別のブログで開始している人が新たにサイトを追加する時に審査が必要になってからのようです。サイト追加時、はてなブログに限らず(wwwあり)で登録すると、審査時にURLの正規化(wwwありなしの統一)とURL転送(wwwなしからのリダイレクトの設定)をしなければならなくなっていたようです。これは複数のブログがこのように報告をしています。(今後wwwありのブログが減る？)
今回ボクを含め、皆さんがハマってしまったのは、はてなのヘルプ通りに新規に開設する時に申請したURL(www.example.com)で問題なく申請できた後に、承認が落ちて再申請時に(https://www.example.com)を設定できなくなったため詰まってしまったのだと思います。(この期間に一発で合格した人がいるのか？その人はURL転送しなくてもよかったのか？気になります。)
不具合じゃなくてシステム変更とするならば、今後はこの仕様になるのかもしれません。つまり、新規でもwww無しからURL転送しなければ申請できないようになるのかもしれません。
しかし、上の方にでも書いたように、この期間に無料はてなブログでも申請、承認された人もいるようです。その方たちがURL転送していたのかわかりませんが、していなかったとしたら、はてなドメインだけが特別扱いされていることになりますね。
今後どのような変更がされるかは、GW明けになるらしいです。
GWも終わっちゃいました。ボクはずっとこの問題にとりかかっていて他は何もできなかった。そもそも予定もなかったけど。
急いでいない方は、下手にいじらずこのまま待つのもいいかもしれません。
Google Search Console For Star Wars Day
5月4日、スターウォーズの日にちなんでサーチコンソールにスターウォーズモードが追加された。
C3POのアイコン
歓迎メッセージ
URL検査
カバレッジにライトソードが！音も鳴る！
ツールチップを見ると・・・
検索パフォーマンス
遠くの銀河を選択
そんな遠くのデータは無理と言われる
インデックス
Googleサーチコンソールで2019年4月中旬のデータが損失する障害発生
April 9-25, 2019
Search Consoleにて4月26日に機能停止したため、4月9日か25日までのパフォーマンスレポート以外のデータが完全に失われた。これにより、再び利用可能となった4月26日のデータですべて置き換えられた。
影響を受けるのはSearch Consoleのカバレッジで見れる4月9日から25日のインデックスのデータであり、検索パフォーマンスレポートには影響はない。皆さんが重要としているクリック、インプレッションのデータには影響はないようです。
4月9日から4月25日まで26日のデータに置き換えられ棒グラフが横ばいに
ボクは丁度独自ドメインを取得した時期で、カバレッジが更新されてなかったので不安になっていました。通常なら代替えページのページ数が増えたり、新URLでのインデックスが徐々に増えていく様子が見れるはずなのに見れなかった。記事も新たに追加したのに反映されていなかった。4月26日以降は正常に稼働しているようです。ボクの環境では4月27日ごろから表示されたのを確認しました。
はてなブログの平均読み込み速度、表示速度が異常に遅かったのを改善
ボクのブログの読み込み速度が異常に遅かったのに今更気づいた。
平均読み込み速度37秒
37秒！？
おそい!おそすぎる！
他のブロガーさんは10秒以下なのに！
どうして、ボクのとこだけこんなにおそい！？
PCやスマホでブログを見たら表示はすぐされているんだけど！
どういうこと！？
実は読み込み速度とは、ページ内のデータをすべてダウンロードした時間です。表示はすぐされたから読み込み速度が速い！というわけではないんです！一部のデータの読み込みが遅くてダウンロードが完了しないと、その時間も計測されるんです。
普通に表示されていたので、気にもしていなかったのですが、気になりだしました。
そこで「はてなブログ 平均読み込み速度」でぐぐってみました。
ぐぐって数十記事見てきましたが、載っていた解決方法は大体以下の感じ。
速度アップ対策
画像圧縮
1枚100kb以上の画像が大量にあるなら、それなりに効果があると思うけど、100kb以下なら誤差の範囲。
ヘッダ、フッタの非表示(はてなブログPro専用）
誤差。
スターの非表示
誤差。
はてブ非表示
誤差。
読者ボタン非表示
ごさ。
シェアボタン非表示(ツイッターとかフェイスブックとか)
gosa。
JavaScript圧縮
保守が面倒な上、大半がはてなの自動生成のコードなので誤差。
以上、数十記事ぐぐって試してみたけど、平均読み込み速度37秒が35秒ぐらいになる程度。この圧倒的な遅さはどこから来ているのか。
ふと、浮かんだのが、一体いつからこういう状態になっていたんだろうか？
ボクはブログ開設初期からアナリティクスを入れていたので、確認することができた。
2018年12月30日から急に平均読み込み速度が遅くなっている。それまでは10秒以下。
この日に何を設定したのか、まるで覚えていない。マメにメモするボクではないので。
※皆さんは、特に始めたばかりの人は、今日どのようなカスタマイズをしたのかメモっておくことをお勧めします。その時点では気づかない重大なミスがあるかもしれませんよ。
どんなに思いを募らせても、失った思い出は帰ってはこない。
愕然としていたら、デザインCSSのバックアップをしていたのに気づいた。
内容を見てみると、今のコードと寸分たがわず同じだった...
9月以降に新規にページを作ってもいないし、CSSもいじっていない。ほかに原因がある！？もしかしたら、htmlのコードに問題がある！？
この時点で3日ほど経過。
htmlのコードに問題があるか調べる
（ ＾ω＾）・・・
はっきりいって、素人には見てもわかりません。
一つ言えるのは、重度の問題として記された部分のほとんどが、はてなが自動生成しているコードです。ユーザーがどうこうできる問題じゃありませんでした。
次なる手
CSSにも問題なし、htmlにも問題なし(思考停止)、高速化対策も無駄だった。
長いことブログを更新していなかったので、はてなに嫌われて、遅いサーバーに移動させられた？回線を絞られている？確認しようがないので除外しますが、あながち無いとも言い切れない。
残る可能性は・・・
確かに正月休みの時に何かしたような記憶はあります。何をしたかは覚えていませんが。
本当に読み込みが遅いのだろうか？
ボクが使っているFireFoxでは読み込み中のとき、何を読み込んでいるのかが左下に表示されることを思い出した。
もう一度ボクのブログのページを見てみる。
表示はすぐにされた、しかし...
amazon....
ここで読み込み中で止まっていることに気づいた！
ブラウザによって表示は違いますが、サイトを見ているとたまに、読み込み中のマークがずっと表示されたままになることがありますよね？そういう状態でした。
サイドバーからamazonの広告を削除してみる。
平均読み込み速度37秒が20秒に変わった！
amazonの「テキストと画像」のリンクをすべて、はてなの広告ツールで張り直し、次の日計測すると平均読み込み速度が4秒になっていた。
とまあ、こんな感じで無事速度アップできました。
あ～すっきりした！
読んだ人はすっきりできたかな？
すっきりしなかったひとには申し訳ないです。
ボクの力不足です。
サイトマップが取得された
サイトマップとはサーチコンソールにある機能で、グーグルにページを知ってもらうためのものです。
サイトマップが取得できない状態がいつの頃からか続いていました。サイトマップ取得の対策をぐぐっていろいろしましたが、ダメでした。
が、今回の速度アップ対策をした次の日から取得されるようになりました。読み込み速度が遅いと取得されないなんて情報は見たことはありませんが、気になった方は試されるといいかと思います。
サイトマップURL
「sitemap_page.xml」「feed」
表示速度アップが検索順位に影響する？
平均読み込み速度が10秒以下だったのが、37秒になったところで、順位には大して影響はなかったです。極端に落ちたりすることはなかった。なので、速度アップしたところで、極端に上がることもないのかなあと思います。
ここに書かれているように、もともとそれなりの読み込み速度だった場合、いろいろ対策してもあまり影響はないようです。しかし、「モバイルで読み込み速度が極端に遅い場合は影響がある」と書いていますので、無視することもできませんが。
他の方のはてなブログもモバイルの読み込み速度の結果はあまりよくありません。ユーザーが対処できるレベルでは難しいようです。
対策後のPageSpeed Insightsの結果
モバイル 42 前後
パソコン 80 前後
んー、モバイル遅いですね。時間や日によって結果がまちまちなので、あまり気にしすぎないようにします。
まとめ
はてなでブログをされている方は、スターもはてブもシェアボタンも読者ボタンもデザインCSSをいじったりするのも問題ないとボクは思います。画像と広告を張る時だけは注意した方がいいかも。
以上です。ここまで読んでくれた方ありがとう。
