おちゃのこ広場

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

開く
ご利用に際して
おちゃのこ広場では、以下のような書き込みを禁止します。
また、おちゃのこネットが不適当であると判断した場合、予告なく書き込みを削除する場合があります。
  • 誹謗中傷、他人を不愉快にさせるような書き込み。
  • 個人情報(住所、電話番号など)の書き込み。
  • 宣伝目的の書き込み。
おちゃのこネットは、おちゃのこ広場の使用に関連して発生したいかなる損害に対しても、一切の責任を負いません。
記事を閉じて表示
記事を閉じる ヘッダー 投稿者:カズ No.15380 URL

ヘッダーの画像下にナビゲーションボタンを付けましたが、
下のバナーなどとかぶってしまいます。
ボタン用のエリアを作るにはどうしたらよいでしょうか?

よろしくお願いします。

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

カズさん、こんにちは。

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

#header {
height: 250px;
}

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

記事を閉じる 無題 投稿者:ayano No.15374 URL

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

スライドショー、上手く設置できました。
ご丁寧にありがとうございました。


引き続きスマホサイトについてなのですが、

TOPの一番上、ロゴやカート、ログインのアイコンなのですが、
違うページいくと表示されないので、

常に表示されている状態にしたいのです。


お手数をお掛け致しますが、宜しくお願い致します。

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

ayanoさん、こんにちは。

自由記入欄に設定されている、下記の部分をキャッチフレーズ欄に移動させてください。

<div class="navi_free_top">
<a href="http://glitter.ocnk.net/phone/">
<img src="http://glitter.ocnk.net/data/glitter/mobile/top4.jpg"></a>
<a href="http://glitter.ocnk.net/phone/cart">
<img src="http://glitter.ocnk.net/data/glitter/mobile/cart.jpg"></a>
<a href="https://glitter.ocnk.net/phone/member-login">
<img src="http://glitter.ocnk.net/data/glitter/mobile/rogin.jpg"></a>
<a href="https://glitter.ocnk.net/phone/mail">
<img src="http://glitter.ocnk.net/data/glitter/mobile/mail.jpg"></a>
<a href="https://glitter.ocnk.net/phone/contact">
<img src="http://glitter.ocnk.net/data/glitter/mobile/contact.jpg"></a>
</div>

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

記事を閉じる 無題 投稿者:カズ No.15339 URL

ショップ下部 「RSS1.0 おちゃのこネットPowered by」 表示の上にトップ画像と同じ幅で、ご利用案内(画像&テキスト)を全べージに入れたいのですが、どのように編集すれば可能になりますでしょうか?

何卒、よろしくお願いします。

Re フッターについて 投稿者:おちゃのこ刑部 No.15344 URL

カズさん、こんにちは。

フッターについてです。
全ページに表示させる場合は、コピーライト欄を利用していただく必要があります。

下記の手順で作業を行ってください。
-------------------------------------------------------
STEP1 表示エリアを作る
-------------------------------------------------------
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
RSS部分の上に余白が入ります。この余白部分が、画像やテキストを表示するエリアとなります。
縦幅は、内容に合わせて調整をお願い致します。

#ochanoko {
padding-top: 300px;
}


-------------------------------------------------------
STEP2 コピーライト欄にhtmlタグを挿入する
-------------------------------------------------------
画像とコメントの設定→コピーライト欄に画像やテキストを下記の<div>タグで囲んで挿入してください。
内容部分は、ご自身で変更をお願い致します。

<div class="footer_banner">内容</div>

-------------------------------------------------------
STEP3 位置を調整する
-------------------------------------------------------
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
top: -350px;
left: 0px;
の値で位置を調整できます。
topのマイナス値を-400px等に変更すると上に移動します。

#footer {
position: relative;
}

.footer_banner {
position: absolute;
top: -350px;
left: 0px;
}

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

Re 無題 投稿者:カズ No.15375 URL

ありがとうございます!
トライしてみます。

記事を閉じる スライドショーについて 投稿者:ayano No.15368 URL

いつもご丁寧に教えて下さり感謝しております。


http://www.tiara-mily.com/

上記サイトのようにスライドする画像をTOPに
おきたいのですが、こちらはどのようにしたら
設置できますでしょうか?

宜しくお願い致します。

Re 追記 投稿者:ayano No.15369 URL

スマートフォン用になります!

スマホからhttp://www.tiara-mily.com/にアクセスして
見てください。

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

ayanoさん、こんにちは。

スライドショーについてです。
下記のメルマガバックナンバーでも紹介しておりますが、先日よりスライドショー機能が利用可能になっております。
http://www.ocnk.net/ocnk_ma/ocnkmagazine_asm183.html#de

通常は、商品表示に使いますが、設定によって1枚画像のスライドショーの作成も可能です。

例)
下記のhtmlタグをご利用の上、必要箇所をご自身で変更してご利用ください。
※各設定箇所については、メルマガバックナンバーをご参照ください。

<li class="list_item_cell">~</li>を追加することで、スライドを増やすことができます。
下記の例では、3枚の写真を利用しています。


<div class="item_list layout_photo">
<div class="swipe_list" data-autoplay="on" data-interval="5000" data-cols="1" data-adjustment="on">
<div class="list_item_table col1">

