おちゃのこ広場

おちゃのこユーザー様同士の情報交換BBS！
活発な意見交換の場としてご利用下さい。

おちゃのこ広場(会員版)おちゃのこネットアカウントIDと
パスワードが必要です。
開く
ご利用に際して
おちゃのこ広場では、以下のような書き込みを禁止します。
また、おちゃのこネットが不適当であると判断した場合、予告なく書き込みを削除する場合があります。
  • 誹謗中傷、他人を不愉快にさせるような書き込み。
  • 個人情報（住所、電話番号など）の書き込み。
  • 宣伝目的の書き込み。
おちゃのこネットは、おちゃのこ広場の使用に関連して発生したいかなる損害に対しても、一切の責任を負いません。
新規投稿
記事を閉じて表示
記事を閉じる お客様からの問い合わせについて 投稿者:あじるび No.16652 URL

いつも大変お世話になっております。

本日リピーターのお客様よりお問い合わせが来ました。

「買い物手続きをしていますが、住所記入等のページから次のページへ行けません。
何度かトライしてみましたが、ホームへ戻ってしまいます。」
との事。
私も実際やってみました。

始めにログインした状態で買い物をするとスムーズに進むのですが、
ログインしてない状態で
STEP１のお客様情報のところで、
「お客様情報を登録済みの方」でメールアドレスとパスワードを入力しようとすると強制的にトップページへ戻ってしまいます。

どこか問題があるのでしょうか？

ちなみに数週間まえにHTML5バージョンに変更したばかりです。
何か設定がおかしいのでしょうか？

どうぞよろしくお願い致します。

以上


Re ご質問について 投稿者:おちゃのこ刑部 No.16654 URL

あじるびさん、こんにちは。

ご質問についてです。
配置/画像/コメントのショップ名画像欄で自由記入欄にて画像を挿入いただいておりますが、</a>が抜けています。

そのため、下部のコンテンツにリンクが適用されています。
追加をお願いします。

<a href="http://asianruby.ocnk.net/"><img src="http://asianruby.ocnk.net/data/asianruby/image/shoprlogo1.jpg" width="620" height="80" />

↓変更後

<a href="http://asianruby.ocnk.net/"><img src="http://asianruby.ocnk.net/data/asianruby/image/shoprlogo1.jpg" width="620" height="80" />
</a>

よろしくお願い致します。

Re おちゃのこ　刑部様 投稿者:あじるび No.16658 URL

ご回答いただきありがとうございます。

修正後、直りました！

まだまだHTML5バージョンに慣れず
どこが悪いのか見つけられず・・・


ありがとうございました！
今後ともどうぞよろしくお願い致します。

記事を閉じる バナー画像と価格の表示について 投稿者:かまくらOBS No.16635 URL

いつも大変お世話になっております。

また何点か教えて頂きたいことがあります。
お忙しい中、大変恐縮ですが、何卒お願い致します。

１）バナー画像を設定しようとサイズを合わせたダミーを設定しましたが
トップページを含め、どこにも表示がされていません。
設定のミスなのか、用意した画像サイズなどに誤りがあるのか
教えて頂ければ幸いです。

２）販売価格の色を現在の黒から別の目立つ色に変更したいのですが
スタイルシートのどこを変更したらいいですか？
出来れば、フォント・サイズも合わせて変更出来れば尚有難いのですが？

３）会員登録されたお客様とそうでないお客様で、同一の商品の価格が異なる場合、会員価格の表示を強調したいのですが、どこで設定したらいいですか？

４）トップ画像のサイズの幅を980PXよりも少なくした場合と、高さを300PXよりも大きくしたい場合は、先日教えていただきました内容のどこを変更したらいいですか？

宜しくお願い致します。

Re ご質問について 投稿者:おちゃのこ刑部 No.16639 URL

かまくらOBSさん、こんにちは。

1.バナーについて
どちらに設定されたのでしょうか。
ヘッダーエリアでしたら、現状オレンジの画像が表示されております。

2.価格について
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。
※この指定は、HTML5テンプレートでのみ有効です。

color: #FF0000;が文字色になりますので、ご希望の色に変更してください。

.selling_price .figure,
A .selling_price .figure {
color: #FF0000;
}

3.会員価格について
会員価格を利用される場合、会員制限機能をご利用いただく必要があります。
会員制限機能を利用すると、ログイン時に該当会員グループの会員のみ価格を割引等が可能になります。
会員制限機能については、下記のFAQをご覧ください。
http://www.ocnk.net/faq/index.php?action=show&cat=281599

4.トップ画像について
下記の箇所を変更してください。

例）横幅900px、縦幅500pxの場合

#photo,
.wide_slide .fix_center,
.wide_slide .swipe_list {
width: 980px;
position: relative;
}

↓変更後(900pxに変更し、min-width:900pxを追加)

#photo,
.wide_slide .fix_center,
.wide_slide .swipe_list {
width: 900px;
position: relative;
min-width: 900px;
}


.wide_slide .list_item_cell {
height: 300px;
}

↓変更後(300pxを500pxに変更)

.wide_slide .list_item_cell {
height: 500px;
}


.wide_slide,
.wide_slide .swipe_list {
height: 300px;
}

↓変更後(300pxを500pxに変更)

.wide_slide,
.wide_slide .swipe_list {
height: 500px;
}


.wide_slide .swipe_list {
margin-left: -490px;
}

↓変更後(-490pxを-450pxに変更　※これはwidth: 900pxの半分を指定)

.wide_slide .swipe_list {
margin-left: -450px;
}

よろしくお願い致します。

Re バナー画像と価格の表示について 投稿者:かまくらOBS No.16643 URL

おちゃのこ刑部様、いつも有り難う御座います。

1点だけ、改めて教えて下さい。

３）会員制限機能を利用した際、販売価格と通常販売価格が表示されますが、
それぞれの価格をフォント・色等を変更したいのです。
出来れば、販売価格は会員価格、通常販売価格は通常価格といった風に
特別感が出るような名称に変更も出来たら尚良いのですが…。

１）バナー画像の件は、当方のブラウザがIE８の為、確認ができていないだけでした。お手数をおかけいたしました。

