{"id":25872,"date":"2023-09-05T22:53:00","date_gmt":"2023-09-05T13:53:00","guid":{"rendered":"https:\/\/motoki-design.co.jp\/wordpress\/?p=25872"},"modified":"2024-09-05T22:54:18","modified_gmt":"2024-09-05T13:54:18","slug":"woocommerce-customize","status":"publish","type":"post","link":"https:\/\/motoki-design.co.jp\/wordpress\/woocommerce-customize\/","title":{"rendered":"WooCommerce\u306e\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u307e\u3068\u3081"},"content":{"rendered":"\n

WooCommerce\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u4f7f\u3063\u305fEC\u30b5\u30a4\u30c8\u5236\u4f5c\u3067\u3001\u3044\u304f\u3064\u304b\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3092\u3057\u305f\u306e\u3067\u3001\u305d\u306e\u5099\u5fd8\u9332\u3067\u3059\u3002<\/p>\n\n\n\n

WooCommerce\u3067\u5546\u54c1\u30ae\u30e3\u30e9\u30ea\u30fc\u306e\u5217\u6570\u30925\u5217\u306b\u8a2d\u5b9a<\/h2>\n\n\n\n

WooCommerce\u3067\u5546\u54c1\u30ae\u30e3\u30e9\u30ea\u30fc\u306e\u5217\u6570\u3092\u5909\u3048\u308b\u5834\u5408\u306e\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3067\u3059\u3002<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
function custom_woocommerce_gallery_columns() {\n    return 5; \/\/ \u30ae\u30e3\u30e9\u30ea\u30fc\u306e\u5217\u6570\u30925\u5217\u306b\u8a2d\u5b9a\n}\nadd_filter('woocommerce_product_thumbnails_columns', 'custom_woocommerce_gallery_columns');<\/code><\/pre><\/div>\n\n\n\n
CSS\u3002<\/p>\n\n\n\n
flex\u3092\u4f7f\u3063\u305f\u65b9\u304c\u7dba\u9e97\u306b\u4f59\u767d\u3092\u8abf\u6574\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n
\u3042\u3068\u306f\u9078\u629e\u4e2d\u306e\u3082\u306e\u3060\u3051\u8584\u304f\u8868\u793a\u306b\u3057\u305f\u65b9\u304c\u898b\u3084\u3059\u3044\u3067\u3059\u3002<\/p>\n\n\n\n
.wp-block-woocommerce-cart {\n    max-width: 100% !important;\n    margin-left: auto !important;\n    margin-right: auto !important;\n    position: relative !important;\n    left: 50% !important;\n    transform: translateX(-50%) !important;\n}\n.flex-control-nav.flex-control-thumbs {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n    gap: .3em;\n    margin: .3em 0 0 0 !important;\n}\n.woocommerce .flex-control-thumbs li {\n    width: calc((100% - 1.2em) \/ 5);\n    gap: 1em;\n    float: none;\n}\n\/* \u9078\u629e\u8868\u793a\u72b6\u614b\u3092\u9006\u306b *\/\n.woocommerce .flex-control-thumbs li .flex-active, .woocommerce .flex-control-thumbs li img:hover {\n    opacity: .5;\n}\n.woocommerce .flex-control-thumbs li img {\n    opacity: 1;\n}<\/code><\/pre><\/div>\n\n\n\n
WooCommerce\u3067\u30b7\u30e7\u30c3\u30d7\u30da\u30fc\u30b8\u306b\u5728\u5eab\u72b6\u6cc1\u3092\u8868\u793a\u3059\u308b<\/h2>\n\n\n\n
\u30b7\u30e7\u30c3\u30d7\u30da\u30fc\u30b8\u30da\u30fc\u30b8\u306e\u5546\u54c1\u4e00\u89a7\u306b\u5728\u5eab\u72b6\u6cc1\u3092\u63b2\u8f09\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
function display_stock_status_in_shop_loop() {\n    global $product;\n\n    \/\/ \u5728\u5eab\u304c\u3042\u308b\u5834\u5408\n    if ( $product->is_in_stock() ) {\n        echo '<p class="stock in-stock">IN STOCK<\/p>';\n    }\n    \/\/ \u5728\u5eab\u304c\u306a\u3044\u5834\u5408\n    else {\n        echo '<p class="stock out-of-stock">SOLD OUT<\/p>';\n    }\n}\nadd_action('woocommerce_after_shop_loop_item', 'display_stock_status_in_shop_loop', 15);<\/code><\/pre><\/div>\n\n\n\n
\u898b\u305f\u76ee\u306f\u304a\u597d\u307f\u3067\u3002<\/p>\n\n\n\n
.stock.out-of-stock {\n    color: var(--wc-red);\n    margin: 8px 4px 4px 0;\n    border-radius: 2px;\n    letter-spacing: 0.05em;\n}<\/code><\/pre><\/div>\n\n\n\n
WooCommerce\u3067\u30ab\u30fc\u30c8\u30dc\u30bf\u30f3\u3092\u597d\u304d\u306a\u5834\u6240\u306b\u914d\u7f6e\u3059\u308b<\/h2>\n\n\n\n
\u30ab\u30fc\u30c8\u306b\u5165\u308c\u305f\u6570\u3092\u63b2\u8f09\u3057\u305f\u30ab\u30fc\u30c8\u30dc\u30bf\u30f3\u306f\u30d8\u30c3\u30c0\u30fc\u3084\u30b9\u30de\u30db\u306e\u30d5\u30a9\u30ed\u30ef\u30fc\u306e\u4e2d\u306b\u8868\u793a\u3057\u305f\u308a\u3059\u308b\u306e\u3067\u3001\u30b7\u30e7\u30fc\u30c8\u30b3\u30fc\u30c9\u5316\u3057\u3066\u3042\u3052\u308b\u3068\u4fbf\u5229\u3067\u3059\u3002<\/p>\n\n\n\n
\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u306b\u914d\u7f6e\u306a\u308a\u30d5\u30c3\u30af\u3067\u597d\u304d\u306a\u8868\u793a\u3059\u308b\u3053\u3068\u304c\u5bb9\u6613\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\/\/ \u30ab\u30fc\u30c8\u30dc\u30bf\u30f3\u306e\u307f\u3092\u8868\u793a\u3059\u308b\u5171\u901a\u95a2\u6570\nfunction display_cart_button() {\n    \/\/ WooCommerce\u304c\u6709\u52b9\u3067\u3001\u30ab\u30fc\u30c8\u304c\u5b58\u5728\u3059\u308b\u304b\u78ba\u8a8d\n    if ( function_exists( 'WC' ) && WC()->cart ) {\n        \/\/ \u30ab\u30fc\u30c8\u5185\u306e\u30a2\u30a4\u30c6\u30e0\u6570\u3092\u53d6\u5f97\n        $cart_count = WC()->cart->get_cart_contents_count(); \n        \/\/ \u30ab\u30fc\u30c8\u306eURL\u3092\u53d6\u5f97\n        $cart_url = wc_get_cart_url(); \n    } else {\n        \/\/ WooCommerce\u304c\u30ed\u30fc\u30c9\u3055\u308c\u3066\u3044\u306a\u3044\u5834\u5408\u3001\u307e\u305f\u306f\u30ab\u30fc\u30c8\u304c\u306a\u3044\u5834\u5408\n        $cart_count = 0;\n        $cart_url = '#'; \/\/ WooCommerce\u306e\u30ab\u30fc\u30c8\u30da\u30fc\u30b8\u3078\u306e\u30ea\u30f3\u30af\n    }\n\n    \/\/ \u30ab\u30fc\u30c8\u30dc\u30bf\u30f3\u306eHTML\u51fa\u529b\n    ob_start(); \/\/ \u51fa\u529b\u3092\u30d0\u30c3\u30d5\u30a1\u30ea\u30f3\u30b0\n    ?>\n    <div class="ark-block-button is-btn-fill" data-hover="bright" style="--arkb-btn-radius:8px">\n        <a class="ark-block-button__link" href="<?php echo esc_url( $cart_url ); ?>" data-has-icon="1">\n            <svg class="ark-block-button__icon -left" height="1em" width="1em" xmlns="http:\/\/www.w3.org\/2000\/svg" aria-hidden="true" data-icon="LsCart" viewBox="0 0 48 48">\n                <circle cx="37.5" cy="42.5" r="4"><\/circle>\n                <circle cx="13.5" cy="42.5" r="4"><\/circle>\n                <path d="M43.5 8.5H10.2l-.7-5.3c-.1-1-1-1.7-2-1.7h-5c-1.1 0-2 .9-2 2s.9 2 2 2h3.2l3.8 29.3c.1 1 1.7 2 2.7 2h29c1.1 0 2-.9 2-2s-.9-2-2-2H13.3l-.4-4h28.6c1 0 1.9-.8 2-1.8l2-16c.1-1.1-.8-2.2-2-2.2z"><\/path>\n            <\/svg>\n            <span class="ark-block-button__text">\u30ab\u30fc\u30c8 (<?php echo esc_html( $cart_count ); ?>)<\/span>\n        <\/a>\n    <\/div>\n    <?php\n    return ob_get_clean(); \/\/ \u30d0\u30c3\u30d5\u30a1\u30ea\u30f3\u30b0\u3092\u7d42\u4e86\u3057\u3001\u30d0\u30c3\u30d5\u30a1\u306e\u5185\u5bb9\u3092\u51fa\u529b\n}\n\n\/\/ \u30ab\u30fc\u30c8\u30dc\u30bf\u30f3\u3092\u30b7\u30e7\u30fc\u30c8\u30b3\u30fc\u30c9\u5316\nadd_shortcode('cart_button', 'display_cart_button');<\/code><\/pre><\/div>\n\n\n\n
\u30b7\u30e7\u30fc\u30c8\u30b3\u30fc\u30c9\u306f[[cart_button]]<\/code>\u3067\u8868\u793a\u3067\u304d\u307e\u3059\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"
WooCommerce\u306e\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u4f7f\u3063\u305fEC\u30b5\u30a4\u30c8\u5236\u4f5c\u3067\u3001\u3044\u304f\u3064\u304b\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3092\u3057\u305f\u306e\u3067\u3001\u305d\u306e\u5099\u5fd8\u9332\u3067\u3059\u3002 WooCommerce\u3067\u5546\u54c1\u30ae\u30e3\u30e9\u30ea\u30fc\u306e\u5217\u6570\u30925\u5217\u306b\u8a2d\u5b9a WooCommerce\u3067\u5546\u54c1\u30ae\u30e3\u30e9\u30ea\u30fc\u306e\u5217\u6570\u3092\u5909\u3048\u308b […]<\/p>\n","protected":false},"author":1,"featured_media":25877,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"pochipp_cv_data":"","swell_btn_cv_data":"","footnotes":""},"categories":[91],"tags":[],"area":[],"class_list":["post-25872","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-customize"],"_links":{"self":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts\/25872","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/comments?post=25872"}],"version-history":[{"count":1,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts\/25872\/revisions"}],"predecessor-version":[{"id":25878,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/posts\/25872\/revisions\/25878"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/media\/25877"}],"wp:attachment":[{"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/media?parent=25872"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/categories?post=25872"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/tags?post=25872"},{"taxonomy":"area","embeddable":true,"href":"https:\/\/motoki-design.co.jp\/wordpress\/wp-json\/wp\/v2\/area?post=25872"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}