設定路徑:版面>自訂CSS商店樣式。
語法如下:
/*電腦版*//*商品頁*/
/*加入購物車*/
body.product-product a#button-cart{
background:deepskyblue; /*背景顏色*/
color:linen; /*文字顏色*/
border:5px solid #c2e3ef !important; /*框線設定*/
}
/*直接購買*/
body.product-product #button-quick-checkout{
background:deepskyblue; /*背景顏色*/
color:linen; /*文字顏色*/
border:5px solid #c2e3ef; /*框線設定*/
}
/*手機版*//*商品頁*/
@media only screen and (max-width: 768px), only screen and (max-device-width: 667px) and (min-device-width: 375px) and (orientation: portrait), only screen and (max-device-width: 736px) and (min-device-width: 414px) and (orientation: portrait) {
/*加入購物車*/
body.product-product a#button-cart{
background:#ff0068; /*背景顏色*/
color:linen; /*文字顏色*/
border:5px solid #c2e3ef !important; /*框線設定*/
}
/*直接購買*/
body.product-product #button-quick-checkout{
background:#ff8300; /*背景顏色*/
color:linen; /*文字顏色*/
border:5px solid #c2e3ef; /*框線設定*/
}
}
----------------------------------------------------------
【同場加映】
/*下一步|計算運費*/
.checkout-cart #button-next-checkout {
background:#000;
border-color:#000;
}
/*下一步|進行結帳*/
#terms-wrapper #button-payment-method{
background:#000;
border-color:#000;
}