２）４）有り難う御座います。教えて頂いた内容を確認させていただきます。

ご多忙中大変恐縮ですが、何卒宜しくお願い致します。

Re 価格について 投稿者:おちゃのこ刑部 No.16647 URL

かまくらOBSさん、こんにちは。

価格についてです。
どちらもデザイン管理→タイトル周り設定から変更可能ですが、販売価格を会員価格とした場合、通常の価格が会員価格として表示されるため、ログインしない状態でも常に会員価格となってしまいます。

色については、下記のが通常販売価格用の指定となります。
スタイルシートの編集から下記の指定をコピーして貼り付けて下さい。
※貼り付け位置は、最下部にお願い致します。
※この指定は、HTML5テンプレートでのみ有効です。

/* 金額のみを変更する */
.regular_price .figure,
A .regular_price .figure {
color: #666666;
}

/* 通常販売価格というラベルも変更する */
.regular_price .regular_price,
.regular_price .figure,
A .regular_price .figure {
color: #666666;
}

よろしくお願い致します。

Re 価格について 投稿者:かまくらOBS No.16650 URL

おちゃのこ刑部様、有り難う御座います。

価格の表記につきましては、そういった仕様だと割りきって考えることにしました。
出来れば、ログイン（会員登録）されたお客様にはこの値段です！のようになれば
販促にも役立ちそうなので、今後の改良点として一考頂ければ幸いです。

通常販売価格と販売価格は、同時に別々の色やフォントの指定が可能でしょうか？
これが出来れば、販売価格を強調して見た目で差異を付けられそうなので
変更が可能であれば、方法を教えて下さい。

何度も申し訳ございません、宜しくお願い致します。

Re 販売価格について 投稿者:おちゃのこ刑部 No.16651 URL

かまくらOBSさん、こんにちは。

販売価格についてです。
先ほどのご回答に記載させていただきましたが、下記が通常販売価格用の指定となります。

スタイルシートの編集から下記の指定をコピーして貼り付けて下さい。
※貼り付け位置は、最下部にお願い致します。
※この指定は、HTML5テンプレートでのみ有効です。

/* 金額のみを変更する */
.regular_price .figure,
A .regular_price .figure {
color: #666666;
}

/* 通常販売価格というラベルも変更する */
.regular_price .regular_price,
.regular_price .figure,
A .regular_price .figure {
color: #666666;
}


なお、販売価格は下記となります。

.selling_price .figure,
A .selling_price .figure {
color: #FF0000;
}

よろしくお願い致します。

記事を閉じる 画像について 投稿者:CH No.16617 URL

いつもお世話になっております。
質問させてください。

・トップページのヘッダーの下に空白ができてしまうのですが
どうすればよいでしょうか？
また幅が下部分とそろわず　ずれてしまいます。

・ヘッダーの画像を含め　アップした画像が全て
ぼんやりとした感じになってしまいます。
用意した画像ははっきりしているのですが　
アップした後がぼんやりとしてしまっております(>_<)

どうぞよろしくお願いいたします。

Re もう一つスミマセン！ 投稿者:CH No.16618 URL

もう一つ追加で質問させてください。

商品一覧ページに入った時のヘッダーを消したいと思ってます。

どうぞよろしくお願いします！

Re 画像について 投稿者:おちゃのこ刑部 No.16620 URL

CHさん、こんにちは。

画像についてです。
ご登録いただいているお手元の元画像の容量が200KBを超えている可能性があります。
その場合、ご登録いただいた際に、自動的に画像縮小されます。
下記のFAQをご覧ください。
http://www.ocnk.net/faq/index.php?action=artikel&cat=281572&id=765&artlang=ja

ご登録いただく画像を画像編集ソフト等で200KB以内にしてください。

余白についてと商品一覧ページ以降でトップ画像を非表示にする方法は、スタイルシートの編集から下記の指定をコピーして貼り付けて下さい。

画像については、.top_page_body #container部分で背景画像として指定する必要があります。
画像を200KB以内で作成いただき、画像専用管理画面→コンテンツフォルダに画像をアップロードしてください。
アップロード後、ファイル名部分にアップロードいただいた画像のファイル名を記載してください。


#container {
background-image: none;
}

.top_page_body #container {
background-image: url(image/ファイル名);
}

#header {
height: 0px;
}

.top_page_body #header {
height: 500px;
}

よろしくお願い致します。

Re できません・・・ 投稿者:CH No.16626 URL

スタイルシートの編集から下記の指定をコピーして貼り付けて下さい。
↑
やってみたつもりなのですが、何も変わりません・・・
何か間違えているのでしょうか？

書いていただいている意味を理解できていなかもしれません(T_T)

どうぞよろしくお願いいたします。

Re ご質問について 投稿者:おちゃのこ刑部 No.16627 URL

CHさん、こんにちは。

ご質問についてです。

・商品一覧ページに入った際の画像
こちらは、現状消えております。

・ヘッダー下の余白
トップ画像部分下の余白でよろしかったでしょうか。

・トップ画像幅について
http://www.tomoni-class.com/data/tomoni-class/image/top.jpg
現状設定されている画像の横幅が800pxですので、860pxで作成ください。

・画質について
http://www.tomoni-class.com/data/tomoni-class/image/top.jpg
こちらが現状の元画像となりますが、現状も粗いでしょうか。

先日のご回答の補足ですが、現状トップ画像がリピート表示されておりますので、リピートしない場合は、下記のようにbackground-repeatの指定を追加ください。


.top_page_body #container {
background-image: url(image/top.jpg);
background-repeat: no-repeat;
}

よろしくお願い致します。

Re 無題 投稿者:CH No.16636 URL

おちゃのこ刑部様

いつもお世話になっております。
画質についてはサイズが200KBよりずいぶんと小さかったようです。
もう少し大きくしてから試してみようと思っております。
ありがとうございます。


先日質問させていただいた時　スタイルシートを編集した直後
ショップを確認すると何も変わっておらず質問させていただいたのですが
翌日には反映されておりました。

