22
Th4
Th4
Mở file functions.php trong child theme của bạn (nếu chưa có child theme, bạn nên tạo child theme để tránh mất thay đổi khi update theme). Thêm đoạn code sau:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
add_filter( 'woocommerce_get_availability', 'webdy_custom_out_of_stock', 1, 2 ); function webdy_custom_out_of_stock( $availability, $_product ) { if ( ! $_product->is_in_stock() ) { // Hotline button HTML $hotline = '<a class="webdy-hotline-out-of-stock" href="tel:0902299161" target="_blank">'; $hotline .= '<i class="fa fa-phone" aria-hidden="true"></i> Gọi ngay: 090.22.99.161</a>'; // Thêm CSS nội tuyến 1 lần duy nhất (nếu chưa chèn) if ( ! wp_script_is( 'webdy-hotline-style', 'done' ) ) { add_action( 'wp_footer', function() { echo '<style id="webdy-hotline-style"> .webdy-hotline-out-of-stock { padding: 10px 25px; font-size: 1rem; font-weight: bold; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; border-radius: 10px; background-color: #fff; color: #000; position: relative; z-index: 1; overflow: hidden; } .webdy-hotline-out-of-stock::before { content: ""; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; background: linear-gradient(45deg, red, orange, yellow, green, cyan, blue, violet, red); background-size: 400%; z-index: -1; animation: rainbow 5s linear infinite; border-radius: 12px; } .webdy-hotline-out-of-stock:hover { color: #fff; background-color: #000; } @keyframes rainbow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } </style>'; }); wp_script_add_data( 'webdy-hotline-style', 'group', 1 ); // đánh dấu đã chèn } $availability['availability'] = $hotline; } return $availability; } |