<ul class="list_item_row clearfix">

<li class="list_item_cell">
<div class="item_data">
<div class="inner_item_data">
<div class="list_item_photo">
<a class="item_image_box" href="http://cafe0808.ocnk.net/product/26">
<img width="300" height="300" data-retention="1" alt="ダイニングチェア" src="http://cafe0808.ocnk.net/data/cafe0808/product/1d6800df4c.jpg" />
</a>
</div>
</div>
</div>
</li>

<li class="list_item_cell">
<div class="item_data">
<div class="inner_item_data">
<div class="list_item_photo">
<a class="item_image_box" href="http://cafe0808.ocnk.net/product/25">
<img width="300" height="300" data-retention="1" alt="ダイニングチェア" src="http://cafe0808.ocnk.net/data/cafe0808/product/51a2a0ebd1.jpg" />
</a>
</div>
</div>
</div>
</li>

<li class="list_item_cell">
<div class="item_data">
<div class="inner_item_data">
<div class="list_item_photo">
<a class="item_image_box" href="http://cafe0808.ocnk.net/product/2">
<img width="300" height="300" data-retention="1" alt="Cafe Table" src="http://cafe0808.ocnk.net/data/cafe0808/product/b4d909d265.jpg" />
</a>
</div>
</div>
</div>
</li>

</ul>

<div class="pointer_box">
<span class="pointer_prev"></span>
<span class="pointer"></span>
<span class="pointer_next"></span>
</div>

</div>
</div>
</div>

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

Re 無題 投稿者:ayano No.15372 URL

間違えて違う方の投稿に返信してしまいました。

ありがとうございます!
教えていただいたのは自分でフリックするverですが、
自動的に次の画像に切り替わるようにしたいのです。

お手数をお掛けいたしますが、宜しくお願い致します。

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

ayanoさん、こんにちは。

先日ご回答させていただいたのは、5秒間隔で自動的に次のスライドへ移ります。
ただし、一旦操作すると自動再生は停止します。

<div class="swipe_list" data-autoplay="on" data-interval="5000" data-cols="1" data-adjustment="on">

操作後も自動再生する場合は、data-autoplay="on"の箇所をdata-autoplay="notStop"に変更したください。

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

記事を閉じる スマホサイトについて 投稿者:ayano No.15316 URL

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

スマートフォンサイトを開設したので今、つくりこんでいってるのですが、

添付画像のサイトのように、

1.一番上のPCサイト>の文字の横にお店の情報を流したい。


2.現状のログイン、新規会員登録、お問い合わせを消して
ショップ名のところにログイン、メルマガ、カートなどのアイコンをおきたい。

上記をするにはどこを編集すればよろしいのでしょうか?

お手数をお掛け致しますが、宜しくお願い致します。

Re スマホサイトについて 投稿者:おちゃのこ刑部 No.15318 URL

ayanoさん、こんにちは。

スマホサイトについてです。
文字を流す場合は、<MARQUEE>タグをご利用ください。
設定については、ご自身でお願い致します。

ログイン、新規登録、お問い合わせを非表示にすることは可能ですが、ログイン後にログアウト、マイページボタンに変わりますが、そのボタンについても非表示にされるのでしょうか。
ご検討ください。

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

Re 無題 投稿者:ayano No.15321 URL

早速のご返信ありがとうございます!

文字を流すのは出来ました!!


既存のログイン、新規登録はこちらは下に持っていって
オリジナルアイコンをつくろうと思います!!

つくったアイコンは自由記入欄に書き込んで一番上に持っていったらいいですか?



あと、勝手にスライドするジェイクエリーを入れてるお店がありますが、
それはどうやったら出来ますでしょうか?

宜しくお願い致します。

Re 無題 投稿者:ayano No.15322 URL
添付画像

ログイン、メルマガなどのアイコンを作成したのですが、

今、お店のロゴが入ってる横に4つほどアイコンを並べたいのですが

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

画像のお店と同じ感じで入れたいです。

Re 無題 投稿者:ayano No.15323 URL

今ショップ名の文字が出ている部分に

作成したロゴとアイコンを持って行きたいです。

そして、ログイン、新規登録はこちら、お問い合わせは削除したいので
やり方をお願い致します。

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

ayanoさん、こんにちは。

ご質問についてです。

・ログイン、新規登録、お問い合わせについて
スマートフォン管理→スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

ただし、ログイン後には、ログアウトとマイページボタンは表示しています。

#guestmember {
display: none;
}

.topnavi .inquery {
display: none;
}

#activemember .inquiry {
display: none;
}

#activemember .logout,
#activemember .mypage {
width: 50%;
}


・ヘッダーボタンについて
下記の手順で作業を行ってください。

STEP1 ショップロゴを設定する
-------------------------------------------------------
ショップのロゴ画像については、スマートフォン管理→画像とコメントの設定のショップ名画像欄にご登録ください。


STEP2 キャッチフレーズ欄にhtmlタグを移動する
-------------------------------------------------------
残り4つのメニューをスマートフォン管理→画像とコメントの設定→キャッチフレーズ欄に設定してください。


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

なお、4つのメニュー画像内にカートの中身ボタンがありましたので、既存の画像は非表示にしています。

#copy {
position: relative;
}

#copy img,
#header img {
border: none;
}