先ほども　トップの画像がリピートされている分の修正と
トップの画像を新しいものに変更する作業をしたのですが
反映されておりません。

何か考えられる原因はありますでしょうか？
どうぞよろしくお願いいたします。

Re ご質問について 投稿者:おちゃおこ刑部 No.16640 URL

CHさん、こんにちは。

ご質問についてです。
トップ画像のリピートについては、現状反映されております。
画像の変更については、画像とコメントの設定から変更されたのではないでしょうか。

現状表示されている画像は、スタイルシート内の下記の箇所で指定されている画像となります。

.top_page_body #container {
background-image: url(image/top.jpg);
background-repeat: no-repeat;
}

よろしくお願い致します。

Re ありがとうございます！ 投稿者:CH No.16648 URL

おちゃのこ刑部様

いつもお世話になりましてありがとうございます！

おっしゃる通り画像とコメントの設定から変更しておりました。
すみません汗
解決しました。

あと一つだけお願いします！
トップページのヘッダーの上に　ショップ名が出てますが
これを消す方法を教えていただけますか？
消したとして、何か検索ロボットに引っかかりにくいなど
マイナスなことはありますか？

どうぞよろしくお願いいたします。

Re ショップ名について 投稿者:おちゃのこ刑部 No.16649 URL

CHさん、こんにちは。

ショップ名についてです。
検索エンジンの仕様については、こちらでは明確なご回答はできかねます。
非表示にする方法ではなく、左上に文字サイズを小さくして表示する方法もございます。

ご検討ください。

.top_page_body {
margin-top: 40px;
}

.top_page_body #popup {
margin-top: -40px;
}

.top_page_body .shoptext {
top: -5px;
z-index: 99;
}

.top_page_body .subnavi {
height: 30px;
}

.top_page_body .shoptext .text-18 {
font-size: 12px;
}

よろしくお願い致します。

記事を閉じる 新テンプレートのヘッダーについて 投稿者:kobayashi No.16630 URL

初歩的な質問ですいません。

新テンプレートで作業をしているのですが、
１、ヘッダーのキャッチフレーズ欄”Shipping Free　15000円以上で送料無料”と載せているバナーの上の空白をなくす
２、同じくヘッダーのショップ画像やログインやカテゴリーなどを囲っている部分の高さを低くして空白を減らす

にはスタイルシートにどういった編集をしたらよいでしょか？

お手数をお掛け致しますがよろしくお願いします。

Re ヘッダーについて 投稿者:おちゃのこ刑部 No.16631 URL

kobayashiさん、こんにちは。

●ヘッダーについて
-----------------------------------------------------------
現状、移行モードをご利用のためXHTMLテンプレート利用時に表示されているメタタグ個別設定のトップページキャッチフレーズ欄に設定されている内容がHTML5テンプレートの際にも出力されています。

※移行モードの場合
XHTMLテンプレート利用時の「画像とコメントの設定」内のキャッチフレーズ欄は、HTML5テンプレート利用時は、配置/画像/コメント設定内のキャッチフレーズ欄で上書きされます。
ただし、メタタグ個別設定のキャッチフレーズ欄は、HTML5テンプレート利用時でも出力されます。

現状、HTML5テンプレート利用時には、display: none;で非表示にされていますが、htmlタグは出力されています。
そのため、<div>の数が合わず表示崩れとなっています。

この点については、移行モードご利用の際に、XHTML利用時とHTML5利用時でメタタグ個別設定→キャッチフレーズ欄の内容を分けて確認できるようにする改良を行っておりますが、もう少し時間がかかります。

移行のタイミングまでにリリースできない場合は、移行後に下記の作業をしていただくことで解消されます。
-----------------------------------------------------------
HTML関連
-----------------------------------------------------------
・メタタグ個別設定→トップページのキャッチフレーズ欄内のhtmlタグを削除してください。

・配置/画像/コメント設定画面のキャッチフレーズ欄に入っている余分な<div class="header_banner_2">を削除してください。


-----------------------------------------------------------
スタイルシート関連
-----------------------------------------------------------
上記変更後、スタイルシートの編集から下記の指定をコピーして貼り付けて下さい。
※貼り付け位置は、最下部にお願い致します。
※既存の指定を変更いただいても結構です。

.header_banner_2 {
top: 0px;
position: relative;
}


●ショップ名画像、ログイン部分について
-----------------------------------------------------------
ショップ名画像自由記入欄の画像を<p>タグで囲んでいただいているため、<p>タグの余白が適用されています。
この部分に<p>タグは必要ないと思いますので、削除ください。
その上で、「改行は<br />タグに置換する 」のチェックを外してください。

<p><a href="http://www.bzar.jp/ "><img src="http://www.bzar.jp/data/bzar/product/20140613_2a775e.jpg " alt="" /></a></p>

↓変更後

<a href="http://www.bzar.jp/ "><img src="http://www.bzar.jp/data/bzar/product/20140613_2a775e.jpg " alt="" /></a>

上記を変更すると余白が詰まりますが、バナー画像欄のソーシャル系ボタンの位置がずれますので、top値を変更して調整してください。

よろしくお願い致します。

Re 無題 投稿者:kobayashi No.16633 URL

ありがとうございました！
解決いたしました！

また、もうひとつ改善できるかどうかの質問なのですが、サイト全体が左右に余白がけっこうあり、
他サイトや例えばこちらのサイトのように（http://www.nastygal.com/clothes）
できるだけ画面いっぱいにサイト全体を表示させることは可能でしょうか？

よろしくお願いします。

Re 横幅について 投稿者:おちゃのこ刑部 No.16638 URL

kobayashiさん、こんにちは。

横幅についてです。
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。
※この指定は、HTML5テンプレートでのみ有効です。

width: 80%;部分が横幅となります。

.fix_center {
width: 80%;
min-width: 980px;
margin: auto;
}

#maincol1 {
width: auto;
}

#maincol2 {
width: auto;
float: none;
margin-left: 200px;
}

.freearea_box .main_contents,
#maincol2 .whatnew .clearfix {
width: 100%;
overflow: hidden;
}

よろしくお願い致します。

Re 無題 投稿者:kobayashi No.16645 URL

