サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
トピックスターター 2024年8月8日 22:26
こんにちは、いつもCocoonを使わせて頂いています、ありがとうございます。
現時点でCocoonのブロックエディター機能に設定してある６つのショートカットキーをクラシックエディタ用にも搭載していただきたいです
- 黄色マーカー:ctrl+shift+y
- 黄色アンダーラインマーカー:ctrl+shift+z（yの下の文字）
- 赤色マーカー:ctrl+shift+r
- 赤色アンダーラインマーカー:ctrl+shift+s（rの下の文字）
- 青色マーカー:ctrl+shift+b
- 青色アンダーラインマーカー:ctrl+shift+c（bの下の文字）
ご検討宜しくお願い致します。
2024年8月8日 23:30
試しにやってみましたが、以下でできるようでした。
（黄色マーカーと、黄色アンダーラインマーカーしか試していません）
function add_custom_tinymce_shortcuts($mceInit) {
$mceInit['init_instance_callback'] = 'function(editor) {
// 黄色マーカー (Ctrl + Shift + Y)
editor.addShortcut("ctrl+shift+y", "Insert yellow marker", function() {
var selectedText = editor.selection.getContent();
var markerText = "<span class=\"marker\">" + selectedText + "</span>";
editor.execCommand("mceInsertContent", false, markerText);
});
// 黄色アンダーラインマーカー (Ctrl + Shift + Z)
editor.addShortcut("ctrl+shift+z", "Insert yellow underline marker", function() {
var selectedText = editor.selection.getContent();
var markerText = "<span class=\"marker-under\">" + selectedText + "</span>";
editor.execCommand("mceInsertContent", false, markerText);
});
}';
return $mceInit;
}
add_filter('tiny_mce_before_init', 'add_custom_tinymce_shortcuts');
上記の行を増やして（コピーして）、以下の部分を変えると、他のものもできるのではないかと思われます。
（試していません）
- ショートカットの部分「addShortcut("ctrl+shift+y"」
- マーカーのclass「span class=\"marker\"」
（私はクラシックエディタで確認しましたが、おそらくブロックエディタでも、同様のclassが追加されるのではないかと思います）
簡単にしか試していませんので、上手くいかなかったらすみません。
わいひら reacted
2024年8月9日 21:30
cssに少しだけ追加したら無事三色とも動きました
「CSS」とありますが、これは誤記でしょうか。
（私が提示したコードのことならば、子テーマのfunctions.phpに追加してください。別件であれば、ご放念ください）
解決したのであれば、何よりです。
2024年8月9日 22:44
mk2さんさんありがとうございます。
mk2さんのコードを使わせていただいてクラシックエディターのマーカースタイルにショートカットキーを設定しておきました。
------------------------------------------------
https://github.com/xserver-inc/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。
WordPressでの手動アップデート方法はこちら
https://wp-cocoon.com/manual-update-of-cocoon-theme/
------------------------------------------------
ｍｋ２ reacted
トピックスターター 2024年8月9日 23:22
functions.phpにショートカットの部分とマーカーのクラスをそれぞれ変更して三色マーカーを動作させようとしたのですが自分の環境では黄色以外は動作しませんでした。
なので（functions.phpに三色マーカーのコードを追加した後）CSSに少し追加したら無事に動作するようになりました。 肝心の部分を端折ってしまい申し訳ございません。
@わいひらさん
ここまで迅速な対応していただけるとは思っていませんでした。
mk2さん、わいひらさん お二方さん本当にありがとうございます
この投稿は5か月前ずつMI9876に変更されました
2024年8月9日 23:53
MI9876さん
functions.phpにショートカットの部分とマーカーのクラスをそれぞれ変更して三色マーカーを動作させようとしたのですが自分の環境では黄色以外は動作しませんでした。
動作しないということは、コピーミスなのかもしれないです。
動作自体は、正しい範囲をコピーするだけですので、問題ないはずです。
マーカーが適用されないということであれば、正しいclass出ない可能性もあるのかもしれないです。
今回のものは、別にマーカーでなくても利用できると思います。
HTMLをclass付きのspanタグで囲っているだけですので。
今回、わいひらさんに修正していただいた、親テーマの修正履歴をみれば分かると思います。
https://github.com/xserver-inc/cocoon/commit/e9b9d25121e78c212074308174ae4a9c6d8ea447
基本的には、ショートカットキーと、classを変更するだけです。
わいひら reacted
2024年8月10日 19:42
ご対応いただき、ありがとうございます。
動作確認のご連絡がないようですので、代わりに私が。
親テーマ更新後、クラシックエディタで、以下の通りに、キーボードショートカットで、マーカーを挿入できることを確認させていただきました。
- 黄色マーカー:ctrl+shift+y
- 黄色アンダーラインマーカー:ctrl+shift+z（yの下の文字）
- 赤色マーカー:ctrl+shift+r
- 赤色アンダーラインマーカー:ctrl+shift+s（rの下の文字）
- 青色マーカー:ctrl+shift+b
- 青色アンダーラインマーカー:ctrl+shift+c（bの下の文字）
勝手ながら、当方にて動作確認もできたことから、本トピックを「解決済」にさせていただきました。
わいひら reacted
2024年8月12日 18:38
ご確認いただきありがとうございます！
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。