Cocoonにデフォルトで用意されている豊富なボタン類

ボックス アイコン

アイコン 補足情報 i
class=”information-box common-icon-box”>
アイコン 補足情報?
class=”question-box common-icon-box”>
アイコン 注意喚起 !
class=”alert-box common-icon-box”>
アイコン メモ
class=”memo-box common-icon-box”>
アイコン コメント
class=”comment-box common-icon-box”>
アイコン OK
class=”ok-box common-icon-box”>
コメント NG
class=”ng-box common-icon-box”>
アイコン GOOD
class=”good-box common-icon-box”>
アイコン BAD
class=”bad-box common-icon-box”>
アイコン プロフィール
class=”profile-box common-icon-box”>

ボックス 案内

案内 プライマリー
class=”primary-box”>
Primary
案内 セカンダリー
class=”secondary-box”>
案内 ダーク
class=”dark-box”>
案内 サクセス
class=”success-box”>
Success
案内 インフォ
class=”info-box”>
Info
案内 ワーニング
Worning
class=”warning-box”>
案内 デンジャー
Danger
class=”light-box”>
案内 ライト
class=”light-box”>

アフィリエイトに使えるリンクボタン

class=”micro-top micro-center”>\お得な航空チケット/

class=”btn-wrap btn-wrap-indigo btn-wrap-l”>とコーディングして、次にリンク先のURLを記述

スティッキー

  • class=”blank-box sticky st-blue”>

タイムライン

スケジュール
  • 09:00~09:30
    Coldplay
    イエロー
  • 09:30~10:00
    見出し
    ここに内容1

Cocoon タブボックス

class=”blank-box bb-tab bb-check”>
class=”blank-box bb-tab bb-check bb-yellow””>
class=”blank-box bb-tab bb-check bb-red”>
class=”blank-box bb-tab bb-check bb-blue”>
class=”blank-box bb-tab bb-check bb-green”>
class=”blank-box bb-tab bb-comment bb-green”>
class=”blank-box bb-tab bb-point bb-blue”>
class=”blank-box bb-tab bb-tips bb-yellow”>
class=”blank-box bb-tab bb-hint bb-red”>
class=”blank-box bb-tab bb-pickup bb-blue”>
class=”blank-box bb-tab bb-memo bb-blue”>
class=”blank-box bb-tab bb-ok bb-red”>
class=”blank-box bb-tab bb-ng”>
class=”blank-box bb-tab bb-amazon bb-green”>
class=”blank-box bb-tab bb-info bb-blue”>

アコーディオン


コンテンツの中身を入力

Cocoonのオリジナルのタブ見出しボックス

  • 大枠は class=”wp-block-cocoon-blocks-iconlist-box iconlist-box blank-box list-caret-right block-box”
  • タイトルは class=”iconlist-title”
  • 中身はそのままタイトルの次に
Info
コーディングが複雑すぎる
見出し
コーディングが複雑すぎる
見出し
コーディングが複雑すぎる
タブ見出しボックス
コンテンツの中身を入力
タブ見出しボックス
変更できる? コンテンツの中身を入力
タブ見出しボックス
変更できる?コンテンツの中身を入力
ここを自由に変更できる
コンテンツの中身を入力コンテンツの中身を入力コンテンツの中身を入力

コメント

タイトルとURLをコピーしました