ありがとうございました。

大きくなり、大変助かりました。

たびたび質問すいません。。

画面が大きくなったことで、右側に大きくスペースが空いてしまったので、商品の写真が今３列で並んでいるのを４列にすることは可能なのでしょうか？

お手数をお掛けしますが、よろしくお願いします。

Re ご質問についてです 投稿者:おちゃのこ刑部 No.16646 URL

kobayashiさん、こんにちは。

ご質問についてです。
この部分は見るディスプレイのサイズによります。
基本的には、floatを利用して横に並べていますので、ご覧いただいているディスプレイでは、4列並べるには少し横幅が狭いため3列表示となっています。
そのため、各商品枠の横幅を狭くして4列並べたとしても他のディスプレイでは、3列であったり、5列であったりします。

固定されたい場合は、80%でご案内した箇所の横幅をpx指定に変更ください。

よろしくお願い致します。

記事を閉じる お問い合わせフォームについて 投稿者:ジュニア No.16629 URL

いつもお世話になっております。
2点ほど質問をさせていただきます。



.SSL保護下にフリーページは作れませんか？
外部メールフォーム（SSLの保護下）をフリーページにiframeで表示させることを検討していますが、フリーページがSSL保護下に無いので、表示が一見するとSSLで保護されていないように見えてしまうので、それを改善するためです。



.商品ページのお問い合わせボタンをフリーページに表示させる方法。
前の質問が難しいかもしれませんので、最終的にコチラの方法で解決しようかと思いますが、フリーページ内に、商品ページや一覧で表示される「お問い合わせボタン」を設置する方法があれば教えて頂けますか。



お手数ですが、よろしくお願い致します。

Re お問い合わせについて 投稿者:おちゃのこ刑部 No.16632 URL

ジュニアさん、こんにちは。

お問い合わせボタンについてです。
SSL保護下のページには、フリーページを作成することはできませんので、ボタン配置の方法をご案内させていただきます。

下記のhtmlタグを利用いただくことで、同様デザインのボタンを設置できます。

リンク先URLのdemoはご自身のアカウントIDに変更してください。

<div class="detail_section add_cart">
<span class="global_btn inquiry_btn">
<a class="inquiryinput btn_size_large btn_color_common secure_link" data-page="contact" href="https://demo.ocnk.net/contact/ ">お問い合わせ</a>
</span>
</div>


下記のFAQにも記載させていただいておりますが、独自ドメインコースをご利用の場合は、必ず、class名：secure_linkとdata-page="contact"を<a>タグ内に指定してください。

http://www.ocnk.net/faq/index.php?action=artikel&cat=281622&id=986&artlang=ja

よろしくお願い致します。

Re ありがとうございます 投稿者:ジュニア No.16637 URL

刑部様。ありがとうございます。
教えて頂いた方法で、無事に設置を行う事が出来ました。

追加で質問をさせて頂きます。


お問い合わせボタンの下に区切り線が表示されていますが、これをページ毎に表示、非表示を選択することが出来ますでしょうか？


お手数をかけしますが、よろしくお願いします。

Re お問い合わせボタンについて 投稿者:おちゃのこ刑部 No.16641 URL

ジュニアさん、こんにちは。

今回のご質問の前に前回のご回答に一部誤りがございました。
申し訳ございません。
下記の<a>タグ内の部分ですが、refとなっておりました。
ref="https://demo.ocnk.net/contact/

正確には、hrefとなります。
href="https://demo.ocnk.net/contact/

<a class="inquiryinput btn_size_large btn_color_common secure_link" data-page="contact" href="https://demo.ocnk.net/contact/ ">

※前回ご回答分の記事については、他の方も閲覧されるため、正しい記載に変更しております。

お問い合わせボタンについてですが、商品詳細ページのお問い合わせボタンということでしたら、可能です。

全ページ共通で指定する場合は、下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。
※この指定は、HTML5テンプレートでのみ有効です。

.detail_item_data .add_cart {
border-bottom: none;
}

各ページ個別に指定する場合は、上記指定にページ固有のid名を追加します。
例）http://www.izumiya-works.net/product/36

このページの場合、id名は、#detail_page_36となります。
数字は、ページURLの数字と連動していますので、ページによってid名を変更してご利用ください。

このページ用の指定は、下記のようになります。

#detail_page_36 .detail_item_data .add_cart {
border-bottom: none;
}

よろしくお願い致します。

Re ありがとうございます 投稿者:ジュニア No.16644 URL

刑部様、

丁寧に回答を頂きまして、ありがとうございます。

さっそくこれをもとに設定を行いたいと思います。

記事を閉じる 本日の改良点のご報告 投稿者:おちゃのこ刑部 No.16642 URL

皆さん、こんにちは。

本日の改良点のご報告です。
------------------------------------
●クロネコwebコレクトAPI方式に対応いたしました。
クロネコwebコレクト リンク方式では、ショッピングカートの完了画面後に決済画面へと遷移しておりましたが、API方式では画面遷移なく、ショッピングカート内で、クレジットカード番号の入力・支払コンビニ先の選択等を
おこなっていただけるようになります。
http://www.yamatofinancial.jp/service/wc_flow.html

クロネコWebコレクトAPI方式のご利用には、リンク方式の契約がある場合でもAPI方式のお申込が必要となります。
詳しくはヤマトフィナンシャルへお問い合わせください。

お申込後、ショップマネージャー内 ショップ運用設定 > お支払い方法設定 > クレジットカード 支払い方法を設定する
クロネコWebコレクト 設定欄の □API方式を利用する のチェックを入れていただけますとご利用可能となります。

よろしくお願い致します。

記事を閉じる トップ画像のサイズについて 投稿者:かまくらOBS No.16616 URL

いつも大変お世話になっております。

現在、１カラムのテンプレートを利用させて頂いており
トップ画像を変更しようと画像を準備して確認したところ
幅960PXの画像が最大の1600PXまで拡大されて表示されていました。
これはもう少し小さく表示されるようには出来ませんか？
What'sNewと同じ幅で5件分表示した程度の高さに収めたいのですが。

