WooCommerce 结帐页面自定义，如何在选项卡中打开付款方式？

Question

我需要完全自定义付款页面。它应该看起来像屏幕截图：

我能够在左侧显示产品名称及其图像。但是无法将付款方式的单选按钮作为选项卡放置。因此：

 <div class="checkout__product-details">
                    <?php
                        foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
                            $_product   = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
                            $product_id = apply_filters( 'woocommerce_cart_item_product_id', $cart_item['product_id'], $cart_item, $cart_item_key );
                            if ( $_product && $_product->exists() && $cart_item['quantity'] > 0 && apply_filters( 'woocommerce_cart_item_visible', true, $cart_item, $cart_item_key ) ) {
                                $product_permalink = apply_filters( 'woocommerce_cart_item_permalink', $_product->is_visible() ? $_product->get_permalink( $cart_item ) : '', $cart_item, $cart_item_key );
                            }
                        }
                        $thumbnail = apply_filters( 'woocommerce_cart_item_thumbnail', $_product->get_image(), $cart_item, $cart_item_key );
                    ?>
                    <figure>
                        <?php
                            if ( !$product_permalink ) {
                                echo $thumbnail;
                            } else {
                                printf(  $thumbnail );
                            }
                        ?>
                    </figure>
                    <h3 class="checkout__product-title">
                        <?php
                            if ( ! $product_permalink ) {
                                echo wp_kses_post( apply_filters( 'woocommerce_cart_item_name', $_product->get_name(), $cart_item, $cart_item_key ) . '&nbsp;' );
                            } else {
                                echo wp_kses_post( apply_filters( 'woocommerce_cart_item_name', sprintf( $_product->get_name()) ) );
                            }
                        ?>
                    </h3>
                    <div class="total__price">
                        <?php if ($_product->get_sale_price() == true): ?>
                            <?php echo $_product->get_sale_price(); ?> <span>руб</span>
                        <?php elseif($_product->get_sale_price() !== false): ?>
                            <?php echo $_product->get_regular_price(); ?> <span>руб</span>
                        <?php endif; ?>
                    </div>
                </div>

但付款方式不适合这种操纵。我只看到一种使用方式 jQuery 为此目的。使用 jQuery，我可以在页面的一个部分隐藏元素并在另一个部分显示它们+我认为这应该有效的一些样式。但这可能不是最好的解决方案。如果您提供有关如何正确解决此问题的帮助和提示，我将不胜感激。