.head_cart {
display: none;
}

.navi_free {
z-index: 99;
position: absolute;
top: 35px;
right: 10px;
}

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

Re 無題 投稿者:ayano No.15328 URL

ありがとうございます。

何故か全部一列にはいらないので自由記入欄に入れなおしました。

今デカデカとショップ名が出てるのを削除することはできますか?

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

ayanoさん、こんにちは。

先ほどのご回答にも記載させていただきましたが、ショップ名ロゴについては、画像とコメントの設定から設定してください。

STEP1 ショップロゴを設定する
-------------------------------------------------------
ショップのロゴ画像については、スマートフォン管理→画像とコメントの設定のショップ名画像欄にご登録ください。


その上で、キャッチフレーズ欄には、ロゴを除いた4つのボタン用のhtmlを設置してください。

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

Re 無題 投稿者:ayano No.15330 URL

おせわになっております!!

出来ました!!

Re 至急 投稿者:ayano No.15331 URL

自由記入欄2にカテゴリ一覧を画像で作成したのですが、

新商品のとこに被ったりするんですが・・・・


至急お願い致します!!!!!!

Re 画像です。 投稿者:ayano No.15332 URL
添付画像

状況を添付致しました。

宜しくお願い致します。

Re 追記 投稿者:ayano No.15333 URL

何度もすいません!!

カテゴリ一覧は商品検索の下におきたいと思っております!!

お手数をお掛けいたしますが、宜しくお願い致します。

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

ayanoさん、こんにちは。

スマートフォン版についてです。
現在、自由記入欄は非表示にされているかと思いますが、表示位置については、
スマートフォン管理の表示とレイアウトの設定から設定することができます。
各欄の右端に上下矢印がありますので、クリックして上下に移動してください。

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

Re 無題 投稿者:ayano No.15348 URL

表示にして値段別に探すの上にもって来ましたが、
スマートフォンで見ると表示がバクってます。

カテゴリの画像が新商品とかぶってしまってます。

Re 表示について 投稿者:おちゃのこ刑部 No.15350 URL

ayanoさん、こんにちは。

下部のカテゴリメニューにもnavi_freeを適用されておりますが、商品検索下部に配置する場合は必要ありませんので、通常の<div>タグに変更ください。

<div class="navi_free">

<div>

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

Re 無題 投稿者:ayano No.15352 URL

すみません。

どこの部分を直せばいいですか?
スタイルシートですか?

Re 無題 投稿者:ayano No.15353 URL
添付画像

カテゴリ画像はスマートフォンように新たに作ったものです。

自由記入欄に記載してるのになるのですが、

値段別に探すと商品検索の間にそれを入れ込みたいのですが

今は何故か表示レイアウトでブロックAの上に自由記入欄2をもってきているのに値段別の下に表示されます。

<br>をいっぱい入れてなかったら上部のカートやログインのアイコンの部分に
被って表示されてしまいます。

Re カテゴリについて 投稿者:おちゃのこ刑部 No.15356 URL

ayanoさん、こんにちは。

自由記入欄に設定されている下記の<div class="navi_free">からnavi_freeのクラス名を削除して<div>に変更して下さい。

<div class="navi_free">
<br><br><br><br><br><br><br><br><a href="http://glitter.ocnk.net/phone/product-list/5">
<img src="http://glitter.ocnk.net/data/glitter/mobile/cace.jpg"></a>


</div>

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

Re 無題 投稿者:ayano No.15357 URL

<div>を入れましたが直りません。。

Re 無題 投稿者:ayano No.15360 URL

スタイルシートの下記文を消すと、ロゴ・カート・ログインのアイコンが
商品検索の下に行ってしまうのですが、自由記入欄2に記載している画像は
思っている場所に表示されます。

自由記入欄1と自由記入欄2が一緒になっているみたいなんですが、
解決する方法はありますか?

自由記入欄1は今の場所、自由記入欄2は商品検索と値段別に探すの間に
表示させたいです!!!!!!



.navi_free {
z-index: 99;
position: absolute;
top: 35px;
right: 10px;
}

Re 自由記入欄について 投稿者:おちゃのこ刑部 No.15363 URL

ayanoさん、こんにちは。

現状、<div class="navi_free">の後ろに<div>を追加いただいておりますが、追加ではなく<div class="navi_free">を<div>に変更していただけますでしょうか。

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

Re 無題 投稿者:ayano No.15364 URL

私が見ている管理画面には
<div class="navi_free">
の表示がないのですが・・・・

Re 自由記入欄について 投稿者:おちゃのこ刑部 No.15365 URL

ayanoさん、こんにちは。

大変申し訳ございません。
ご回答に誤りがございました。

下記の手順で再度設定をお願い致します。
-------------------------------------------------------
STEP1 自由記入欄を変更する
-------------------------------------------------------
自由記入欄1のhtmlタグを下記のように<div>タグで囲んでください。

<div class="navi_free_top">
現在の自由記入欄内容
</div>

-------------------------------------------------------
STEP2 スタイルシートを編集する
-------------------------------------------------------
スタイルシート内から.navi_freeの指定を削除ください。

削除いただいた上で、下記の指定を追加してください。
.navi_free_top {
z-index: 99;
position: absolute;
top: 35px;
right: 10px;
}