宜しくお願い致します。

Re 画像について 投稿者:おちゃのこ刑部 No.16619 URL

かまくらOBSさん、こんにちは。

トップ画像についてです。
現状ご利用のテンプレートのトップ画像を横幅980px、縦幅300pxに変更することができます。

スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。
※下記の指定は、HTML5テンプレートでトップ画像横幅が1600px、縦幅が900pxのテンプレートでご利用可能となります。

画像は、980×300ピクセルで作成し、トップ画像欄からご登録ください。


.has_wide_slide #header {
margin-bottom: 0px;
max-width: 100%;
}

.has_wide_slide #globalnavi {
position: relative;
margin-bottom: 0px;
}

#photo,
.wide_slide .fix_center,
.wide_slide .swipe_list {
width: 980px;
position: relative;
}

#photo,
.wide_slide .fix_center {
margin: auto;
}

.wide_slide .pointer_prev_box {
margin-left: 0px;
}

.wide_slide .pointer_next_box {
margin-right: 0px;
}

.wide_slide .list_item_cell {
height: 300px;
}

.wide_slide,
.wide_slide .swipe_list {
height: 300px;
}

.wide_slide .swipe_list {
margin-left: -490px;
}

.wide_slide .swipe_list .annotation_left_top {
left: 60px;
top: 30px;
}

.wide_slide .swipe_list .annotation_right_top {
right: 60px;
top: 30px;
}

.wide_slide .swipe_list .annotation_left_bottom {
left: 60px;
bottom: 30px;
}

.wide_slide .swipe_list .annotation_right_bottom {
right: 60px;
bottom: 30px;
}

.wide_slide .swipe_list .fade_in_fade_out .list_item_row {
width: auto;
}

.wide_slide .swipe_list .fade_in_fade_out .list_item_cell {
width: 100%;
}

よろしくお願い致します。

Re トップ画像のサイズについて 投稿者:かまくらOBS No.16625 URL

おちゃのこ刑部様、いつも有り難う御座います。

教えて頂いた編集を行った場合も複数の画像をスライド・フェードイン・アウトを利用することは可能でしょうか？

また２カラム・３カラムに変更した場合には、今回の編集内容を書き換えたり
削除する必要がありますか？

宜しくお願い致します。

Re トップ画像について 投稿者:おちゃのこ刑部 No.16628 URL

かまくらOBSさん、こんにちは。

トップ画像についてです。
トップ画像欄の設定でフェードインフェードアウトに設定していただければ、表示可能です。
2カラム、3カラムにしていただいても問題ありません。

よろしくお願い致します。

Re 有難う御座いました。 投稿者:かまくらOBS No.16634 URL

おちゃのこ刑部様、いつも有り難う御座います。

望み通りの表示が出来ました。有難う御座いました。
また何かありましたら、宜しくお願い致します。

記事を閉じる HTML5　テンプレート　ホワイトライン 投稿者:福田 No.16621 URL
添付画像

現在HTML5　テンプレート　ホワイトラインを使用していますが
写真のように『商品カテゴリー一覧』『いらっしゃいませ』その他を少し目立つように変更するにはどのようにすれば良いのでしょうか？
よろしくお願い申し上げます

Re タイトルについて 投稿者:おちゃのこ刑部 No.16622 URL

福田さん、こんにちは。

タイトルの色についてです。
下記のFAQに記載がございますので、ご覧ください。
※それぞれメルマガのバックナンバーへリンクしています。

●サイドエリアタイトル
http://www.ocnk.net/faq/index.php?action=artikel&cat=281622&id=1001&artlang=ja

●メインエリアタイトル
http://www.ocnk.net/faq/index.php?action=artikel&cat=281622&id=988&artlang=ja

なお、カテゴリとグループの左画像については、下記のFAQに記載がございます。
●カテゴリ
http://www.ocnk.net/faq/index.php?action=artikel&cat=281622&id=998&artlang=ja

●グループ
http://www.ocnk.net/faq/index.php?action=artikel&cat=281622&id=999&artlang=ja

よろしくお願い致します。

Re 有難うございます 投稿者:福田 No.16624 URL

有難うございます、すでに紹介されていたとは気づきませんでした
申し訳ありません

記事を閉じる 本日の改良点のご報告 投稿者:おちゃのこ刑部 No.16623 URL

皆さん、こんにちは。

本日の改良点のご報告です。
------------------------------------
●商品詳細ページのポイント説明が変更できるようになりました。
これまでは説明文言は固定でしたが、変更できるようになりました。

【デザイン管理】→【商品詳細ページ設定】の「ポイント説明」より変更できます。

よろしくお願い致します。

記事を閉じる URLショートカットアイコン 投稿者:天然水 No.16607 URL

こんにちは。お世話になっています。

スマートフォンのホーム画面に自分のショッピングカートのショートカットアイコンを作った際に最後に開いたページの画像がそのままの形でアイコンに表示されます。
自分で作った画像をアイコン化したいので色々調べたらアイフォン用で
<head>~</head>の間に<link rel="apple-touch-icon" href="画像パス" />
と出てきたので画像パスを変えて入れたのですがアイコンは変わりませんでした。

もしおちゃのこネットさんでほかのHTMLがありましたら教えて下さい。
わがままですがアイフォンとアンドロイドの両方対応できるHTMLお願いします。

説明が下手ですみません。よろしくお願いします。

Re アイコンについて 投稿者:おちゃのこ刑部 No.16615 URL

天然水さん、こんにちは。

天然水さん、こんにちは。

アイコン(Webクリップ)についてです。
iPhoneではこちらでも動作は確認できておりますが、Androidについては、端末により特に古い端末では表示されない場合があります。
ご了承くださいませ。

よろしければ、下記の手順で作業を行ってください。

-----------------------------------------------------
STEP1　画像を作成する
-----------------------------------------------------
下記のルールで作成してください。

ファイル形式:PNG形式
画像サイズ：152×152ピクセル
ファイル名：apple-touch-icon.png


