ショップサーブ管理画面


管理画面トップへ　│　Ｅストアーコネクト設定　│　スマートフォンサイト設定　│　お問い合わせ　│　各種手続き　│　サイトマップ　│　ログアウト

本サイトは管理画面の閲覧専用サンプルです。実際の操作は行えません。

テーマのカスタマイズ

テーマ

トップページ

商品一覧・詳細ページ

その他ページ

デザインの既存テーマを元にカスタマイズします

デザインテーマのスタイルシート(CSS)を編集して、文字色、文字の大きさ、背景色などが変更できます。

※テーマのカスタマイズ方法は、ご利用ガイドに掲載しております範囲でサポートさせていただきます。
⇒テーマのカスタマイズ　スタイルシートの紹介

現在使用中のテーマポップ > キュート

テーマで使用している「カゴへボタン」「在庫切れボタン」「おすすめアイコン」などの画像を変更するには[ボタンの変更]ボタンをクリックしてください。

カスタムテーマ
新規テーマ1	避暑
新規テーマ2	メンズアパレル
新規テーマ3	アーバンライフ
新規テーマ4
新規テーマ5

テーマ編集
テーマの名前
スタイルシート	/* テーマ：ポップ／キュート / body{ font-family:"ＭＳＰゴシック", Osaka,monospace; margin:0px auto; padding:0px; font-size:84%; line-height:135%; color:#333333; background:/url(../img/body_img.gif) repeat;/ #ffffff } table{ / 基本テーブル設定（固定）/ border:0px none; margin:0px; padding:0px; text-align:left; border-collapse:collapse; } th {border:0px none;margin:0px;padding:0px;border-collapse:collapse;vertical-align:top;} td {border:0px none;margin:0px;padding:0px;border-collapse:collapse;vertical-align:top;} th {white-space:nowrap;} h1,h2,h3,h4 { / 基本タイトル（固定）/ padding:0px; margin:0px; font-size:100%; text-align:left; } a{ / 基本のリンク（固定）/ color:#083463;text-decoration:underline} a:hover { color:#FF6D00;text-decoration:none} ul{ / 基本のリスト（固定）/ list-style-type:square;} ul ul{ list-style-type:none;} img{ border:0px;}/ イメージボーダー指定 / form { padding:0px;display:inline;} p{ line-height:150%;margin:5px 0px;padding:2px 0px;} .clear_both { / 画像の周り込み解除 / clear:both; font-size:1px; visibility:hidden; overflow:hidden; height:1px; text-align:center } .button1{ / inputボタン設定 / cursor:pointer; color:#F00079; background:#FCCDE5; border-top-color:#F995C9; border-right-color:#F995C9; border-bottom-color:#F995C9; border-left-color:#F995C9; font-weight:bold; } .text1 {border:1px solid #CCCCCC;}/ テキストエリアデザイン設定 / .sidebox .text1 {border:1px solid #CCCCCC;width:100px;} .caution{ font-weight:bold;color:#FF6600;}/ エラーメッセージ / .no2{font-size:110%;} / フォントズーム / .strong{ font-weight:bold;}/ フォントボールド / .red{color:#CC0000;} / フォント赤 / .orange{color:#FF9900;} / フォントオレンジ / .blue{color:#0000FF;} / フォント青 / .green{color:#006600;} / フォント緑 / .glay{color:#666666;} / フォントグレー / .item img{/ 商品画像枠 / height:auto; padding:5px; margin:0px; background:#FFFFFF; text-align:center; } .spacebox{/ スペース設定 / height:50px; } /******************************************************************/ / 大枠テーブル（固定） / #container { width:860px; text-align:left; border:1px solid #B6A081; background:url(../img/body_img.gif) ; } / マイページ、ポップアップ画面 / #enter { width:100%; text-align:left; background:/ url(../img/enter.gif) / #EEEEDD; border:1px solid #B6A081; } / ヘッダー / #header{ width:100%; height:77px; /background: url(../img/header.gif) no-repeat #ffc1e1;/ background:url(<EBHfBgurl>) <EBHfBgurlp> no-repeat #ffc1e1; } td>#header { / IE7 Safari Firefox 用 / width:100%; height:auto; min-height:77px; } #header:after { clear: both; content: "."; display: block; height: 0; line-height: 0; visibility: hidden; } #header { display: inline-block; } /\/ html #header { height: 1%; } #header { display: block; } .shoplogo{ /* サイトロゴブロック（設定の場合） / padding:0px; margin:0px; } .siteName { / サイト名 h1 （テキスト） / margin:0px; padding:10px 10px 5px 10px; font-size:180%; line-height:1em; } .siteName a { color:#FFFFFF;text-decoration:none;} .siteName a:hover { color:#FFFFFF;text-decoration:underline;} .sitecopy{ / サイトコピー h2 （ロゴがテキストの場合使用）/ padding:2px 10px 2px 10px; margin:0px; color:#999999; font-weight:normal; line-height:1em; } .sitecopy a {color:#FFFFFF;text-decoration:none;} .sitecopy a:hover {color:#FFFFFF;text-decoration:underline;} / ヘッダーメニュー / #headMenu { width:100%; height:25px; background:#F781BF ; margin:0px; clear:both; } .headnavi { / ヘッダーメニューテキスト / padding:3px 20px 0px 20px; color:#F0027F; font-weight:bold; text-align:right; } .headnavi a{color:#F0027F;text-decoration:none;} .headnavi a:hover {color:#F0027F;text-decoration:underline;} .navi01 {/ ヘッダーメニューアイコン / background-position:left center; background-repeat:no-repeat; height:20px; / background:url(../img/navi01.gif) ;/ } / ヘッダー下装飾ライン / .hline { border-top:2px solid #F0027F; /background:url(../img/hline.gif) no-repeat #B6A081;/ } /******************************************************************/ #leftSide {min-width:170px; / 左サイドtd / padding:0px; margin:0px; vertical-align:top; } #rightSide {min-width:170px; / 右サイドtd （3列）/ padding:0px; margin:0px; vertical-align:top; } #rightSide2 {min-width:170px; / 右サイドtd （3列ブログ）/ padding:0px; margin:0px; vertical-align:top; } #center1 { / センター td （2列）/ width:690px; padding:0px; margin:0px; vertical-align:top; /background:url(../img/center1.gif) ;/ } #center2 {min-width:520px; / センターtd （3列）/ width:auto; padding:0px; margin:0px; vertical-align:top; /background:url(../img/center2.gif) ;/ } #center3 { / センターtd （装飾用）/ vertical-align:top; width:100%; background:url(../img/center1.gif) ; } / 表組みセンタリング / #center3 table{ margin:0 auto; } #center3 table table.bordlayoutp3{ margin:0; } .header_area { / ヘッダのフリーエリア / text-align:left; margin:0 auto; padding:0px; } .footer_area { / フッタのフリーエリア / text-align:left; margin:0 auto; padding:0px; } .sidebox { / サイド用ブロック（幅設定） / padding:1px 1px 5px 1px; margin:0px; / background:url(../img/sidebox.gif) ;/ } .centerbox { / センター用ブロック（幅設定） / margin:0px; padding:10px; / background:url(../img/centerbox.gif) ;/ } / .centerbox div.mainCont{ text-align:left; } .centerbox div.mainCont p{ text-align:left; } .centerbox .mainFrame div.mainCont{ text-align:left; } / .center{ text-align:center;} / センター / .right{ text-align:right;} / 右 / .left{ text-align:left;} / 左 / .middle{ vertical-align:middle;}/ テキスト縦中央 / .buttom{ vertical-align:bottom;}/ テキスト縦下 / .float_right{ float:right;} .float_left{ float:left;} /******************************************************************/ / 基本商品テキスト設定 / .price{ / 商品価格 / color:#003333; text-align:left; } .price.zoom{ / 商品価格（商品詳細） / font-size:125%;font-weight:bold; } .expl{ / 商品説明文 / text-align:left; color:#333333; } .expl a{color:#333333; text-decoration:none;} .expl a:hover{color:#333333;text-decoration:underline;} .fixed{ / 商品定価 / color:#333333; text-align:left; } h2.goods / 商品名（商品一覧）/ a{color:#000000;font-weight:bold;text-decoration:underline;} h2.goods a:hover{color:#666666;text-decoration:underline;} /******************************************************************/ /センターコンテンツ / .topIMG { / トップイメージ外枠設定 / margin:0px ; padding:0px; } .topIMG td{ margin:0px; padding:0px; background:#FCCDE5; } .shopCopy { / サイト説明 / margin:0px; padding:3px 10px 3px 10px; color:#666666; font-weight:bold; text-align:left; } / タイトルデザイン / .free_title { / タイトル1 h3 / padding:8px 0px 8px 40px; margin:0px; color:#F0027F; width:auto; background:#FCCDE5; border-top:#F781BF solid 2px; border-bottom:#F781BF solid 2px; line-height:100%; vertical-align:middle; } .title1{ / タイトル1 h3 / padding:8px 0px 8px 40px; margin:0px; color:#F0027F; width:auto; background:#FCCDE5; border-top:#F781BF solid 2px; border-bottom:#F781BF solid 2px; line-height:100%; vertical-align:middle; } .title1 a{color:#F0027F;text-decoration:none;} .title1 a:hover{color:#F7818F;text-decoration:underline;} .title2{ / タイトル2 h3 / padding:8px 0px 8px 40px; margin:0px; width:auto; color:#F0027F; background:#FCCDE5; border-top:#F781BF solid 2px; border-bottom:#F781BF solid 2px; line-height:100%; vertical-align:middle; } .title2 a{color:#F0027F;text-decoration:none;} .title2 a:hover{color:#F7818F;text-decoration:underline;} .title3{ / タイトル3 h3 / padding:8px 0px 8px 40px; margin:0px; width:auto; color:#F0027F; background:#FCCDE5; border-top:#F781BF solid 2px; border-bottom:#F781BF solid 2px; line-height:100%; vertical-align:middle; } .rank{/ ランキングアイコン / text-align:left; } .mainCont { / メインコンテンツ / padding:10px; margin:0px; width:auto; background:#EEEEEE; / background:url(../img/maincont.gif) ;/ } .contbox { / メインコンテンツ内項目ボックス/ padding:10px 0px; margin:0px; width:auto; } / .mainCont p{ text-align:left; } .centerbox div.mainCont{ text-align:left; } .mainCont table{ width:100%; margin:0; text-align:left; } / ul.news{ / 最新情報リスト設定 / text-align:left; padding:0px 0px 0px 12px; margin:0px; list-style:square; color:#000000; } li.p3{padding:3px;} ul.free_list{ / リスト設定 / text-align:left; padding:5px 10px; margin:0px; list-style:square; color:#000000; } ul.list{ / リスト設定 / text-align:left; padding:5px 10px; margin:0px; list-style:square; color:#000000; } ul.map{ / サイトマップリスト設定 / text-align:left; padding:0px 20px; margin:0px; color:#000000; } li.sm1 { margin:4px ;display:block;list-style-type:none;} li.sm2 { margin:0px 0px 0px -35px;display:block;list-style-type:none;} .sitemap{ / サイトマップリスト項目タイトルh4/ padding:5px 25px; color:#F0027F; background:url(../img/icon_sitemap.gif) no-repeat ; background-position:left center; } / テーブル余白設定（固定） / .layoutp5 { padding:5px 0px;}/ 余白5px / .layoutp5 th { padding:5px;} .layoutp5 td { padding:5px;} .layoutp5 .border { border:1px solid #CCCCCC;} .layoutp3 table{text-align:left;width:100%;} .layoutp3 { padding:5px 0px;}/ 余白3px / .layoutp3 th { padding:3px;} .layoutp3 td { padding:3px;} .layoutp3 .border { border:1px solid #999999;} .bordlayoutp3 { padding:5px 0px;}/ ボーダーテーブル(余白3px) / .bordlayoutp3 th { padding:3px;border:1px solid #999999;} .bordlayoutp3 td { padding:3px;border:1px solid #999999;} .bordlayoutp3 .side { padding:10px 15px;}/ 横余白10px / .backcolor1 { background:#AADBF0;} / テーブル内カラー切り替え（タイトル部分） / .backcolor2 { background:#FFFFFF;vertical-align:middle} / コンテンツ内 / .backcolor3 { background:#E0E0C2;padding:10px 0px;} / カート部分 / / 商品レイアウト（トップページセンター、商品一覧用）/ .layoutFrame{/ 大枠 table / margin:10px 0px 0px 0px; padding:2px; width:99%; / background:url(../img/layoutframe.gif) ;/ } .layoutFrame td{ text-align:center; margin:0px; padding:1px; vertical-align:top; } .layout1{ / レイアウト / margin:1px; padding:3px; / background:url(../img/layout1.gif) ;/ } .layout1 td{ margin:0px; padding:3px; text-align:center; } / 第二階層 / #bread{ / パンクズ / margin:0px; padding:3px 10px; color:#333399; text-align:left; background:#FCCDE5; } #bread a { color:#333333;} h4.title{ margin:5px 0px; padding:2px 0px; color:#FFCC00; border-bottom:1px solid; } .mainFrame{ / メイン大枠 / margin:0px; padding:0px; / background:url(../img/mainframe.gif) ;/ } p.title { margin:3px 0px; padding:2px 0px; color:#669933; border-bottom:1px dotted; font-weight:bold; } / メールマガジンアイコン設定 / .mailmag_ent{ / 新規登録 h4 / padding:12px 0px 0px 60px; background:url(../img/icon_mailmag_ent.gif) no-repeat; } .mailmag_cha{ / アドレス変更 h4 / padding:12px 0px 0px 60px; background:url(../img/icon_mailmag_cha.gif) no-repeat; } .mailmag_can{ / 配信解除 h4 / padding:12px 0px 0px 60px; background:url(../img/icon_mailmag_can.gif) no-repeat; } #sortList{ / ソート / margin:0px; padding:10px 3px 5px 3px; width:auto; color:#333333; float:right; } .pageTop { / ページトップ / padding:3px 5px 0px 17px; margin:10px 5px; background:url(../img/icon_top.gif) no-repeat; font-size:76%; font-weight:bold; float:right; } .pageTop a{ color:#FFFF00;text-decoration:none;} .pageTop a:hover{ color:#FFEE33;text-decoration:none;} /******************************************************************/ / フッターーメニューレイアウト設定 / #footer { padding:0px; margin:0px; width:auto; height:40px; background-color:#F882BF; text-align:center; <EBIfNonEmpty tag="EBHffBgurl">background:url(<EBHffBgurl>) <EBHffBgurlp> no-repeat #F882BF;</EBIfNonEmpty> } td>#footer { / IE7 Safari Firefox 用 / height:auto; min-height:40px; } .footnavi { /フッターメニューテキスト設定/ padding:5px 20px 5px 20px; color:#333333; } .footnavi a{ color:#333333;text-decoration:none;} .footnavi a:hover { color:#FFffff;text-decoration:underline;} #copyright { / コピーライト / padding:0px; margin:0px; width:auto; height:20px; color:#dddddd; background:#980050; text-align:center; / background:url(../img/copyright.gif) ;/ } #footer>#copyright { / IE7 Safari Firefox 用 / height:auto; min-height:20px; } /******************************************************************/ / サイド設定 / #search {/ サイド商品検索枠設定 / padding:6px 5px 12px 5px; margin:0px; width:auto; border-bottom:#ffffff 2px solid; } #search label{ padding:0px; margin:0px; color:#FFFFFF; font-weight:bold; } #search form{ width:159px; } .fieldarea{padding:5px 0px 5px 0px;vertical-align:middle;} / サイドメニューカテゴリリスト / .list { / メニュー枠設定 / padding:0px 0px; display:block; line-height:130%; / background:url(../img/list.gif) ;/ } .list h3 { / タイトル / padding:5px 5px; margin:0px; } ul.free_listbox{ text-align:left; padding:0px; margin:0px; list-style:none; } ul.listbox{ text-align:left; padding:0px; margin:0px; list-style:none; } li.ca1 { margin:0px; border-bottom:1px solid #F0027F; } li.ca2 { margin:0px; border-bottom:1px solid #F0027F; } li.ca1 a{ padding:8px 3px 8px 15px;display:block; color:#FFFFFF;font-weight:bold;text-decoration:none; background:url(../img/icon_eye01.gif) no-repeat ; } li.ca1 a:hover{ color:#EEEEEE;font-weight:bold;text-decoration:none; background:url(../img/icon_eye01_ov.gif) no-repeat; } li.ca2 a{ padding:5px 3px 5px 20px;display:block; color:#FFFFFF;font-weight:bold;text-decoration:none; background:url(../img/icon_eye02.gif) no-repeat; } li.ca2 a:hover{ color:#EEEEEE;font-weight:bold;text-decoration:none; background:url(../img/icon_eye02_ov.gif) no-repeat ; } li.ca3 { margin:0px; border-bottom:1px solid #F0027F; } li.ca3 a{ padding:8px 3px 8px 15px;display:block; color:#FFFFFF;font-weight:bold;text-decoration:none; background:url(../img/icon_eye01.gif) no-repeat ; } li.ca3 a:hover{ color:#EEEEEE;font-weight:bold;text-decoration:none; background:url(../img/icon_eye01_ov.gif) no-repeat; } li.ca4 { margin:0px; border-bottom:1px solid #F0027F; } li.ca4 a{ padding:5px 3px 5px 20px;display:block; color:#FFFFFF;font-weight:bold;text-decoration:none; background:url(../img/icon_eye02.gif) no-repeat; } li.ca4 a:hover{ color:#EEEEEE;font-weight:bold;text-decoration:none; background:url(../img/icon_eye02_ov.gif) no-repeat ; } .sline1 { / サイドバー下ライン / padding:0px; margin:0px; height:5px; border-top:#FFFFFF 3px solid; } .sline2 { / サイドバー下ライン / padding:0px; margin:0px; height:5px; border-top:#FFFFFF 3px solid; / background:url(../img/sline2.gif) ;/ } / サイドコンテンツ / .sidemain1 { / メイン枠 / margin:0px; padding:5px; /background: #FFFFEE;/ background:url(../img/sidemain.gif) ; } .sidemain1 p { padding:3px 0px 3px 0px; margin:0px; line-height:120%; } .sidemain1 ul { / リスト設定 / margin:0px; padding:3px 0px 3px 0px; list-style:none; } .sidemain1 li { display:block; padding:2px 0px 2px 14px; color:#334d55; background:url(../img/icon_eye03.gif) no-repeat } / カレンダー / caption { / 年月タイトル / font-weight:bold; text-align:center; padding:3px; color:#333333; } caption a{ color:#333333;text-decoration:underline;} caption a:hover{ color:#333333; text-decoration:underline;} .carender { / カレンダーテーブル/ width:140px; border-collapse:collapse; padding:5px 0px; margin:0px auto; text-align:center; } / カレンダー横幅指定とセンタリング / div#calendar_div table{ margin:0 auto; text-align:center; width:140px; } .carender td { padding:2px; border-collapse:collapse; text-align:right; border:1px solid #CCCCCC; } .carender th { padding:2px; border-collapse:collapse; border:1px solid #CCCCCC; } th.day { / ヘッダ平日 / font-weight:bold; color:#333333; background:#EEEEEE; text-align:center; } th.sun { / ヘッダ日曜 / color:red; background:#FDDFFC; text-align:center; } th.sat { / ヘッダ土曜 / color:blue; background:#D0E8FF; text-align:center; } .chert { / 表示色説明枠 / margin:5px 5px; font-size:84%; } .chert td { border-collapse:separate; padding:0px 0px 0px 5px; border:2px solid #FFFFDD; } .line01{ border:#DEDBBE 1px dotted;vertical-align:bottom;} #rss{ / RSS設定 / margin:0px; padding:5px; } #count{ / カウンター / margin:0px; padding:5px; } /******************************************************************/ / ブログ / .blogbox { / コメントボックス/ padding:5px; margin:2px 0px; width:auto; / background:url(../img/blogbox.gif) ;/ } .entry_title { / ブログエントリータイトル h2 / padding:5px 0px 10px 0px; display:block; font-size:116%; color:#4573B3; / background:url(../img/entry_title.gif) ;/ } .entry_date{ display:block; padding:10px 0px 3px 0px; color:#F69B1A; text-align:right; } .state{ / ブログステータス / padding:2px 0px; text-align:right; border-top:#ded9c5 1px dashed; } .subtitle {/ h3 ブロックサブタイトル / padding:2px 0px; margin:10px 0px 10px 0px; text-align:left; font-size:110%; color:#4573B3; border-bottom:#4573B3 2px solid; / background:url(../img/subtitle.gif) ;/ } p.label { / ブログコメントタイトル / font-weight:bold; } .tb_url{ / トラックバックurl / font-weight:bold;margin-bottom:10px; } /******************************************************************/ / カート / .point {font-size:120%;color:red;font-weight:900;} .pointline {font-size:100%;color:red;font-weight:900;padding:3px;background-color:#D6C692;} / ナビゲーション（固定）/ .step_navi01,.step_navi02,.step_navi03,.step_navi04 { text-align:center; width:100%; height:83px; } .step_navi01 { background-image:url(../img/navi01.gif); background-repeat:no-repeat } .step_navi02 { background-image:url(../img/navi02.gif); } .step_navi03 { background-image:url(../img/navi03.gif); } .step_navi04 { background-image:url(../img/navi04.gif); } / ご利用案内 */ table.layout_left_shoppinguide{ width:100%; }

[▲] このページのトップへ戻る
Ver.1.3.0