なお、設定後、自由記入欄2の<br>タグの影響で余白が入りますので、<br>タグを削除していただき調整をお願い致します。

お手数をお掛けして申し訳ございませんでした。

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

Re 無題 投稿者:ayano No.15366 URL

できました!!!

説明が下手で申し訳ないです。

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

記事を閉じる 登記簿謄本コピーについて 投稿者:榎本 No.15347 URL

すでに1店出店していますが、もう1店舗出店のためアカウントを登録したいと思います。
再度登記簿謄本のコピーの提出が必要になりますでしょうか。

また無料試用期間中の8月21日~9月20日を共用ドメイン、
9月21日から独自ドメインというような使い方はできますでしょうか。
その場合お支払いはいつまでにすればよろしいでしょうか。

Re 登記簿謄本について 投稿者:おちゃのこ刑部 No.15351 URL

榎本さん、こんにちは。

登記簿謄本については、アカウントごとに必要書類のご提出をお願いしておりますので、お手数ですがご提出をお願いいたします。

無料試用期間についてです。
ご入金までは、共用ドメインでのご利用になります。

ご入金確認後7営業日以内に、弊社にて独自ドメインの設定作業を行いますので、そちらを考慮してお支払いください。なお、恐れ入りますが、ドメイン設定の日時を指定することはできません。

おちゃのこでのドメイン取得を希望される場合は、ドメイン設定完了後、サイトは独自ドメインで表示されます。
すでにお持ちのドメインをおちゃのこで使用される場合は、ご自身でDNS情報を変更された後、サイトが独自ドメインで表示されます。
DNS情報は、ドメイン設定完了後にメールにてをお知らせいたします。

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

Re 支払い方法について 投稿者:榎本 No.15361 URL

お返事ありがとうございます。

登記簿謄本提出について、クレジットカード支払いにすると提出の必要はないのでしょうか?

Re 支払方法について 投稿者:おちゃのこ刑部 No.15362 URL

榎本さん、こんにちは。

支払方法についてです。
下記FAQにも記載しておりますが、クレジットカードの場合、書類のご提出は必要ありません。
http://www.ocnk.net/faq/index.php?action=artikel&cat=281596&id=160&artlang=ja

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

記事を閉じる 関連商品の価格表示について 投稿者:chiyo No.15341 URL

お世話になっています。
関連商品の価格表示について教えて下さい。

販売価格ラベルを以下のように変更しているのですが、
販売価格→SALE価格
希望小売価格→通常価格

商品ページ下の関連商品の通常価格が2つも表示されてしまいます。
http://bochibochi.ocnk.net/product/67

どこをどうすればよろしいでしょうか?
お忙しいところ恐れ入ります。よろしくお願いいたします。

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

chiyoさん、こんにちは。

価格表示についてです。
販売価格
全体割引前価格
希望小売価格
の順に表示されております。希望小売価格のラベルを通常価格に変更いたただいているため、通常価格が2つ表示されております。

全体割引前価格を表示にする場合は、スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

.other_item .visitor_price,
.other_item .member_price br {
display: none;
}

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

Re ご回答ありがとうございます。 投稿者:chiyo No.15354 URL

おちゃのこ刑部 様

すみません。
貼り付けてみたのですが、表示は変わらなくて・・・

全体割引前価格のところを非表示にしたいと思います。

申し訳ありません。
もう一度教えていただけますでしょうか。。。

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

chiyoさん、こんにちは。

価格についてです。
今回貼り付けていただいた部分以外のスタイルシート内の記載が原因です。

#pan A:hover {
color: #FF0000;
font-size: 14px;

.photo_line_80:hover,
.photo_line_140:hover,
.photo_line_250:hover {
-webkit-box-shadow : 2px 2px 5px 0px #CCCCCC;
-moz-box-shadow : 2px 2px 5px 0px #CCCCCC;
box-shadow: 2px 2px 5px 0px #CCCCCC;
}

上記箇所ですが、#pan A:hover {に対する}が抜けております。
}の追加をお願い致します。

#pan A:hover {
color: #FF0000;
font-size: 14px;
}

上記のように変更し再度、先ほどの指定を最下部に貼り付けてご確認ください。

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

Re ありがとうございました! 投稿者:chiyo No.15359 URL

おちゃのこ刑部 様

できました!
お忙しいところ何度も申し訳ありませんでした。
お手数をおかけいたしました。
ありがとうございました!!

記事を閉じる 無題 投稿者:muu No.15340 URL

こんばんは。
お世話になっております。

初歩的な質問かもしれませんが何点かわからない所が
ありますのでお答え頂ければ助かります。

①ショップロゴを画像にしているのですが、サイズを大きく変更し、
 中央にもってくるにはどのようにしたらよいのでしょうか?

②ホームページ全体をそのまま中央にしたいのですが
 どのようにしたらよいのでしょうか?

③ヘッダー画像を950×700にしておりますが
 載せるとどうしてもぼやけてしまいます。
 やはり、中のスタイルシートを変更しなければならないのでしょうか?
 その際、どのようにしたら良いのでしょうか?

④左サイドの商品カテゴリーの上に空白があるのですが
 空白をなくしたいと思っております。色々してみましたが
 わからないので教えて下さい。