-----------------------------------------------------
STEP2　htmlタグを記載する
-----------------------------------------------------
ファイルは、画像専用管理画面のコンテンツフォルダにアップロードし、メタタグ設定のヘッダー欄に下記のようなhtmlを記載してください。
demo部分は、ご自身のアカウントIDに変更してください。
※アイコンのURLは、https://共用ドメインURL～の形で記載してください。

<link rel="apple-touch-icon" href="https://demo.ocnk.net/data/demo/image/apple-touch-icon.png " />

よろしくお願い致します。

記事を閉じる URL正規化 投稿者:contriving No.16609 URL

おちゃの子ネット様

お世話になります。


http://contriving.ocnk.net/index.php

上記のページを消したいのですが、（URL正規化というのでしょうか?）
どのようにしたらよいでしょうか?

<link rel="canonical" href="http://contriving.ocnk.net/";>
このタグを張り付けるというとこまでは調べたのですが、
どこに張るのが正しいのか、
このタグで正しいのか

教えていただきたいです。
よろしくお願いします。

Re URL正規化について 投稿者:おちゃのこ刑部 No.16614 URL

contrivingさん、こんにちは。

URL正規化についてです。
http://contriving.ocnk.net/index.php にアクセスされた場合、
システムが自動的に<head>タグ内へ

<link rel="canonical" href="http://contriving.ocnk.net" />

を追加して、重複コンテンツとならないようURL正規化を致しますので、特に対策をしていただく必要はございません。

よろしくお願い致します。

記事を閉じる グループごとの割引。 投稿者:マキウチ No.16611 URL

いつもお世話になっております。
以前商品カテゴリ単位の割引についてはご回答いただきましたが、商品グループ単位での割引は出来ないのでしょうか？
また、商品の金額によって割引を変えたいのですがそれに適した方法はないでしょうか？
例：～３０００円は５０％オフ
３００１円～５０００円は３０％オフ

Re 割引について 投稿者:おちゃのこ刑部 No.16613 URL

マキウチさん、こんにちは。

会員制限についてですが、グループには対応しておりません。
カテゴリのみとなります。
現状のところ改良の予定はございません。
会員制限、全体割引等、割引システムはございますが、複雑になりすぎる可能性もあるため、慎重に検討する必要があります。

また、商品金額についても、商品単位で会員制限の割引額を設定することは可能ですが、購入時の合計金額で変更することはできません。

よろしくお願い致します。

記事を閉じる 無題 投稿者:デイズ No.16608 URL

トップページのTop画像の位置について質問します。

おちゃのこさんがお休みに入ってしまったので、
どなたか、おわかりになる方がいらっしゃれば・・

TOP画像の下が空いてしまいました。
この空間を詰めたいです。スタイルシートでどこを直したらよいでしょうか。
どうぞよろしくお願いします。

Re ご質問について 投稿者:おちゃのこ刑部 No.16612 URL

デイズさん、こんにちは。

ご回答が遅くなり申し訳ございません。
ご質問についてですが、現状ページを拝見する限りトップ画像下に余白はありません。
ご自身で解決いただいたのでしょうか。

よろしくお願い致します。

記事を閉じる ヘッダー＆フッターメニューについて 投稿者:吉村 No.16550 URL

お世話になっております。
いろいろやってみたのですが、どうしてもわからないところがあり、お教えいただければと思います。

ヘッダーメニューについて、サポートクラブを参考に自由記入欄を使って、既存のデザインを使用した場合、デモサイトのように表示中のページの下にラインが入るようにしたいのですが、どのようにしたらいいでしょうか？
（クラス nav_onをどのように指定したらいいでしょうか？）

フッターメニューも同様に、メニューにあるページを表示している時には背景色を変更したいです。

お忙しいところ恐れ入りますが、よろしくお願いします。

Re ヘッダーについて 投稿者:おちゃのこ刑部 No.16554 URL

吉村さん、こんにちは。

ヘッダーメニューについてです。
nav_on表示については、現状対応しておりません。
FAQの方に記載が漏れておりましたので追加させていただきました。
申し訳ございません。
http://www.ocnk.net/faq/index.php?action=artikel&cat=281623&id=989&artlang=ja

今後対応を予定しております。

フッターについては、スタイルシートの編集から下記の箇所を編集してください。
background-color: #FFFFFF;が現在の色となりますので、ご希望の色に変更してください。

/* 選択中 */
#globalnavi_footer li.nav_on .footer_navi_row {
background-color: #FFFFFF;
}

よろしくお願い致します。

Re ヘッダー＆フッターメニューについて 投稿者:吉村 No.16561 URL

刑部さま

こんにちは。
いつもお世話になっております。
ご回答ありがとうございました！

先ほど投稿したのですが、反映されなかったようなので、再度書き込みさせていただきます。
二重になってしまった場合はご容赦ください。

nav_on表示の件、現在は未対応とのこと、了解しました。
今後の対応を待ちたいと思います。
（サイドメニューも、グループの表示に自由記入欄を使用しており、こちらもnav_on表示が有効になれば嬉しいです。）

フッターメニューの件は、ヘッダーと同様にnav_on表示をしたいという質問だったのですが、文章がわかりづらかったようで、お手間をとらせまして、失礼いたしました。

それからもう1点、お教えいただきたいです。
現在、ヘッダーメニューは自由記入欄にしているのですが、そうすると、
メニューの下のグレーの線が、ページの端から端まで表示されません。
ページの端から端まで表示するには、どこを修正すればよいでしょうか？

お手数をおかけし申し訳ありませんが、よろしくお願いします。

Re ヘッダーについて 投稿者:おちゃのこ刑部 No.16562 URL

吉村さん、こんにちは。

ヘッダーについてです。
スタイルシートの編集から下記の指定をコピーして貼り付けて下さい。
※貼り付け位置は、最下部にお願い致します。

#header_nav_free_space {
width: 100%;
}

よろしくお願い致します。

Re ヘッダーについて 投稿者:吉村 No.16563 URL

刑部さま

こんにちは。
いつもお世話になっております。

解決しました。
ありがとうございました！

Re nav_onについて 投稿者:おちゃのこ刑部 No.16601 URL

吉村さん、こんにちは。

ヘッダーメニューについてです。
nav_onの表示に対応致しました。

