サイト内検索
Cocoonフォーラム
![](https://wp-cocoon.com/wp-content/themes/cocoon-master/screenshot.jpg)
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2018年7月9日 02:50
拡張スタイル「タブボックス」の実装ありがとうございました!
嬉しい機能の一つです。
https://wp-cocoon.com/tab-box-style/
これだけでも非常に嬉しいのですが、チェック/コメント/ポイント等の文字が手軽に変更できると嬉しいと思いました。
同じような方もいらっしゃいましたので気長にお待ちしております。
https://kamigamolife.com/work/cocoon-tabbox/
こちらを応用して「あわせて読みたい」なんてのもできそう。チャレンジしてみよう٩(๑❛ᴗ❛๑)۶
早速作ってみました♪がcocoonを更新したら、表示されなくなり(cssが上書きされたので当たり前ですが・・・再度やってみましたが出来ませんでしたorz)
わいひら reacted
2018年7月9日 08:00
ラベルタイトルも自分で手打ちできるといいのですが、難しいのでしょうか。
これはちょっと、ビジュアルエディターの「スタイル」と書かれた、ドロップダウンリストで利用する方法では出来ないような気がします。
他テーマとかだと、ショートコードとかを利用しされているのではないでしょうか。けれどいろいろ、参考にさせていただきます。
スタイル拡張でボックスの種類を増やして欲しい | 要望 | Cocoon フォーラム#post-2618
以前このようにコメントされてますが、気長にお待ちいただけたら。
とりあえずの代替策としてですが
adQuickTagのブラグインは入れていたので、書いていただいたタグを開始・終了にして試してみましたが、希望する表示にはなりませんでした。
CSSを入れてないのでそのコードだけでは表示されないです。
adQuickTagにそのコードを入れてるなら、以下のようなCSSを追加してください。
.title-box { /* border: 1px solid #d8d8d8; */ background-color: #fef3ff; border-radius: 3px; width: 90%; margin: 0 auto; padding: 1em; margin-bottom: 2.2em; position: relative; display: block; overflow: visible; /* z-index: 1; */ } .box-title { content: ""; font-weight: bold; /* font-size: 100%; */ background: #f999ff; border-radius: 3px; color: #fff; padding: 0 14px; top: -15px; position: absolute; left: 20px; }style.cssや必要であればエディタ用・amp用にも。
イメージ画像は以下の通りです。色がわからなかったのでピンク系を入れてます。今みたら、title #58b3bb box #ecf4f8 かもです。
html
Topic starter
2018年7月9日 19:11
かうたっくさん、いつもありがとうございます。
自己解決しました。
例えば子テーマのstyle.cssに以下追加してテキスト編集で入力して
.bb-yomitai::before {
content: "\f06a 合わせて読みたい";
}
以下のような感じでテキスト入力で打ち込めば出来ました◎
xxx
Topic starter
2018年7月9日 19:12
xxx
Topic starter
2018年7月9日 19:18
うまく表示できず申し訳ありません。
以下のようなイメージです。
<div class="blank-box bb-tab bb-yomitai bb-yellow">xxx</div
2018年7月9日 20:37
それでも可能ですけど、けっこう面倒かもしれない…と思います。
ビジュアルエディターの「スタイル」と書かれた、ドロップダウンリストで利用する方法では出来ないような気がします。
と言う事ですが、タグってところを編集したら可能だと思います。
2018年7月9日 20:44
https://github.com/yhira/cocoon/blob/master/lib/tinymce/html-tags.php#L40
40~84行目にタグを追加して、デザインをCocoonのモノと同じにすれば、4色分だけで色んな文字列を管理画面の投稿編集のビジュアルエディタから可能です。
(編集理由:変なHTMLの文字列削除)
例えば以下のように
エディタ用CSSにstyleを書いたらかなり分かりやすいかもです?
あとはstyle.css・amp.cssも必要であれば装飾を書けば、ビジュアルエディタ上で文字列の変更は簡単です。
2018年7月9日 21:53
これだけでも非常に嬉しいのですが、チェック/コメント/ポイント等の文字が手軽に変更できると嬉しいと思いました。
これは、ショートコードを用いれば容易なんですが、ビジュアルエディターで見づらいショートコードを使ってまで実装すべきかどうかで迷っています。
Topic starter
2018年7月10日 03:31
かうたっくさん>コメントありがとうございます。
ちょっと私の知識不足で理解が追いついてないところがあるので時間があるときに勉強させていただきます!
わいひらさん>ありがとうございます。ひとまず私のやりたいことは出来たので大丈夫です!
2018年7月10日 19:59
タブラベルの表記に関しては、英語か、日本語で僕も結構悩みました。
なので、結構日本語にしたい方もおられると思うので、カスタマイズ方法をまとめておきました。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。