お忙しい中、申し訳ありませんがよろしくお願いします。

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

muuさん、こんにちは。

ご質問についてです。

(1)ショップロゴについて
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。
widthとheightは画像サイズに合わせて変更してください。

.shoplogo {
width: 860px;
text-align: center;
}

.shoplogo img {
width: 350px;
height: 50px;
}


(2)ページ全体の表示について
現在ページ全体に中央寄せとなっております。
もう少し詳細をお願いできますでしょうか。


(3)ヘッダー画像について
アップロード画像の容量が200KBを超えている可能性があります。
下記のFAQをご覧ください。
http://www.ocnk.net/faq/index.php?action=artikel&cat=281572&id=765&artlang=ja


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

.top_page_body #lefttd {
padding-top: 0px;
}

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

記事を閉じる 無題 投稿者:ユタカ No.15335 URL

いつもショッピンカートを利用させていただいています。

何度か調べましたがわからなかったので質問します。

設定方法がある場合はご教授願えますか。

もし設定にない場合は導入をご検討ください。

・管理画面や商品購入の検索で、アルファベット検索するとローマ字入力のアルファベットと無変換のアルファベットを区別するので、しないように設定してほしい。

・購入者がご注文者住所にお届けではなく、登録したお届け先がある場合や、備考欄に何か明記がある場合は、受注一覧ページで色が違い判断できるようにしてほしい。

・管理画面で商品を選択する際、1つずつクリックしないといけないのが手間。すべて選択というボタンがほしい。

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

ユタカさん、こんにちは。

ご質問についてです。

・検索について
検索については、全角、半角は区別する仕様となっております。
表画面については、Google検索をご利用いただくことで区別せずに検索することが可能です。
設定は、管理画面→表示とレイアウトの設定内のその他設定内から設定できます。

・受注について
現状は、設定することができませんので、今後検討して参ります。

・商品の選択について
商品選択については、複数選択が可能です。
下記のFAQの「Shiftキーを使った複数選択 」をご覧ください。
http://www.ocnk.net/faq/index.php?action=artikel&cat=281576&id=633&artlang=ja

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

記事を閉じる スライド機能 投稿者:ZERO No.15324 URL

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

先日は、スマホ版にスライド機能を導入し、良い感じになりました。

本日のデザイン道場を参考に、PCサイトにスライド機能に導入します。
サンプルサイトでは、一度に3画像の表示になっておりますが、当店では2カラムのため、4画像を表示させようと考えております。
その際、data-cols="3" と"list_item_table col3"の3を4に変更でよいと考えますが、img widthとheightは、どのようになるのでしょう?
サンプルではどちらも"300"となっていますが、実際のサンプルサイトはは"300"もございませんし。

お忙しいところ誠に申し訳ございませんが、ご回答の程を宜しくお願い申し上げます。

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

ZEROさん、こんにちは。

スライド表示についてです。
画像については、親要素の横幅に対して均等に各画像が表示されるようにしています。
そのため、300pxの数値は、html上の数値であり実際の表示幅は自動的に調整されます。

4列表示される場合は、col3という箇所が2箇所ございますので、そちらをcol4に変更をお願い致します。
下記、デモサイトに設定しておりますので、参考にご覧ください。
http://cafe0808.ocnk.net/page/13

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

Re 無題 投稿者:ZERO No.15327 URL

おちゃのこ刑部 さま

いつも大変お世話になっております。
スマホサイト同様に商品名・価格表示を削除し、画像のみの4列表示が出来ました。

有難うございました。

記事を閉じる 商品一覧ページの「商品並び替え」 投稿者:MAX.店長 No.15184 URL

いつもお世話になります。
商品一覧ページ(商品カテゴリと商品グループ共)の「商品並び替え」部分を
「説明付き一覧」「写真のみ一覧」のすぐ上部に表示したいのですが、
可能でしょうか?
カテゴリの説明文が長いと、実際の商品一覧表示される部分から大きく離れてしまうので、お客様が使いにくいような気がしますので。。。

お手すきの時で結構ですのでどうぞよろしくお願いいたします。

Re 商品一覧について 投稿者:おちゃのこ刑部 No.15186 URL

MAX.店長さん、こんにちは。

商品一覧ページについてです。
class名を追加し位置変更可能なように調整致しました。
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

.categorylist_page_body .list_table_header_box,
.pickuplist_page_body .list_table_header_box {
position: relative;
padding-bottom: 50px;
}

.categorylist_page_body .list_soat,
.pickuplist_page_body .list_soat {
position: absolute;
bottom: 0px;
right: 0px;
}

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

Re ありがとうございます 投稿者:MAX.店長 No.15187 URL

早速のご回答ありがとうございました。
うまくいきました。
またよろしくお願いいたします。

Re 商品一覧ページのタイトル 投稿者:MAX.店長 No.15317 URL

お世話になります。
先日商品一覧ページの「商品並び替え」の位置調整を教えていただいたのですが、タイトル部分(カテゴリ名)も商品並び替えの左側に下ろしてきたいのですがかのうでしょうか?
また、移動させるとこれまで「タイトル部分」「商品並び替え」のあった場所がスペースの空いた状態になってしまうと思いますので、その隙間も無くしたいです。
よろしければご教示くださいますようお願い致します。

