カートの位置を変えるには
- このトピックには7件の返信、2人の参加者があり、最後に
により12年、 9ヶ月前に更新されました。
-
投稿
-
いつもフォーラムにはお世話になっております。
今回は商品詳細ページのカートの位置の事についてご教授頂きたく質問させていただきました。
デフォルトだと上から商品名、商品説明、そして一番下に「カートに入れる」があると思うのですが、その「カートに入れる」の位置を商品名のすぐ下に入れたいと思うのですが、usces-cart.cssの
/*********************************************************************/
/* cart Start */
#main h1.cart_page_title {
margin: 0px;
padding: 0px 0px 10px 0px;
font-size: 16px;
}
div.usccart_navi li.ucart {
width: 24%;
}
#cart table {
width: 100%;
}
#main h3 {
font-size: 100%;
background: url(images/h3_bg.gif); /*h3の背景画像設定*/
background-repeat: no-repeat;
color: #FFFFFF; /*h2の文字色（ここでは白）*/
margin-top: 10px;
line-height: 28px;
letter-spacing: 0.2em; /*文字間隔をほんの気持ち広げる設定。通常にしたいなら、この１行を削除する。*/
padding-bottom: 2px;
padding-left: 15px;
}
/* cart End */
を上に移動しても何も変化がありません。
うまく表示できる技をご教授ください。
よろしくお願いいたします。
こんにちは。
＞を上に移動しても何も変化がありません。
とありますが、何を上に移動したのでしょうか。。CSSの絶対位置を利用して上にあげたということでしょうか。もう少し詳しくご説明いただけると助かります。
nanbuさん、お世話になります。
カートのstyle.cssは以下がすべてになります。
その中の「カートに入れる」部分が最初に質問している中のcssの部分かと思い、
/*********************************************************************/
/* wc_item_single Start */
の上にそのcssをコピーしたのですが、何の変化も現れず、ご表示もなく、、、といった具合でした。
カートの位置を移動、というよりは、商品名や価格の下にもう一つ「カートにいれる」を追加したい感じなのです。
どのようにいじったらよいものでしょうか。
ご教授よろしくお願いいたします。
@charset “utf-8”;
/* CSS Document */
#wp-calendar td.businessday {
background-color: #FFECCE;
color: #F00;
}
/*********************************************************************/
/* wc_item_single Start */
#main h1.item_page_title {
padding-bottom: 10px;
font-size: 1.5em;
}
#itempage h2.item_name {
height: 18px;
margin-bottom: 10px;
margin-left: 310px;
padding: 3px 5px;
background-color: #999999;
font-size: 14px;
color: #FFFFFF;
line-height: 18px;
}
#itempage h3.item_name {
height: 60px;
margin-bottom: 10px;
margin-left: 310px;
padding: 3px 5px;
background-color: #784421;
font-size: 14px;
color: #FFFFFF;
line-height: 18px;
}
#itempage .itemimg {
width: auto;
}
/* wc_item_single End */
/*********************************************************************/
/* wc_item_single Start */
#itempage .field {
margin-left: 310px;
}
#itempage .assistance_item {
width: 740px;
}
#itempage .assistance_item ul {
width: 750px;
margin-right: -10px;
overflow: hidden;
_zoom: 1;
}
#itempage .assistance_item ul li {
width: 240px;
margin-right: 10px;
}
#itempage .assistance_item .listbox {
height: 125px;
margin-right: 0px;
overflow: hidden;
}
/* wc_item_single End */
/*********************************************************************/
/* cart Start */
#main h1.cart_page_title {
margin: 0px;
padding: 0px 0px 10px 0px;
font-size: 16px;
}
div.usccart_navi li.ucart {
width: 24%;
}
#cart table {
width: 100%;
}
#main h3 {
font-size: 100%;
background: url(images/h3_bg.gif); /*h3の背景画像設定*/
background-repeat: no-repeat;
color: #FFFFFF; /*h2の文字色（ここでは白）*/
margin-top: 10px;
line-height: 28px;
letter-spacing: 0.2em; /*文字間隔をほんの気持ち広げる設定。通常にしたいなら、この１行を削除する。*/
padding-bottom: 2px;
padding-left: 15px;
}
/* cart End */
/*********************************************************************/
/* member Start */
#main h1.member_page_title {
margin: 0px;
padding: 20px 0px 10px 0px;
font-size: 1.2em;
}
/* member End */
/*********************************************************************/
CSSの書かれているセレクタの位置変更しても、カート投入ボタンの位置は変わりません。
カート投入ボタンの位置を変更するのであれば、CSSではなくテンプレートファイルを修正するのが良いと思います。該当するテンプレートはご利用中のテーマ内にあります wc_templates/wc_item_single.php です。
テンプレートに書かれているカート投入ボタンは
<?php usces_the_itemSkuButton(__('Add to Shopping Cart', 'usces'), 0); ?>ですが、formの関係もありますので、これだけを移動してもうまく行きません。もっとも単純な方法は、
<?php the_content(); ?>の位置をformの上か下に移動させるのが良いのではないでしょうか。ご説明を読む限り素人がいじるにはやはり動的なものは難しいかもしれません。
おっしゃる通りwc_item_single.phpを少しいじってみましたがレイアウトがずれたり真っ白な画面になったりと、うーん、なかなか不安が増してまいりました。
それでと言ってはなんなのですが、添付しております画のように商品名や価格などの部分を商品説明分とカートボタンの間に移動ではなく追加するにはどの部分に何をすればよいものでしょうか。
移動についてはほかのご質問にあった様なのですが、追加については見つけられませんでしたので、このトピックではございますが改めてお聞きしたく思います。
どうぞよろしくお願いいたします
wc_item_single.php をご覧ください。ご希望の部分はwc_item_single.php 内の以下の部分です。これをご希望の場所にコピーしていただければ良いかと思います。
<h2 class="item_name"><?php usces_the_itemName(); ?> (<?php usces_the_itemCode(); ?>)</h2>
<div class="exp clearfix">
<div class="field">
<?php if( usces_the_itemCprice('return') > 0 ) : ?>
<div class="field_name"><?php _e('List price', 'usces'); ?><?php usces_guid_tax(); ?></div>
<div class="field_cprice"><?php usces_the_itemCpriceCr(); ?></div>
<?php endif; ?>
<div class="field_name"><?php _e('selling price', 'usces'); ?><?php usces_guid_tax(); ?></div>
<div class="field_price"><?php usces_the_itemPriceCr(); ?></div>
</div>
<div class="field"><?php _e('stock status', 'usces'); ?> : <?php usces_the_itemZaiko(); ?></div>
<?php if( $item_custom = usces_get_item_custom( $post->ID, 'list', 'return' ) ) : ?>
<div class="field"><?php echo $item_custom; ?></div>
<?php endif; ?>
<?php the_content(); ?>
</div><!-- end of exp -->
- このトピックに返信するにはログインが必要です。
PAGE TOP