基本的には、既存のヘッダーメニューをコピーしてご利用いただければ、表示可能となっております。

よろしくお願い致します。

Re nav_onについて 投稿者:吉村 No.16605 URL

刑部さま

こんにちは。
ヘッダーメニューのnav_on表示について、早々にご対応いただき、ありがとうございました！

できましたら、フッターメニューやサイドメニュー（自由記入欄使用）もnav_on表示に対応すると嬉しいです。

お手数をおかけしました。
ありがとうございました！

Re メニューについて 投稿者:おちゃのこ刑部 No.16606 URL

吉村さん、こんにちは。

メニューについてです。
サイド、フッターについては、同様にnav_onに対応しております。
ただし、そのままでも表示することができません。
こちらでご用意したclass名を指定していただく必要があります。

例）下記のようにcustom_navというclassで囲んでいただくことで、現在表示に対応します。

基本的には、custom_nav内のliタグとaタグに対してnav_onが付く仕様となっていますので、class名を追加いただく箇所はdivでもliを囲むulでも問題ありません。

<div class="custom_nav">
<ul class="side_contents navi_list">
<li><a href="http://cafe0101.ocnk.net/help">ご利用案内</a></li>
</ul>
</div>

よろしくお願い致します。

記事を閉じる スマートフォンヘッダーについて 投稿者:kobayashi No.16596 URL

お世話になっております。

以前ほかのサイトの方がご質問していた内容の回答に従って、ヘッダー編集をしたのですが、位置の設定がうまくいかず、教えていただきたいです。

こちらのサイト（www.tontonshop.com/phone/）のように
１、ヘッダーPCサイトの横に画像を張り、
２、カートの横にご利用案内を置きくには

どうしたらよいでしょうか？

ご利用案内の置き方は
↓↓
STEP1　キャッチフレーズ欄にhtmlタグを追加
スマートフォン管理→画像とコメントの設定→キャッチフレーズ欄にhtmlタグを追加してください。

<div class="help_link"><a href="リンク先">ご利用案内</a></div>

STEP2　スタイルシートを編集する
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

現状見た目は、カートボタンと同様に正方形のオレンジ枠線ボタンとしています。

#copy {
position: relative;
min-height: 15px;
}

.help_link {
position: absolute;
top: 80px;
right: 60px;
width: 34px;
height: 34px;
border: 3px solid #FF9326;
text-align: center;
border-radius: 3px;
}

#copy .help_link A {
color: #000000;
font-size: 10px;
}

を参考にさせていただきましたが、位置設定がうまくいきませんでした。

また、
3、"LOGIN"、"新規会員登録"、"お問い合わせ"のメニューバーとスライドショーの間の隙間を0にする方法はありますでしょうか？

4、そして最後質問お願いします、現在使っているスライドショーはおちゃのこ道場から参考にさせていただいておりますが、スライド画像の下の点々の下に余白がけっこうあると思うのですが、この余白を減らすことはできないでしょうか？

沢山質問大変お手数おかけします。
宜しくお願い致します。

Re スマートフォン版について 投稿者:おちゃのこ刑部 No.16597 URL

kobayashiさん、こんにちは。

スマートフォン版についてです。

●1,2のご質問について
下記の.hlep_linkの指定内のtop値を30pxに変更してください。
この数値が上部からの位置となり、大きくすると下に小さくすると上に移動できます。
ただし、重ね順がヘッダー画像の下となりますので、z-index: 2;を追加してください。

.help_link {
position: absolute;
top: 30px;
right: 60px;
width: 34px;
height: 34px;
border: 3px solid #FF9326;
text-align: center;
border-radius: 3px;
z-index: 2;
}


●3のご質問について
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

.top_page_body .contents {
padding: 0px;
}

.navi_free .list_item_table {
border-top: none;
}

.navi_free .item_data {
padding: 0px;
}


●4のご質問について
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。
.navi_free .pointer_box {
margin-bottom: 0px;
}

よろしくお願い致します。

Re ありがとうございます！ 投稿者:kobayashi No.16602 URL

ご返答ありがとうございました。

解決しました！

また、スマートフォンについてなのですが、NEWSの最新３〜５つくらいをPCのトップページにようにスマートフォントップページに載せることは可能でしょうか？

NEWSをアップするたびそのつど自分で作成するような形しか方法はないでしょうか？

お手数をかけいたしますが、よろしくお願いします。

Re スマートフォンについて 投稿者:おちゃのこ刑部 No.16603 URL

kobayashiさん、こんにちは。

スマートフォン版についてです。
トップページには、メニューしか配置できません。

代替案としては、自由記入欄を利用して手動で作成する方法となります。
最新情報ページのデザインを利用する場合は、下記のhtmlタグをご利用ください。

<div class="whatnew_page">
<h2>NEWS</h2>
<table width="100%" class="list_item_table" id="item_list_table" border="0" cellspacing="0" cellpadding="0" summary="What's New">
<tbody>
<tr>
<td class="list_item_photo" valign="top"><a href="http://www.bzar.jp/phone/news "><img width="80" alt="代替テキスト" src="画像URL" border="0"></a></td>
<td class="list_data"><p class="date">日付</p>
<h3 class="list_title"><a href="http://www.bzar.jp/phone/news ">ニュースタイトル</a></h3></td>
</tr>
<tr>
<td class="list_item_photo" valign="top"><a href="http://www.bzar.jp/phone/news "><img width="80" alt="代替テキスト" src="画像URL" border="0"></a></td>
<td class="list_data"><p class="date">日付</p>
<h3 class="list_title"><a href="http://www.bzar.jp/phone/news ">ニュースタイトル</a></h3></td>
</tr>
<tr>
<td class="list_item_photo" valign="top"><a href="http://www.bzar.jp/phone/news "><img width="80" alt="代替テキスト" src="画像URL" border="0"></a></td>
<td class="list_data"><p class="date">日付</p>
<h3 class="list_title"><a href="http://www.bzar.jp/phone/news ">ニュースタイトル</a></h3></td>
</tr>
</tbody>
</table>
</div>

よろしくお願い致します。

