【鬼汗】3日間耐久blogリニューアル

サイト作成 備忘録
スポンサーリンク

WordPressテーマを変えたはイイけど・・・

まずは、「画像作り」からはじめた

2017年からこのブログを始めて、WordPressテーマは長らく『Luxeritas』さんを使わせていただいてきた。
で、そろそろ『cocoon』さんのテーマに乗り換えようと思いつつも「人気記事表示」や「もくじ」の設定など、あれやこれや考えるとめんどくささが先立って、なかなか実行できなかった。
ようやく重い腰を上げ、この3日間、ヘッダー画像作成・logo画像作成・アイキャッチ画像作成など、まずは、画像作りから始めた。
なぜ「画像作り」からなのかというと、人って「サイトのパっと見」が変わるとイメージしやすく、モチベーションが上がるからだ。

各画像には適正サイズがある。画像サイズが適正でなければ、どうしようもなくぼやけたりする。
それに、パソコンでもスマホでもタブレットでもうまく見えるよう作らなければならない。

でも、『cocoonテーマ』に関するマニュアルはものすごく多く、「cocoon ヘッダー画像サイズ」「cocoon ○○の設定」等でググれば、かなり多くの解説サイトやyoutube動画もヒットする。

それに、今は昔と違って、無料なのにあらゆる画像を作成できる『canva』というサイトもあるし、「背景を切り抜いて透明にしてPNG画像を作成する」のも少し前なら超・超有料のPhotoshopぐらいしかなかったと思うけど、今は無料で、画像をアップロードするだけで背景を切り抜いてくれる『removebg』というサイトもある。

そんなわけで、初心者でも簡単にしかも無料で各種画像を作ることができるようになっているので、感謝しつつ比較的楽しみながら作っていった。

背景を切り抜いた(つまり背景が透明な)logo画像や人物画像を作っておくと、いろいろ使えて便利!
その際、無料で利用できるのが『removebg』ってサイトです。

blog型からホームページ型へ変更してみた

『cocoonテーマ』を使いはじめて知ったことだけど、サイトには「ブログ型」と「ホームページ型」があるという。

「ブログ型」は、WordPressの標準的なもので、「投稿(post)」の新着記事が順番に並んでいるもの。
このブログも以前は、そうだった。
でも、それだと、記事を書く私としては「今、私がタイムリーに覚えたい論点を書いていく」けど、ブログの読者さんはもしかしたら「不動産登記法の記事が見たい」など、勉強の進捗状況は人によって様々だ。

そこで、固定ページをトップページとし、一番上に「重要な論点カード」を表示させ、記事には「人気記事」と同じ新着記事でも「主要科目別の新着記事」を置くことにした。

こんな風に、サイトをトップページ固定からいろいろなページに飛べる形のものを「ホームページ型」というらしい。

『cocoonテーマ』に関しては、たくさんの解説ブログやyoutube動画があるので、見させていただきながら、設定してみた。
皆さん、とてもわかりやすく解説して下さっているので本当に感謝。
うん!サクサク進む!ここまで、とても順調。

ブ・・・ブログが真っ白に!!!!

トップページがだいたいできたところで、次はサイドバーを整えていくことに。
どんなブログでも「ブログ主についてのプロフィール」は当たり前に設置しているのでまずは、profileページと共に設置。

それから、こういう受験勉強用のブログなので「サイト内検索」は必須だろうし、長くてウザいけど「カテゴリー(科目別)の階層マップ」も必須だと思い、設置した。

【サイドバーに表示する項目】
・サイト内検索
・ブログ主はどういう人物か、プロフィール
・カテゴリー(科目別)の階層マップ

そして、「カテゴリー(科目別)階層マップ」を作ってみたが、あまりにも階層が多すぎて、なにか見辛い!
そこで『cocoon カテゴリー カスタマイズ』で検索してみて、見やすいデザインにするやり方を解説して下さっているブログを見つけ、そのとおりにやってみた。

やり方は、そのブログ主さんが用意して下さっているコードを「Cocoonの子テーマのスタイルシート「style.css」に、コピペで貼り付けるというもの。
そんな簡単なやり方で、うまく表示させることができた!ブログ主さんに感謝!と思いつつ、かなり順調に進んでいたはず・・・だった・・・。

でも、なんの作業の後かはわからない(というか覚えていない)けど、表示確認用に別タブで開いていた当ブログが突如、真っ白に!!!

ダッシュボード(編集作業用の画面)は普通に健在なのに、なぜか、「サイトを表示」で見ると、真っ白!

原因を突き止める!

ということで、またまた検索『cocoon ブログが真っ白に』でググってみた。
ヒットするするw やっぱ、同じようなことになった人が大勢いらっしゃるんだと思いつつw

考えられる原因の一つに「テーマを変更した」があったので、それかなとも思ったけど、でも3日間ぐらい正常に表示されていたのに、いきなりだったから、それは違うのかな・・・と

一番に当てはまりそうだと考えたのは、Cocoonの子テーマのスタイルシートをいじったこと。
そこでコードをコピペした箇所を消してみたけど、相変わらず真っ白・・・
さらには、いったんWordPressテーマの標準的なものをインストールし、『cocoonテーマ』は削除してみた。

すると、超・ダサいブログになりながらも画面真っ白からは脱出できた。
で、あらためて『cocoonテーマ』をインストールし直し、有効化してみたけど、やはり真っ白に。

更に調べてみると、同じ症状になられた方は、「プラグイン」を一つ一つ「無効」にし、このWordPressテーマと合う合わないを検証してみられたとのこと。
それではということで、当たりをつけたプラグインを無効化してみた。
ふつーに、そく解決!

いや逆に、そんな簡単なことでよかったんかい?!みたいな・・・
画面真っ白になったときから、いろいろいじった時間や体力・気力はいったいなんだったのか・・・トホホ

そんなこんなで、ブログをリニューアルできた!

まあ、こんな風にいろいろあったけど、ブログをリニューアルでけた~
まだ、もう少し細かい部分でより見やすいカスタマイズなどやっていこうと思います。

サイトリニューアルに伴い、そもそもこのブログ自体、すっごく重くなってきてましたので、サイト全体の軽減化のため、まずは画像を最適化し「PDF文書」はすべて削除することにしました。

その代わりにスクショ用画像を多く作りましたので、「PDF文書」代わりにスクショで「まとめ表画像」をご活用ください。
(※なお、まだPDF文書表記が消えてない記事がほとんどですが、おいおい直していきます)

PDF文書で印刷する人がほとんどいなくなられたそうニャ
そのかわりにスクショを活用する人がめちゃ増えたそうニャ
なので、ブログ軽減化のためにもご理解下さいニャ

タイトルとURLをコピーしました