※ 当サイトではアフィリエイト広告を利用しています

Cocoonをアップデートしたら不具合が出たので、古いバージョンに戻しました

Cocoon

こんにちは、ゆんつです。

このブログはWordPressの無料テーマ「Cocoon」を利用して作っています。

Cocoon
SEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100%GPLテーマです。

「Cocoon」は無料なのにも関わらず多機能で使いやすいとても良いテーマです。

ゆんつ
ゆんつ

いつもお世話になっております

ところがつい最近「Cocoon」を最新版の1.9.9.1(2019年10月4日現在)にアップデートしたところ不具合が起きてしまいました。

※追記(2019年10月8日)

Cocoonのバージョンを1.9.9.5.2にバージョンアップしたところ、吹き出しのサイズが大きくなる現象は起きなくなっていました。

prism.jsが効かない不具合については1.9.9.5.2でも続いていましたが、ブログを見て下さった方からメールで改善方法を教えていただき改善しましたので方法を追記しておきました。

ゆんつ
ゆんつ

貴重な情報ありがとうございました!

アップデートで起きた不具合

以下の2点です。

ふきだしのアイコンがとても大きくなった(※1.9.9.5.2では改善してました)

新しいバージョンにアップデートして記事を作成していました。

ビジュアル画面で「ふきだし」を使ってみたところ、表示される「ふきだし」のアイコンがやたらと大きくなってしまいました。

別に、画面を拡大しているわけではありません。

アップデート前のアイコンはこの半分以下の大きさでした。

リアルの僕の顔が大きいのは事実ですが、アップデートで執筆者の顔の大きさを忠実に再現するようになったとも思えません。

ゆんつ
ゆんつ

確かに顔はデカいですけどね

公開した記事では普通サイズのアイコンで表示されるので大きな問題ではないのですが、文章を書いていると「アイコン」の大きさが結構気になるのです。

「prism.js」が効かなくなっていた(※改善策有り)

これが一番困った事でした。

僕はソースコードを表示するのに「prism.js」というシンタックスハイライターを使っていました。

CocoonにPrism.jsを導入する
こんにちは、ゆんつです。 プログラミングやブログのカスタマイズについて記事にしようとする場合、説明文と一緒に自分が書いたソースコードも記載することが多いかと思います。 ソースコードをブログに記載したい場合、単純にコードをコピーしてWordP

Cocoonを「1.9.9.1」にアップデートして、過去ページをチェックしているとソースコードに「prism.js」が全然効いてないことがわかりました。

「prism.js」が効いているとき(アップデート前)は、ソースコードの背景は灰色ではなく白色で、行番号や大事な部分を強調するための色がついていたり、コードをコピーするためのボタンなども付いていたのです。

でも、アップデート後には記事に書いたソースコードが全部このような背景色がグレーになっただけの見た目に変わっていました。

このソースコードの見た目では、行番号を使った説明などが全く意味の解らないものになってしまいます。

改善策

Cocoonの高速化設定にある「JavaScript縮小化」の項目で、「prism.js」が入っているフォルダを除外する設定にすると最新バージョンのCocoonでもprism.jsが効くようになりました。

今後「Cocoon」のアップデートにより除外しなくてもprism.jsが効くようになるかもしれませんが、prism.jsが効かない場合はこの方法で対策をすると良いと思います。

過去バージョンに戻す

古いバージョンでは「アイコン」も「prism.js」も思った通りに表示されていたので、過去のバージョンに戻せこれらは直るはずです。

公式ページに過去バージョンへの戻し方について説明されているので、その通りに行います。

テーマのダウンロード
Wordpressテーマ「Cocoon」の親テーマと子テーマのダウンロードページです。
ゆんつ
ゆんつ

バージョンを戻す前に

一応バックアップしておきました

過去のバージョンが配布されているページにアクセスします。

Releases · yhira/cocoon
100%GPLの無料Wordpressテーマです。開発中の開発バージョンです。安定版をダウンロードする場合は、Cocoon配布サイトからダウンロードしてください。 - yhira/cocoon

過去バージョンが保管されているので、戻りたいバージョンを探します。

ここで問題が!

それは「どのバージョンから1.9.9.1にアップデートしたのか覚えてない」という事です。

あらら

多分前回のアップデートしたのは2~3ヶ月くらい前だったような気がするのですが、アップデート前のバージョンを全く覚えていません。

Cocoonは割と頻繁に更新されるので、数日おきに新しいバージョンが出ます。

ですのでアップデート前のバージョンを覚えていないと、どのバージョンをダウンロードすればいいのか全く見当がつかないのです。

ゆんつ
ゆんつ

ヤマカンしかないな

とりあえず、最新バージョンから約2月前くらいに更新されていた「1.8.8.3」をダウンロードしました。

zipファイルをダウンロードしたら解凍します。

解凍して出来たフォルダ名を「cocoon-master」に変更します。

FTPクライアントなどを使って、このフォルダをドメインフォルダの中にある「wp-content/themes」にアップロードして、元からある「cocoon-master」フォルダに上書きします。

ゆんつ
ゆんつ

FTPクライアントには

「FileZilla」を使ってます

FileZillaのインストールと初歩的な使用方法
こんにちは、ゆんつです。 「FTPクライアント」というのをご存知でしょうか? FTPクライアントはサーバーとクライアント(PC)との間でのファイルをやり取りするのに使うアプリの事です。 WordPressでブログを運営している場合。 FTP

上書きが完了したら、「Coccon」を古いバージョンに戻す作業は完了です。

上書き完了後にテーマを確認すると、テーマのバージョンは無事に「1.9.9.1」から「1.8.8.3」に戻っていました。

直りました

Cocoonのバージョンを「1.9.9.1」から「1.8.8.3」に戻しました。

そして、「prism.js」が効かなくなっていた記事のソースコードを確認すると、アップデート前の状態に戻りきちんと表示されていました。

ゆんつ
ゆんつ

よかった!

そしてエディタ画面での吹き出しの「アイコン」のサイズも直りました

どうやら、どちらも元通りになったようです。

ゆんつ
ゆんつ

良かったー♪

というわけで、Cocoonを「1.9.9.1」にバージョンアップしたら「エディタ画面での吹き出しアイコンの巨大化」と「prism.jsの無効化」という不具合が出ましたが、Cocoonのバージョンを古いものに戻したことにより直りました。

もし「Cocoon」のアップデートで何か不具合が出てしまったら。

バージョンを戻してみると改善するかもしれません。

また、アップデート前のバージョンを覚えておくことも大事なことですね。

いい勉強になったな

ゆんつ
ゆんつ

うん

しばらく、この状態のままで様子を見ようと思います。

(※アイコン表示が改善され、prism.jsの改善策もわかったので、現在(2019年10月8日)は1.9.9.5.2にアップデートしています。)

それでは、またー。

コメント