Jimdoクラス名一覧

Jimdoの独自レイアウト作成に役立つチートシートを配布します。

レイアウトを調節するのに使用するであろうクラス名をまとめたチートシートです。

ダウンロード
Jimdoクラス名一覧
独自レイアウトに役立つクラスの一覧です。
Jimdoクラス集.pdf
PDFファイル 71.2 KB
ダウンロード
用途 タグ Class名 初期プロパティ・値 出現場所
ページ別のレイアウト body body 　 全ページのbodyタグ
cc-page 　 全ページのbodyタグ
cc-content-parent 　 全ページのbodyタグ
cc-page-index 　 トップページ、利用規約ページ、返品条件ページ、ショップ情報ページ、精算ページ、サイトマップページのbodyタグ
cc-pageindex 　 トップページ、利用規約ページ、返品条件ページ、ショップ情報ページ、精算ページ、サイトマップページのbodyタグ
cc-pagemode-default 　 トップページ、下層ページ、概要ページ、ブログページのbodyタグ
cc-pagemode-sitetemplate 　 利用規約ページ、返品条件ページ、ショップ情報ページ、精算ページのbodyタグ
cc-pagemode-overlay 　 プライバシーステートメント、サイトマップページのbodyタグ
cc-page-blog 　 ブログページのbodyタグ
ナビゲーションのレイアウト
navi(standard) 		ul mainNav1 　 第一階層ページに該当するulタグ
mainNav2 　 第二階層ページに該当するulタグ
mainNav3 　 第三階層ページに該当するulタグ
a level_1 　 第一階層ページに該当するaタグ
level_2 　 第二階層ページに該当するaタグ
level_3 　 第三階層ページに該当するaタグ
current 　 現在表示しているページに該当するaタグ
parent 　 現在表示しているページが子ページの場合、親ページに該当するaタグ
ナビゲーションのレイアウト
navi(nested) 		ul cc-nav-level-0  　 第一階層ページに該当するulタグ
 j-nav-level-0 　 第一階層ページに該当するulタグ
cc-nav-level-1 　 第二階層ページに該当するulタグ
j-nav-level-1 　 第二階層ページに該当するulタグ
cc-nav-level-2 　 第三階層ページに該当するaタグ
 j-nav-level-2 　 第三階層ページに該当するaタグ
