はてなブログのカスタマイズとドメイン再移管とやったこといろいろ

年末にブログ移転してからしばらく経過。

個別に書けばいいのにまた下書きのまま放置してしまった。いつもの通り長い。

移転後にやったこと

いろいろです

www.kimigauchu.com

リダイレクト
- MixhostのCpanel設定
カテゴリいじり階層化
記事内修正
Chrome拡張
CSS
- はてな的な設定クラス
リンクを別ウインドウ
hatena改善求む
- WordPressより良い点
再度のドメイン移管
スターサーバーの無料サーバーに申し込む・・・？

リダイレクト

cononicalとnoindex,nofollowをheaderに挿入

元記事はすぐ消さず、しばらく様子見して削除

MixhostのCpanel設定

リダイレクトからリダイレクト設定でもいいし、ドメインページのURLでディレクトリ設定して.htaccessでもいい

サブブログも同様に301リダイレクトして、元ブログは私のブログでコピーじゃありませんよ〜！とGoogleへお伝えしないといけないので、サーチコンソールの「アドレス変更」作業

リダイレクトしてすぐはできませんでしたが、次の日OKでした。
リダイレクトは別URL転送になるのですが、階層同じなのでシンプル記述でOKでした。（むしろRewriteCondつかうとうまくいかなかった）これで検索結果も自動的にはてなの新しい方に飛びます。

RewriteEngine OnRedirect permanent / https://www.kimigauchu.com/

ただ、これもcPanelでドメインのディレクトリ変えて回避とかしないとダッシュボードもリダイレクトされちゃうのでアクセスできなくなりますけど
ついつい記事非公開にするのめんどくさ！と思ってWP Maintenance Modeのプラグインやってみたけど使わない方がいいですね！リダイレクトしなくなるしやっぱりあれは名前の通りメンテ用。記事全削除ってどうやるんだろう・・・FTPから削除？一覧から一気に選択するしかないか〜

元ブログはwww付きにリダイレクトなのでこうしました

RewriteEngine onRewriteCond %{HTTP_HOST} ^kimigauchu\.comRewriteRule ^(.*)$ https://www.kimigauchu.com/$1 [L,R=301]

正解なのかわからないけどこれでグーグル検索からはきちんと新URLにリダイレクトできている。記事内からのURLリンクはできないのにー

リダイレクトはここを参考

301リダイレクトとは〜htaccessを利用して転送を行う方法｜ferret

【基本Tips】htaccessリダイレクトの書き方 | 新宿のホームページ制作会社 ITTI（イッティ）

WordPressリダイレクト-ドメイン変更の移転後に全ての記事をリダイレクトする | ワードプレスドクター

カテゴリいじり階層化

テーマが対応してないかもと思いましたが、CSSファイルは読み込まずスクリプトだけ

blog.wackwack.net

でいけました。

記事内修正

それより記事の修正やばかったな。記事内リンクやショートコード・・・・もう2年前とか鮮度落ちてねえ？書き直す？買ってよかっただけ直す？

地味に画像も、ライトボックスにしてたので全部リンク状態（画像URLは書き換わってるがリンクのURLは変わってないので・・・）
しかも画像がさ〜〜普通に入れてるのはいいけどキャプション入れてると、キャプションのショートコード入ってる。そらそうだ。
ショートコードは結構使っていたので、ブログカード、Amazonやら全部書き直し。
一番ヤバいのがWordpressの新しくなったエディタで描いたものは全部タグが挿入されててえらいことになってしまっている。それまではMarkdownで書いてたからよかったけどなかなか
目次も自動挿入プラグインだったので。。。。全部ない・・・

Chrome拡張

h2見出しでずっとやってるのにいきなりなしかぁと思ってたら拡張作ってくれてる人がいた！めっちゃべんり！！！

www.notitle-weblog.com

CSS

外部CSS読み込みはうまくいかなかったので、デザインのデザインCSSに書き込んでいる。消えたら困るのでローカルcssファイルに保存テキスト装飾などは記事内にクラスをすでに設定していたりするので、今までのものを使いつつ新たに設定したり。Codepenで確認しながら作成。ただ外部CSSファイルは読み込んでても反映されなくて、ブログカスタマイズで直接コード貼り付けたらうまくいった

はてな的な設定クラス

背景色html,body{background-color:#F0E6EF;}にしたらどうもイメージと違うが、前は何色にしていたか覚えてない。Wordpressダッシュボードを確認しようにもリダイレクトされてしまう。回避措置しないとだめか・・・？めんどうになったので初期設定のままにした。

ワードプレスのようにリンク色などがデザイン設定できないのでCSSに追記していく形

トップページの一覧のリンク色のクラス名entry-title本文共通（archive-entries のaの色を指定したら全部変わってしまうので）

タグのあたりはcategoriesでアーカイブも本文ページも変わる全部a:hover指定されているので指定し直す。個別クラスじゃなくてa:hover{〜で一括指定いけたかな。直接cssいじりて〜でもこれはWordpressも同じこと。

サイドバーのタイトルなどhatena-module-title リンクになっているものとなっていないものあるのでaも指定する

リンクを別ウインドウ

別ウインドウいままではjQueryで設定していたので、もちろん記事内に_blank設定していない

jQuery(function($){ $('a[href^=https]').not('[href*="'+location.hostname+'"]').attr('target', '_blank');});

記事内のURLは別窓で開きたい・・・強いこだわり・・・・

はてなはそのままコードを貼っても使えないらしい

https://riocampos-tech.hatenablog.com/entry/20190215/openlinktoothertabs

はてな用にコードを用意してくれた人がいた！でもまあ、結局jQueryも読み込まないとダメでした

https://www.inside-shiina.com/entry/open-other-window <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script><script language="JavaScript">$(document).ready( function () {$("a[href^='http']:not([href*='" + location.hostname + "'])").attr('target', '_blank');})</script>

無事にできました。2ヶ月以上気付きませんでした。記事を読んでくれた方ご不便おかけしました！！