Re カテゴリ名について 投稿者:おちゃのこ刑部 No.15319 URL

MAX.店長さん、こんにちは。

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

.list_name {
position: absolute;
left: 0px;
bottom: 0px;
}
.pmiddle{
padding: 0px;
margin-top: 0px;
}

.list_table_header_box .clear-both {
display: none;
}

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

Re ありがとうございます 投稿者:MAX.店長 No.15320 URL

うまくいきました!
またよろしくお願い致します^^

記事を閉じる 行間 投稿者:ZERO No.15312 URL

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

お尋ねいたします。
スマホサイトにおいて、トップページのみテキスト文章の行間を狭めることは可能でしょうか?
テキスト文章が若干多いトップページの見栄えを良くしたく、変更を考えております。

宜しくお願い申し上げます。

Re 行間について 投稿者:おちゃのこ刑部 No.15314 URL

ZEROさん、こんにちは。

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

.top_page_body {
line-height: 100%;
}

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

Re 無題 投稿者:ZERO No.15315 URL

おちゃのこ刑部さま

お世話になります。
ご回答まことに有難うございました。

若干、行間が狭すぎましたので、line-heightを115%にしてみました。

段々、スマホサイトがクールになり、大変満足です。

有難うございました。

記事を閉じる 文字サイズについて 投稿者:榎本知華 No.15311 URL

商品説明文の文字サイズを15pxにしたいのですが
CSSで編集すると他の部分のデザインが崩れます。
方法がありましたら教えてください。

http://www.stone-stone.jp/product/689

Re 文字サイズについて 投稿者:おちゃのこ刑部 No.15313 URL

榎本知華さん、こんにちは。

商品説明欄の文字サイズについてです。
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

.detail_desc_box {
font-size: 15px;
}

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

記事を閉じる メルマガ登録フォームについて 投稿者:榎本 No.15277 URL

1)ショップメルマガの登録フォームをサイドバー以外に表示させる事はできますでしょうか。

トップページ中央やフリーページに登録フォームを表示させたいのですが、可能でしょうか。

もし可能な場合は設定方法を教えてください。

Re メルマガ欄について 投稿者:おちゃのこ刑部 No.15280 URL

榎本さん、こんにちは。

メルマガ欄についてです。
設定いただくことは可能です。

下記のFAQをご覧くださいませ。
外部ページ用の例となっておりますが、フリーページに設定いただいても問題ありません。
※ただし、登録、解除時のメッセージを表示するため、ボタンクリック時にトップページへ遷移します。

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

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

Re メルマガフォーム 投稿者:榎本知華 No.15308 URL

おちゃのこ 刑部 様

お返事ありがとうございました。
↓のページで紹介されているタグをそのまま使用すると、左エリア用になのか小さいサイズで表示されます。

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

タグを編集してみて、フリーページに設定しましたが、
メールの入力欄と「こちらにメールアドレスを入れてから登録ボタンを押してくださいね」という文字の間が縮まりません。

http://www.stone-stone.jp/page/3

できればフォームだけのタグを教えていただけると助かります
よろしくお願いします

Re メルマガ欄について 投稿者:おちゃのこ刑部 No.15309 URL

榎本知華さん、こんにちは。

メルマガ欄についてです。
現状、フリーページをご登録いただく際に、フリーページ内容欄下の「改行は<br />タグに置換する」にチェックを入れて登録いただいているため、htmlタグ間に改行が入っております。

例えば下記の場合
<b>こちらにメールアドレスを入れてから登録ボタンを押してくださいね</b>
<form action="http://www.stone-stone.jp/" method="post"><input type="hidden" name="mode" value="mailmagazineadd">

↓</b>の後ろの改行を削除し、<form>タグを続けて記載してください。

<b>こちらにメールアドレスを入れてから登録ボタンを押してくださいね</b><form action="http://www.stone-stone.jp/" method="post"><input type="hidden" name="mode" value="mailmagazineadd">

また、入力エリアのサイズは、size="20"をsize="40"等の数値に変更していただければ、サイズの変更は可能です。
<input type="text" name="email" size="20" maxlength="600" value="" />

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

Re 解決しました 投稿者:榎本知華 No.15310 URL

おちゃのこ 刑部さま

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

記事を閉じる スマホ版の非表示設定 投稿者:hitowaku No.15306 URL

いつもお世話になります。
スマホ版の商品カテゴリー一覧ページの上部に表示される、「おすすめ順」「価格の安い順」「売れ筋順」の表示を非表示にしたいのですが、スタイルシートのどの部分を 変更すればよろしいのでしょうか?

Re ソートについて 投稿者:おちゃのこ刑部 No.15307 URL

hitowakuさん、こんにちは。

ソートについてです。
スマートフォン管理→スタイルシートの編集から下記の指定をコピーして貼り付けてください。

.sort {
display: none;
}

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

記事を閉じる トップページの編集について 投稿者:Kitty No.15299 URL

昨日も投稿させていただいたのですが、うまくアップされていなかったようですので、再度ご質問させていただきたいと思います。
まだネットショップをはじめたばかりで、分からないことばかりなのですが、
教えていただけますと助かります。

①ヘッダーのご利用案内、お問い合わせの文字を大きくする方法

②ヘッダーの”商品検索:”を削除する方法