フッターのレイアウト div leftrow float: left; 印刷用、サイトマップなどへのリンクを囲むdivタグ
text-align: left;
width:  55%;
rightrow float: right; ログイン、ログアウトなどのリンクを囲むdivタグ
text-align: right;
width:  42%;
コンテンツメニューのレイアウト div n height: 1%; コンテンツメニューから作成した各エレメントを囲むdivタグ
padding:  5px;
見出しエレメント div j-header padding:  1px !important 見出しエレメントを囲むdivタグ
写真エレメント div j-imageSubtitle 　 写真エレメントを囲むdivタグ
文章エレメント div j-text 　 文章エレメントを囲むdivタグ
写真付き文章エレメント div j-textWithImage 　 写真付き文章エレメントを囲むdivタグ
カラムエレメント div j-hgrid padding:  1px !important; カラムエレメントを囲むdivタグ
cc-m-hgrid-column float: left; 作成したカラムを囲むdivタグ
padding:  0 2% 0 0;
余白エレメント div j-spacing min-height: 1px; 余白エレメントを囲むdivタグ
表エレメント div j-table 　 表エレメントを囲むdivタグ
フォトギャラリーエレメント div j-gallery 　 フォトギャラリーエレメントを囲むdivタグ
ファイルダウンロードエレメント div j-downloadDocument 　 ファイルダウンロードエレメントを囲むdivタグ
leftDownload width:  52px; ファイルのアイコンを囲むdivタグ
float: left;
rightDownload margin-left: 55px; ファイルのタイトルや説明が表示される部分を囲むdivタグ
padding-left: 6px;
フォームエレメント div j-formnew 　 フォームエレメントを囲むdivタグ
　 clear:  both; 　
cc-m-form-view-element padding:  5px; フォームから作成したすべての項目を囲むdivタグ
cc-m-form-text position: relative; テキストフィールド項目を囲むdivタグ
cc-m-form-email 　 メールアドレス項目を囲むdivタグ
cc-m-form-calendar 　 カレンダー項目を囲むdivタグ
cc-m-form-textarea 　 テキストエリア項目を囲むdivタグ
cc-m-form-number 　 数字項目を囲むdivタグ
cc-m-form-select 　 ドロップダウンリスト項目を囲むdivタグ
cc-m-form-radio 　 ラジオボタン項目を囲むdivタグ
cc-m-form-check 　 シングルチェックボックス項目を囲むdivタグ
cc-m-form-checkgroup 　 複数チェックボックス項目を囲むdivタグ
cc-m-form-subheading 　 カテゴリータイトル項目を囲むdivタグ
cc-m-form-view-captcha 　 スパム防止項目を囲むdivタグ
cc-m-form-view-submit 　 送信ボタンを囲むdivタグ
水平線エレメント div j-hr 　 水平線エレメントを囲むdivタグ
ゲストブックエレメント div j-comment 　 ゲストブックエレメントを囲むdivタグ
ul com-list margin: 0 0 15px  0; コメントを表示する部分全体を囲むulタグ
li commentstd padding:  0; コメントを表示する部分全体を囲むulタグの直下のliタグ
display: block;
border-top:  1px solid  #CCC;
padding:  12px 0 12px  0;
position: relative;
list-style: none;
YouTube等エレメント div j-video list-style-image: none; YouTube等エレメントを囲むdivタグ
Flickrエレメント div j-flickr 　 Flickrエレメントを囲むdivタグ
Google マップエレメント div j-googlemaps 　 Google マップエレメントを囲むdivタグ
ウィジェットエレメント div j-htmlCode 　 ウィジェットエレメントを囲むdivタグ
商品エレメント div j-product 　 商品エレメントを囲むdivタグ
商品カタログエレメント div j-catalog 　 商品カタログエレメントを囲むdivタグ
RSSフイードエレメント div j-rss 　 RSSフィードエレメントを囲むdivタグ
Twitterエレメント div j-twitter 　 Twitterエレメントを囲むdivタグ
Facebookエレメント div j-facebook 　 Facebookエレメントを囲むdivタグ
Google+エレメント div j-googleplus 　 Google+エレメントを囲むdivタグ
シェアボタンエレメント div j-sharebuttons 　 シェアボタンエレメントを囲むdivタグ
ブログ表示エレメント div j-BlogSelection 　 ブログ表示エレメントを囲むdivタグ
j-blogarticle padding:  5px 0; タイトルや日付を囲むdivタグ
datetime float: left; ブログの日付を囲むdivタグ
width:  44px;
height: 45px;
margin: 0 10px 10px 0;
background:
url(/s/img/cc/datesticker-bg.png)
no-repeat center center;
dt-alignment-right float: right; ブログの日付を囲むdivタグ
トップへ戻るボタンのレイアウト ul cc-FloatingButtonBarContainer display: block; トップへ戻るボタンを囲むulタグ
position: fixed;
z-index:  10100;
bottom: 54px;
right: 60px;
list-style-type: none;
li cc-FloatingButtonBarContainer-button-scroll-show display: block; トップへ戻るボタンを囲むulタグの直下のliタグ
margin-right:  2px;
float: left;
ショッピングカートのレイアウト div cc-sidecart-header background: #EEE; タイトル「ショッピングカート」と上部の購入ボタンを囲むdivタグ
margin-top: 10px;
padding:  7px 7px;
border-bottom: 1px solid #CCC;
color: #333;
cc-sidecart-header background: white; 商品写真や商品名を囲むdivタグ 
padding:  10px 5px;
border-bottom: 1px solid #CCC;
min-height: 80px;
cc-sidecart-calculation font-size:  12px; 小計を囲むdivタグ
line-height: 16px;
text-align: left;
cc-sidecart-footer overflow: hidden; 下部の購入ボタンを囲むdivタグ
background: #EEE;
padding:  5px 7px;
margin-bottom: 10px;
border-top:  1px solid  #CCC;
ダウンロード
Jimdoクラス名一覧
Jimdoクラス集.pdf
PDFファイル 71.2 KB
ダウンロード

 最後までお読みいただきありがとうございます！いかがでしたか？

このページが参考になったら、ぜひ左のボタンでFacebookかTwitterにシェアしていただけると嬉しいです！

押してくれたらもっとこうしんするぴ！