サイト内検索
インラインブロックについて（insertObject） | Cocoon Blocksに関する質問・不具合報告・要望 | Cocoon フォーラム
書き込みの前に以下の3点をご確認ください。
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
また、問題の解決に至った場合には、トピック冒頭の「解決済み」リンクをクリックしていただけますと幸いです。
また、有用な返信があった場合は「いいね！」リンクもご活用ください。返信者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。
フォーラムのTwitterアカウント（@CocoonForum）はこちら。
2019年4月3日 01:07
https://wp-cocoon.com/bugs-and-wants/
「やりたいけど出来ていないところ」としてインラインブロックが挙げられていますが、どこまで進んでいるのか分からないのでとりあえずポイントだけ書き残しておきます。
こちらにあるrender内にて、公式のインライン要素である「インライン画像」が記述されており、
- リッチテキスト（オブジェクト）がアクティブの場合にブロックボタンを表示
- クリックでメディアアップロードコンポーネントを開く
- リッチテキスト内に選んだ画像を挿入
となっています。
ここの3番で、insertObjectによって挿入しているのがポイントかと思われます。
なのでインライン画像と同じような形式でいくなら、例えばモダールで開く部分をraw HTMLの入力欄に変え、入力されたショートコードを挿入するみたいな感じになるんでしょうかね。
2019年4月3日 19:53
いつも誠にありがとうございます。
insertObjectという便利なものがあるんですね。
メモメモ。
https://github.com/WordPress/gutenberg/blob/7964f381e07e06b2ac13698fd1465a4d0c16da1b/packages/rich-text/src/insert-object.js
こちらも、近いうちに実装できればと思います。
2019年4月5日 20:27
右端ドロップダウン部分の主なソースコードを添えておきます。
FormatToolbar
2019年5月12日 06:35
本トピックを書いたときにはインライン画像部分のコードを読んだだけの提案だったのですが、実際に触ってみたところ、insertObjectは挿入されるフォーマット内のオブジェクトを指定するものなので誤りで、正しくはinsertObject内でも使用されているinsertを用いるのがよさそうです。
【サンプルコード】
https://notepad.pw/code/l3qm1r1xg
2019年5月12日 22:27
サンプルコード、ありがとうございます！
ショートコード機能に関しては、ツールボタン スペースも限られていることから、本文下のSEO設定がある欄あたりに、ショートコードコピペ用の項目でも作ろうかと思っていました。
ただ、あらためてGIFアニメとしてみると、やっぱりツールボタンから手軽にアクセスできる仕様は魅力的ですね。
やっぱり、ツールボタンとして実装しようかと思い始めました。
ツールボタン 問題については、表示を切り替える機能でもつければ良いかなと。
昨日、吹き出し、吹き出しEXブロックの不具合も改善出来たと思うので、明日からショートコード機能に取りかかってみようと思います。
2019年5月13日 00:04
ツールボタンスペースも限られていることから、本文下のSEO設定がある欄あたりに、ショートコードコピペ用の項目でも作ろうかと思っていました。
個人的には、アフィリエイトタグなどの広告用ショートコードくらいはツールバーにボタンがあった方が楽だなと感じています。
あまり使用する機会のなさそうなショートコードはInspectorにショートコード用パネルとしてまとめておくとか、ショートコードブロックにだけボタンを表示させるとかでもいいかもしれません。
pono 件のいいね！
2019年5月14日 20:41
実際に実装してみたら、やはりツールボタンから手軽にアクセスできる方が楽ですね。
とりあえず、全てのショートコードをツールボタンのドロップダウンで実装しました。
------------------------------------------------
https://github.com/yhira/cocoon
最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。
FTPでのアップデート方法はこちら。
https://wp-cocoon.com/ftp-update/
------------------------------------------------
ただ、人によっては不要なドロップダウンもあると思うので、Cocoon設定の「エディター」タブの設定項目から非表示にできるようにもしておきました。
2019年5月14日 22:33
確かに。
そこまで考えがおよんでいませんでした。
修正したものをアップしておきました。
https://github.com/yhira/cocoon
要望を除けば、これで一通り「今後の予定」としていた機能は完成ですかね？
一応、旧エディターであった機能移行としては、完成といった感じです。
あと1つ作るとしたら、評価スターブロックくらいでしょうか。
2019年5月14日 23:41
表示チェックの有無に関係なく、空のコンポーネントが表示されるようになりました。
おそらく、関数is_block_editor_○○で取得されるのがstring ""だったのに対し、変更後に受け渡すようにした変数$is_○○がtrue/falseとなっている点に問題があると思われます。
pono 件のいいね！
2019年5月15日 01:53
例えば、ランキングの表示について挙動を見てみると、
wp_localize_scriptに関数is_block_editor_ranking_shortcode_dropdown_visibleで取得したstring値（修正前）を入れると、チェックの有無で判定されます。
一方、$is_rankings_visibleに入るtrue/falseのbool値（修正後）のままだと上記で示したように判定されていません。
なので、React側で書かれた判定をtrue/falseによる判定に修正するか、$is_rankings_visibleで受け渡す値をstring値にする必要があるのではないかと思います。
2019年5月15日 17:07
今朝は時間的に訂正くらいしか書く余裕がなかったので、もう少し補足しておきます。
wp_localize_script
$dataはarrayでの受け渡しになります。
各ショートコードの情報は空（全て非表示）でも配列で返されているのでそのまま受け渡しても問題ありません。
一方で、ドロップダウンの判定値はstringまたはboolのまま受け渡してしまっています。
この問題により、今回の修正でbool→arrayとなってtrue判定されているわけなので、適切な修正例としては「それぞれのドロップダウン表示判定値をひとつの配列にまとめる」などが考えられます。
2019年5月16日 06:02
修正ありがとうございます。
「『全て非表示』かつ『表示チェックあり』」の場合まで考慮するかは細かいので微妙なところではありますが、きちんと対応するのであれば、$is_affiliates_visible部分を例に
https://notepad.pw/code/lek2j0fe
などで対応できると思います。
受け渡し自体には特に問題なさそうなので、ひとまずエディタ周りのGutenberg移行作業お疲れさまでした。
返信する
フォーラムの統計
13フォーラム
5,428トピック
39.7 K投稿
64オンライン
6,994メンバー
最新の投稿: ヘッダーに表示されるサイトタイトルを非表示にしたい 最新のメンバー: dioceseo Recent Posts Unread Posts