③検索ボタンを虫眼鏡マークに変更する方法

④フリーページの背景を特定商取引法表示やご利用案内、お問い合わせの背景に使われているのと同じ背景写真に設定する方法

⑤フッターの端から端までに、カラー(#E7E7DA)を使って0.2mmくらいの太さの横線を引く方法

⑥⑤の横線の下に、特定商取引法表示やフリーページで作成したプライバシーポリシー、セキュリティー、Q&Aのページを横一列に配置する方法

⑦⑥で配置した特定商取引法表示やプライバシーポリシーの間に、0.5cmほどの縦線を引き、仕切りのようにする方法

質問ばかりで申し訳ありませんが、どうぞよろしくお願いいたします。

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

Kittyさん、こんにちは。

ご質問についてです。

(1)ヘッダーのご利用案内、お問い合わせの文字を大きくする方法
下記のFAQをご覧ください。リンクの方の指定がご利用案内、お問い合わせの指定となります。
--------------------------------------------------------
http://www.ocnk.net/faq/index.php?action=artikel&cat=281583&id=94&artlang=ja


(2)ヘッダーの”商品検索:”を削除する方法
--------------------------------------------------------
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

.search_label {
display: none;
}


(3)検索ボタンを虫眼鏡マークに変更する方法
--------------------------------------------------------
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

画像については、ご自身で作成し画像専用管理画面→コンテンツフォルダにアップロードしてください。
background-image: url(image/ファイル名);が背景画像の指定箇所となりますので、アップロードいただいたファイル名に変更してください。
画像サイズは、widthとheightで指定可能です。作成画像に合わせて変更してください。

.subnavi .searchinput {
width: 40px;
height: 23px;
cursor: pointer;
text-indent: -9999px;
border: none;
background-color: transparent;
background-image: url(image/ファイル名);
}


(4)フリーページの背景を特定商取引法表示やご利用案内、お問い合わせの背景に使われているのと同じ背景写真に設定する方法
--------------------------------------------------------
下記のhtmlタグをご利用ください。
タイトルと内容部分はご自身で変更してください。

<div id="pagemain">
<div class="ptitle">タイトル</div>
<div class="pmiddle">
<div class="link_shop">内容</div>
</div>
<div class="pbottom"></div>
</div>


(5)フッターの端から端までに、カラー(#E7E7DA)を使って0.2mmくらいの太さの横線を引く方法
--------------------------------------------------------
スタイルシートの編集から下記の指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願い致します。

#footer {
border-top: 2px solid #E7E7DA;
}


(6)(5)の横線の下に、特定商取引法表示やフリーページで作成したプライバシーポリシー、セキュリティー、Q&Aのページを横一列に配置する方法
(7)(6)で配置した特定商取引法表示やプライバシーポリシーの間に、0.5cmほどの縦線を引き、仕切りのようにする方法
--------------------------------------------------------
画像とコメントの設定→コピーライト欄は、htmlタグ利用可能となっております。
<a>タグでリンクを設定したテキストを区切り線|で区切っていただく方法が良いかと思います。
htmlタグのレイアウト作成については、基本的にはサポート外となっております。ご自身で作成をお願い致します。

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

Re ありがとうございました 投稿者:Kitty No.15304 URL

おちゃのこ刑部様

お世話になっております。
ご回答ありがとうございます。
教えていただいた件、思った通りに作成することができ感動しております。
ありがとうございました!

またご質問させていただくと思いますが、
どうぞよろしくお願いいたします。

記事を閉じる 画像が表示されない(開店前) 投稿者:原 芳生 No.15302 URL

画像専用管理画面より画像をアップロードし、自由記入欄に、一覧に表示された画像のURLアイコンより取得した画像URLを記述しても、表示されません。

CSSで背景画像に指定した場合は表示されるのですが、
http://ドメイン名/data/ドメイン名/image/top/ban_pickup_01.jpg
と直接記述した場合には表示されないのですが、
何か表記ミスでしょうか。

Re 画像が表示されない(開店前) 投稿者: No.15303 URL

自己解決いたしました。

サーバー移行予定の為、ドメインのネームサーバーを変更していないだけでした。
失礼いたしました。

記事を閉じる タイトルについて 投稿者:Muu No.15298 URL

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

質問なのですが、
《What's new》《商品カテゴリー》《New Arrivals》《おすすめ商品》

のタイトルを自分で作成した画像に変更したいのですが
できるのでしょうか?

その際、タテ×ヨコのサイズは何になるのでしょうか?

大変お忙しい所申し訳ありませんがよろしくお願い致します。

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

Muuさん、こんにちは。

タイトルについてです。
下記のFAQをご覧ください。

・カテゴリ一覧について
http://www.ocnk.net/faq/index.php?action=artikel&cat=281597&id=455&artlang=ja

・What's Newについて
http://www.ocnk.net/faq/index.php?action=artikel&cat=281584&id=560&artlang=ja

・新商品、おすすめ商品について
※新商品、おすすめ商品は同様の.style1_topのclass名を利用しております。
下記FAQにも記載しておりますが、自由記入欄で新商品に別のクラス名を付けて新商品用の指定を行った後、.style1_topに対しておすすめ商品用の指定を行ってください。
http://www.ocnk.net/faq/index.php?action=artikel&cat=281584&id=558&artlang=ja

画像サイズについては、左エリア:横幅160px、中央エリア:670pxとなります。縦幅については、基本的には自由です。
各箇所で、height: 50px;等を指定いただければ、50pxで利用可能です。

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

記事を閉じる 店長日記のランキングサイト 投稿者:Kagawa No.15275 URL

こんにちは、お世話になります宜しくお願いします。

店長日記を更新する励みにと思い、ランキングサイト(にほんブログ村)に登録してみました。

日記は外部ではなく、おちゃのこさんの日記を使っております。

登録してしばらくしてみたら、更新状況(記事)が出ていたのですが商品を更新した日にちと商品ページになっていて、店長日記のページが表示されません。

Pingを手動で送信しても、本日新たに書いた店長日記は反映されないようです。


ランキングサイト登録時のURLは日記ページにしたのですが、これはどのようにすれば店長日記をランキングサイトに反映させていけるのでしょうか?


宜しくお願い致します。

Re ランキングサイトについて 投稿者:おちゃのこ刑部 No.15288 URL

Kagawaさん、こんにちは。

ランキングサイトについてです。
おちゃのこネットは、商品情報のRSSフィードを提供しておりますが、店長日記については、RSSフィードを提供しておりません。
そのため、ランキングサイトでは、商品更新情報が反映されます。

店長日記のRSSフィードについては、改善課題となっております。

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

Re ありがとうございました 投稿者:Kagawa No.15297 URL

おちゃのこ刑部様
ご返答ありがとうございました。
日記はダメだったのですね・・・。

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

記事を閉じる 自由記入欄でのスライド表示 投稿者:ZERO No.15285 URL

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

スライド表示、すばらしい表示機能に感動です。
一部を導入しました。

自由記入欄でのスライド表示に関し、お尋ね致します。

1. 移動先<s>タグのhref=" の以降は、通常のHTMLのように、http://からの記述でしょうか?

2. 商品名と価格を非表示にしたい場合、下記を削除すればよろしいのでしょうか?
<div class="list_item_data">
<p class="item_name"><a href="/faq/index.php?action=artikel&lang=ja&cat=281598&id=883&artlang=ja#">商品名</a></p>
<p class="price">価格</p>
</div>

以上、ご回答の程を宜しくお願い申し上げます。

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

ZEROさん、こんにちは。

自由記入欄のスライド表示についてです。
リンク先は、http://~のURLで問題ありません。
写真のみにされる場合は、<div class="list_item_data">~</div>の削除で問題ございません。
ご活用くださいませ。

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

Re リンク先 投稿者:ZERO No.15289 URL

おちゃのこ刑部さま

お世話になります。
ご回答を有難うございました。

自由記入欄2にスライド表示を導入しました。
商品名・価格を非表示には出来ました。
リンク先ですが、http://~で記載しましたが、リンク先に飛びませんし、サイト上にその部分の記述が出てしまってます。
間違い箇所が分かりません。

よろしくお願い申し上げます。

Re 無題 投稿者:ZERO No.15290 URL

おちゃのこ刑部さま

申し訳ございません。
解決いたしました。
http://zerogravityshop.ocnk.netの部分を削除し、次の/からの記述ですね。
回答に「http://~のURLで問題ありません。」とありましたので。

あと1点お尋ねいたします。
現在表示列を3にしていますが、画像間の隙間をもう少し詰め、画像表示をもう少し大きくしたいのですが、可能でしょうか?

何卒宜しくお願い申し上げます。

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

ZEROさん、こんにちは。

スライド表示についてです。
URLについては、通常は、絶対パスでの記載で問題ありません。
下記のようなURL記載となります。
http://zerogravityshop.ocnk.net/product/118

URLがそのまま表示されていたということですが、<a>タグ内の記載に問題があった可能性があります。
トップページからのリンクの場合は、相対パスでも問題ございません。

スライド部分の余白については、スタイルシートの編集から下記の指定をご利用ください。
下記の指定は、写真間の余白と写真周りの余白と線を全て削除した指定となります。
必要に応じて、padding値とborder値は編集してください。

.top_page_body .swipe_list .item_data {
padding: 0px;
}

.top_page_body .swipe_list .list_item_photo {
padding: 0px;
border: none;
}

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

Re 無題 投稿者:ZERO No.15294 URL
添付画像

おちゃのこ刑部さま

お世話になります。
ご連絡を有難うございました。paddingは1pxでアレンジしましたらバッチリでした。

度々で申し訳ございません。
スライドのポインターと次の行の行間(
ポインターと”椎名~”の間)がありすぎるのですが、調整は可能でしょうか?

お忙しいところ申し訳ございませんが、宜しくご回答の程をお願い申し上げます。

Re 余白について 投稿者:おちゃのこ刑部 No.15295 URL

ZEROさん、こんにちは。

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

.swipe_list .pointer_box {
padding-bottom: 0px;
margin-bottom: 0px;
}

.swipe_list .pointer span {
margin-bottom: 0px;
}

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

Re 無題 投稿者:ZERO No.15296 URL

おちゃのこ刑部さま

お世話になります。
スペースが埋まり、綺麗に表示出来ました。

お忙しい中、誠に有難うございました。

新規登録

*必須項目

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

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