Re 無題 投稿者:kobayashi No.16604 URL

ありがとうございました！

解決致しました！

記事を閉じる ヘッダーのお問い合わせについて 投稿者:アティック. No.16598 URL

お世話になります。

ヘッダー箇所のお問い合わせリンクですが、別窓で別のページにリンクさせたいと思います。ご教示いただけますでしょうか。よろしくお願いいたします。

Re お問い合わせについて 投稿者:おちゃのこ刑部 No.16600 URL

アティック.さん、こんにちは。

お問い合わせリンクについてです。
リンク先の変更を行うことはできません。
強制的に非表示にして、その位置にリンクを配置する方法となりますが、閲覧ブラウザによって位置が揃わないため推奨できません。

非表示にされた上で、別途左エリアの自由記入欄等で挿入される方法が良いかと思います。
下記にて、お問い合わせを非表示にすることができます。
※この指定は、XHTMLテンプレートのみに有効です。

.subicon02 {
display: none;
}

なお、HTML5テンプレートをご利用の場合は、ヘッダーメニューを自由記入欄で作成することも可能です。

よろしくお願い致します。

記事を閉じる 支払い方法制限 投稿者:トゥルモンド No.16587 URL

商品によって、クレジットカード支払い不可などの、
支払い方法に制限はかけられませんか？
注意書きだけですと、ある程度しか効果がないため。。

Re 支払い方法制限について 投稿者:おちゃのこ有本 No.16588 URL

トゥルモンドさん、こんにちは。

商品毎の支払い方法の制限についてですが、
検討課題とさせていただきます。

よろしくお願いいたします。

Re 無題 投稿者:トゥルモンド No.16595 URL

有本さん、ありがとうございます。
よろしくお願いいたします。

記事を閉じる 本日の改良点のご報告 投稿者:おちゃのこ刑部 No.16576 URL

皆さん、こんにちは。

本日の改良点のご報告です。
------------------------------------
●HTML5テンプレートのスライド表示部分にフェードイン・フェードアウト表示を追加しました。
これまでは、左右のスライド表示のみでしたが、フェードイン・フェードアウト表示が利用可能になりました。

・トップ画像
・商品詳細メイン画像

詳細は、下記のFAQをご覧ください。

http://www.ocnk.net/faq/index.php?action=artikel&cat=281620&id=977&artlang=ja

http://www.ocnk.net/faq/index.php?action=artikel&cat=281620&id=970&artlang=ja

よろしくお願い致します。

Re スライド表示の速度設定について 投稿者:トントンハウス　井藤 No.16578 URL

刑部さん、こんにちは。

さっそく新機能の「フェードイン・フェードアウト」を試したくて変更しましたが、フェードイン・フェードアウトの速度調整ができなかったため、「横にスライド」に戻したところ、速度調整が効かなくなりました。
コンテンツ商品表示設定のスライド設定が無効になっているようです。
確認いただけますでしょうか？
よろしくお願いします。

Re スライドについて 投稿者:おちゃのこ刑部 No.16580 URL

トントンハウス　井藤さん、こんにちは。

スライドについてです。
大変申し訳ございません。

今回の改善後、横スライドの場合に速度調整に不具合がございました。
先ほど調整させていただきました。

なお、フェードイン・フェードアウトについても速度調整は、横スライド時と同様にコンテンツ商品表示設定の設定が反映されます。

このたびは、ご迷惑をお掛け致しました。

よろしくお願い致します。

Re 無題 投稿者:トントンハウス　井藤 No.16585 URL

修正ありがとうございます。

Re 商品詳細メイン画像 投稿者:トゥルモンド No.16586 URL

商品詳細メイン画像も、トップ画像と同じように、自動スライドになりませんか？

Re 商品詳細メイン画像スライドについて 投稿者:おちゃのこ有本 No.16590 URL

トゥルモンドさん、こんにちは。

商品詳細メイン画像の自動スライドについてですが、
商品詳細ページのメイン画像が自動スライドするのは、
あまり一般的な表示方法ではなく、使い勝手に問題が出る可能性も考えられます。
そのため、現時点では対応の予定はございません。
ご了承ください。

よろしくお願いいたします。

Re 無題 投稿者:トゥルモンド No.16594 URL

有本さん、わかりました。ありがとうございます。

記事を閉じる 文字色 投稿者:友子 No.16589 URL

いつもお世話になっております。
商品一覧ページやトップページなどで表示される商品価格は文字が赤色になっているのですが、商品詳細ページのみ黒色になっています。
他の部分と同じ赤色にするためにはどのようにすればよろしいのでしょうか？

Re 販売価格について 投稿者:おちゃのこ刑部 No.16591 URL

友子さん、こんにちは。

販売価格についてです。
スタイルシートの編集から下記の箇所を編集してください。
color: #FF0000;を追加してください。

/* 商品詳細　販売価格金額 */
.detail_item_data .selling_price .figure {
font-weight: bold;
}

↓

/* 商品詳細　販売価格金額 */
.detail_item_data .selling_price .figure {
font-weight: bold;
color: #FF0000;
}

よろしくお願い致します。

Re 文字色 投稿者:友子 No.16593 URL

希望通りにできました。ありがとうございました。

記事を閉じる 本日の改良点のご報告 投稿者:おちゃのこ刑部 No.16592 URL

皆さん、こんにちは。

本日の改良点のご報告です。
------------------------------------
●ポイント除外設定が利用可能になりました。
これまで購入時に発行されるポイントは、購入された全商品が対象でしたが商品ごとに除外できるようになりました。

詳細は、下記FAQをご覧ください。
http://www.ocnk.net/faq/index.php?action=artikel&cat=281600&id=1002&artlang=ja

よろしくお願い致します。

新規登録

*必須項目

お名前
題名
コメント*
画像
※掲載可能な画像は、500kB以下のJPG・PNG・GIFファイルです。
アカウントID*
※半角英数字。記事にはショップのURLが表示されます。
ログインパスワード*
※管理画面ログイン時のパスワード

以下のフォームから自分の投稿記事を修正・削除することができます

処理: 記事No. パスワード: