サイト内検索
【ゆる募】CocoonをGutenberg API 2に対応させてみました。もしよろしければ動作確認いただければ幸いです。 | 雑談 | Cocoon フォーラム

Topic starter2021年6月24日 23:02
去年大腿骨を骨折し体調を崩してから滞っていた、CocoonのGutenberg API 2対応をやってみました。
結構大きな変更となるので、よろしければで良いのですがローカル環境をお持ちの方はブロックエディターの動作確認をお願いしてもよろしいでしょうか。
ダウンロードファイルはこちら。
https://github.com/yhira/cocoon/tree/api_v_2_column
zipを解凍するとcocoon-api_v_2_columnというフォルダができますが、このフォルダ名をcocoon-masterに変更してアップデートするとしやすいかと思います。
※皆様ご存知とは思うのですが、一応念のため書かせていただきました。
僕の環境では一応問題なく動作しているので、他環境でも多分大丈夫とは思うのですが。
去年骨折してからというもの、体調を崩して精神的に参っていた時期が長く続いたので、コードを見るのもしんどい時があって、今回は一部コーディングを外注しました。
外注費用は全て持ち出しで、完全に赤字となってしまいました。なので今回から僅かながらでも寄付を募れればと「寄付特典機能」をつけました。
今後、僕自身も難病の手術を控えており、また外注に頼る可能性も高いので、その費用をまかなうためでもあります(外注含めてもせめてトントンくらいにしたい)。
動作確認関係なしに、モデレーターの方には日頃お世話になっているので、アクティベートコードをフォーラムに登録されているメールアドレス宛に送らせていただければと思います。
もしメールに送って良い場合は、「送ってOK」的なことを書き込んでいただけると幸いです。
This topic was modified 1年前 3回 by わいひら
さる子 件のいいね!
Topic starter2021年6月24日 23:03
あと、これからモデレーターになっていただける方にもアクティベートコードをお送りさせていただきます。
ただ、悪意のある方がモデレーター権限を持つといろいろと大変なので、恐れ入りますが「Cocoonフォーラムの質問に対して、5件以上解決案を提示(返信)されている方(現時点)に限らせていただきます(解決案があっているかどうかは問題ないです)。
もしこれまで、フォーラムに寄せられた質問に対して何度も返信されているという方でモデレーターになってもいいという方がおられましたら、書き込みをお願いします。アクティベートコードをフォーラムに登録されているメールに送らせていただきます。
モデレーターといっても特に難しいことをする必要はなく、スパムがあった場合無効化していただくだけでOKです。
やり方はこちら。
https://wp-cocoon.com/community/postid/49934/
とはいえ、最近はスパムも無いですし、無理にフォーラムをチェックする必要がありません。
たまたまフォーラムに訪れてスパムを見たとき、無効化していただければそれだけで十分です。
※メールアドレスが必要になるので「返信時フォーラム登録されていたこと」は必須となります(ゲスト書き込みだとメールを取得できないし正しいメールアドレスとも限らないので)
もしよろしければ、よろしくお願いいたします。
This post was modified 1年前 by わいひら
Topic starter2021年6月24日 23:05
「寄付特典機能」と書きましたが、今のところは大した機能はないです。
今のところあるのはこれだけ。
・FAQブロック(Google FAQ表示に使われるリッチスニペット対応)
・HTML挿入ボタン機能(※クラシックエディターのような埋め込み式ではなく、ショートコード利用なので使い勝手は悪いかも…。埋め込み式の実装方法がどんだけ調べてもわからなかった。ここら辺は要改良)
今後、またいくつか特典機能は追加していければと思っています。
※これまで無料で利用できていた機能はこれまで通り利用できます。
This post was modified 1年前 2回 by わいひら
2021年6月25日 01:51
わいひらさん
お疲れ様です。
Gutenbergの仕様もドンドン変わってしまい、本当に大変かと思います。
ご対応、ありがとうございます。
動作確認については、なかなか時間もとれませんが、できる範囲で少しずつ。。。という感じでならば。
25(金)は通院もあり立て込んでいますが、26(土)くらいから、始めてみようと思います。(すっかり病気がちなもので。)
27(日)も立て込んでしまうのですが。。。のんびりやろうかと。
私はまだ、Gutenbergには慣れていませんので使いこなすことは難しいですが、モンキーテストにはなるかもしれません。
コードについては良く分かっておりませんがOKです。(どこまでテストできるか分かりませんけど。)
わいひら 件のいいね!
2021年6月25日 12:31
わいひらさん、お疲れ様です。
寒暖差が激しいし昼間は暑くなるので体調第一で過ごしてください。
新しいGutenbergブロックも時間があるときに触ってみます。寄付特典機能と書かれると私が頂いていいのかと恐れ多いですが、本リリース前のデバッグのためと思っておきます笑。
お時間のある時にアクティベートコードを送って頂けると助かります。
わいひら 件のいいね!
2021年6月25日 20:07
・特定の操作を行った後リンク入力欄の位置がずれる
以下の手順で発生しました。
①寄付特典が解放されていない状態で、「HTML挿入」をクリックする
②リンクアイコンをクリックする
③リンク入力欄が画面の左下に表示される
リンク入力欄は、通常はリンクが挿入される箇所の周辺に表示されると思います。
また、手順②でリンクアイコンのクリックでなくCtrl+Kキーでリンクを挿入しようとした場合、
一瞬マイクカーソル下部分にリンク入力欄が表示される
→画面左上に再度表示される
という挙動になりました。
ずれた位置に表示されたリンク入力欄であっても、通常通り操作してリンクを挿入することはできます。
手順①の後に何か別の操作を行うと症状は発生しません。
わいひら 件のいいね!
Topic starter2021年6月25日 20:12
皆様ありがとうございます!
動作確認は、適当に何個かブロックを追加してみて、エラーが出ないかだけ見ていただくだけで大丈夫です。
僕の環境で全部確認したつもりではありますが、やはり他環境でエラーがでないか気になって。
ブロックエディター上で、「真っ白にならないか」もしくは「何かエラーメッセージが出ていないか」だけの確認でも大丈夫です。
ブロックエディターは、仕様が面倒なので、ほんとエラーが出ないかだけが心配。。
Topic starter2021年6月25日 20:12
皆様のメールアドレスにアクティベートコードを送付させていただきました。
今のところ、「特典」というほど機能は多くないですが 😥
今後、気力と体力に余裕があれば機能追加出来ればと思います。
Topic starter2021年6月25日 20:23
Cocoonブロックのアイコンや並び順が変わったのは仕様ですかね…?
アイコンは変更しました(Font Awesome5アイコンだと重たい感じがしたので)。
並び順はAPI2にアップデートした順にしていました;
これは確かに以前の並び順に戻した方がいいですね。
後で修正しておきます。
Topic starter2021年6月25日 20:33
Cocoonブロックのアイコンや並び順が変わったのは仕様ですかね…?
並び順を元に戻しました。
ここのzipファイルの中の
https://github.com/yhira/cocoon/tree/api_v_2_column
こちらのファイルを、現在お使いのものと同じファイルに上書きすれば並び順が変わるかと思います。
https://github.com/yhira/cocoon/blob/api_v_2_column/blocks/dist/blocks.build.js
Topic starter2021年6月25日 20:39
その他のご指摘の点に関しては、後でじっくり修正させていただこうと思います
Topic starter2021年6月25日 21:02
以下の手順で発生しました。
①寄付特典が解放されていない状態で、「HTML挿入」をクリックする
②リンクアイコンをクリックする
③リンク入力欄が画面の左下に表示される
「HTML挿入」の不具合を修正しました。
https://github.com/yhira/cocoon/tree/api_v_2_column
zipを解凍するとcocoon-api_v_2_columnというフォルダができますが、このフォルダ名をcocoon-masterに変更してアップデートするとしやすいかと思います。
※皆様ご存知とは思うのですが、一応念のため書かせていただきました。
Topic starter2021年6月25日 21:03
あと今回、アクティベートコード設定エリアの値が間違っていたので修正しました。
https://github.com/yhira/cocoon/commit/15aeb6e65322e44d05a2f8b2d2d71244332a0bfb#diff-4adc99ad1dffdf2fced137281afc3a2f52010e74338a062bb04b5f9b1839d195R11
これのせいで前テーマファイルをアップデートすると、アクティベートコードが消えてしまうかもしれません。
その際は、アクティベートコードを再入力して保存していただければ幸いです。
お手数をおかけして申しわけないです。
2021年6月26日 01:49
とりあえず環境だけは作りました。
はるさんの仰っていた
画像サイズが「フルサイズ」しか出てこない
上記は私の環境では発生しませんでした。
今日はこれだけです。
明日試してみます。
わいひら 件のいいね!
2021年6月26日 02:55
現時点での最新版をダウンロードし、
- Cocoonブロックの並び順が以前と同じ並び順になっている
- HTMLを挿入をクリックしてもリンク入力欄の表示位置が変わらない
ことを確認しました。
画像がフルサイズだけなのはわいひらさんの環境でもmk2さんの環境でも再現しなかったようなので、私の問題っぽいですね…。
わいひら 件のいいね!
Topic starter2021年6月26日 20:45
おかしいところを見つけたらこちらのトピックに報告すればいいでしょうか?
よろしければお願いいたします。
今回のように、見た目的な違和感もあれば是非教えていただければ幸いです。
今回の不具合は、新バージョン関係なく、従来のCocoonからも不具合だったっぽいです 😥
当トピックのアップデート版、双方とも修正させていただきました。
https://github.com/yhira/cocoon/commit/5a01e8eb097e0f31551a8273d17bf509efa28f04
This post was modified 1年前 by わいひら
Topic starter2021年6月26日 20:53
いろいろご確認いただき、ありがとうございます!
・ふりがな選択時にアイコンが白黒反転しない
ちょっと今回の原因はよくわからなかったので、以前のアイコンに戻しておきました。
https://github.com/yhira/cocoon/tree/api_v_2_column
2021年6月26日 21:50
もしこれまで、フォーラムに寄せられた質問に対して何度も返信されているという方でモデレーターになってもいいという方がおられましたら、書き込みをお願いします。アクティベートコードをフォーラムに登録されているメールに送らせていただきます。
モデレーターといっても特に難しいことをする必要はなく、スパムがあった場合無効化していただくだけでOKです。
チャンビアです。
私は大丈夫ですか?
5件以上の解決案はカウントしてないのでよくわからないです。私は、かなり散発的な投稿なものではあるものの、Cocoonを使っている経歴は長い方でないかと。
Gutenberg・ブロックエディター周辺は影響が大きいところなので可能な範囲でテスターに回れればと。
This post was modified 1年前 2回 by チャンビア🍺
Topic starter2021年6月27日 00:41
チャンビアさんは、全然大丈夫です。
これまでの印象だけでも絶対5件どころかもっとあると思います。
モデレーターになっていただけるということでよろしいでしょうか。
もしOKであれば、フォーラム登録のメールアドレス宛に、モデレーター用のアクティベートコードを送付させていただきます。
ただ、今のところ大した機能はないのでご了承ください 😥
テストといっても、テスト環境でアップデートしてエラーが出ないかだけ見ていただけるだけでもほんとありがたいです(以前作成したブロックでエラーが出ていないか等)。
チャンビア🍺 件のいいね!
Topic starter2021年6月27日 00:43
・Cocoonマイクロコピーブロックの揃え位置がおかしい
「マイクロバルーン」「マイクロテキスト」についてです。
選択した揃え位置と、編集画面での表示位置が一致していません。
実際の公開記事画面では選択した通りの位置に表示されます。選択した揃え位置→編集画面での表示位置の形式で一覧にすると
マイクロバルーン
未選択→中央揃え
左寄せ→左寄せ
中央揃え→左寄せ
右寄せ→右寄せマイクロテキスト
未選択→左寄せ
左寄せ→左寄せ
中央揃え→左寄せ
右寄せ→右寄せでした。
これについては、マイクロテキストの修正のめどはついたんですけど、マイクロバルーンが…。
今回の仕様変更の影響をもろに受けてしまいました。。
明日以降も、試行錯誤してみます。
あまり夜遅くまで根を詰めてやると不眠症になってしまうので、今日はここら辺で寝ます 😴
This post was modified 1年前 by わいひら
Topic starter2021年6月27日 01:38
急にやり方をひらめいたので、マイクロテキストとマイクロバルーンのブロックエディター上での動作を、ちょっと無理やりですが修正しておきました。
https://github.com/yhira/cocoon/tree/api_v_2_column
マイクロコピーの下に余白が入るのは、ブロックを追加する「+」ボタンを表示するためで仕方ないかも。
This post was modified 1年前 by わいひら
Topic starter2021年6月30日 20:39
ご確認いただきありがとうございます!
モバイルの設定を失念しておりました。
余白を修正しておきました。
https://github.com/yhira/cocoon/tree/api_v_2_column
https://github.com/yhira/cocoon/commit/ec3b1e36f91665f7db577d3e662130cc48a5544f
Topic starter2021年7月5日 20:34
そこは確かに。
ただ、マウスホバー時にしか表示されないので、ソースコードを見れなくて、ちょっと直し方がよくわからなくてそのままにしてあります。
デベロッパーツールで強制的に:hoverにしても表示されなくて。
こういう時どうすればいいんだろう。
2021年7月5日 22:08
私もデベロッパーツールで調べてみましたが、確認できませんでした。
どうなってるんでしょう。。。
(Gutenbergの仕組みは分かっていませんけど。)
何かイベントもあるみたいですけれど、マウスホバーのイベントなどあるのでしょうか。
(その辺はまったく分からず。。。)
Topic starter2021年7月8日 23:10
Gutenberg API 2対応版をこちらにマージ(結合)しておきました。
https://github.com/yhira/cocoon
とりあえずプレビューに関しては、大きな不具合ではないので、とりあえずしばらく様子を見ます。
プレビュー画面の外枠のクラスメイトかだけでもわかれば、対応できそうなんだが…。
mk2 件のいいね!
2021年7月9日 00:41
プレビュー。。。さっぱり分かりません。
もしかして
https://ja.wordpress.org/team/handbook/block-editor/reference-guides/block-api/block-registration/
のexampleプロパティ?
と思い
blocks\src\layout\column-2\block.js
を確認してみたのですが。。。
まったくさっぱり分からず、力尽きました。
やはり仕組みが分かっていない人間には、まったく無理っぽいです。
迷走してしまいました。
あまり気にしなくてもという気はします。
わいひら 件のいいね!
Topic starter2021年7月9日 19:54
ありがとうございます。
よくよく考えたら、不具合のある表示をするくらいなら、exampleを削除してしまって、表示しない方が親切ですよね。
表示しないように変更しておきました。
https://github.com/yhira/cocoon
mk2 件のいいね!
2021年7月16日 21:45
チャンビアさんは、全然大丈夫です。
これまでの印象だけでも絶対5件どころかもっとあると思います。
モデレーターになっていただけるということでよろしいでしょうか。
もしOKであれば、フォーラム登録のメールアドレス宛に、モデレーター用のアクティベートコードを送付させていただきます。
ただ、今のところ大した機能はないのでご了承ください 😥
テストといっても、テスト環境でアップデートしてエラーが出ないかだけ見ていただけるだけでもほんとありがたいです(以前作成したブロックでエラーが出ていないか等)。
相変わらず、散発的な登場で失礼します。
何かできることあれば、時間のあるときに協力いたします。
2021年7月19日 04:37
もしこれまで、フォーラムに寄せられた質問に対して何度も返信されているという方でモデレーターになってもいいという方がおられましたら、書き込みをお願いします。アクティベートコードをフォーラムに登録されているメールに送らせていただきます。
モデレーターといっても特に難しいことをする必要はなく、スパムがあった場合無効化していただくだけでOKです。
チャンビアです。
テストといっても、テスト環境でアップデートしてエラーが出ないかだけ見ていただけるだけでもほんとありがたいです(以前作成したブロックでエラーが出ていないか等)。
フォーラムを荒らしたり、歴史が浅かったりしますが、「スパム無効化」や「アップデートのテスト」などでしたらお役に立てそうなので「チャンビア」さんの足元にも及びませんが、私、名乗り出ても大丈夫でしょうか。
テスト環境ではなくいつも本番ですが...2つのドメイン(環境)で確認できます。参考程度のページ作ってみました。
Cocoon 「寄付 特典」 動作確認
頼りなく微妙なラインだと思いますので、怪しかったら返信せずスルーしてください。
This post was modified 1年前 by 投票2020
Topic starter2021年7月19日 20:36
モデレーター希望ということでよろしいでしょうか。
2021年7月19日 21:22
モデレーター希望ということでよろしいでしょうか。
はい、希望します。
テストといっても、テスト環境でアップデートしてエラー
スパムがあった場合無効化
他は、少しばかりの提案など。頼りないので流して頂いても大丈夫です。ゆる募だったもので...。
ここからは主観的ラブレターです。今まで闘病しながら無料でされてきました。そして、相当な経緯とともに寄付を募られました。腹をくくっているんだろうなとひしひしと感じます。
また、フォーラム停止を望まない1人です。現在のモデレーターの方々や、そうでない方も良識のある方たちばかりです。みんなで協力すれば半分くらいは解決できるんじゃないかと。もう半分は、この先はわいひらさんの範疇です、と言いながらみんなで寄付を募るのが自然かと思います。
本人が何度も寄付してくださいなんて中々言えません。私が今、左手首の先が動かなくてリハビリ?みたいなことを実体験中です。わいひらさんをゆっくりと待ちながら維持できれば。たくさんの方が離れないためにもアイドリングしながら、お待ちしようかと思い希望します。
様々な意見をもとにした最終的なわいひらさんの決断に従います。
Topic starter2021年7月20日 19:57
確認したところ、募集要件を満たしていたのでモデレーターに変更しておきました。
寄付特典のアクティベートコードはお持ちですか?
元々、「Gutenberg APIアップデートの外注費用を1年ぐらいかけて補填できればいいや」と、アップデート記事にだけ書いて、僕自身はTwitterで直接呼びかけたりはしてませんでした(気恥ずかしさもあって)。
けれど、ありがたいことに気づいた方が呼びかけてくださって、先日の外注費用は賄うことができました。
僕自身も、本業の収入もあるので、そこまで必要なわけではなく、これ以上は望みません。
※テーマ以外の仕事で得た貯金を切り崩してまで毎回外注するとしたら、僕としても負担が大きいので、今回の特典機能をつけた次第です。
もう目的は、十分達せられたので大丈夫です。ありがとうございます。
This post was modified 1年前 by わいひら
投票2020 件のいいね!
2021年7月20日 22:19
どうもありがとうございます。
寄付特典のアクティベートコードはお持ちですか?
はい、持っています。
こちらで試しています。
Cocoon 寄付(特典機能あり) 色々動作確認ページ
更新日ショートーコードにインラインを引いても出力されるようです。
Topic starter2021年7月21日 20:59
そしたら、コードを送らなくても大丈夫そうですね。
とりあえず、問題なさそうなのでこのトピックを終了しておきたいと思います。
ただ、WordPress5.8で問題が出たようです…。原因を探らねば…。
投票2020 件のいいね!