0

製品を注文するためのドロップダウン/選択リストがある Wordpress サイトで作業しています。

私は本当にこれをうまくスタイリングしたいと思っており、使用したいcodropsのおかげでかなり良いスタイルのセットを見つけました.

ただし、このための HTML は、標準の選択ではなく UL LI リストを使用します。

次のコードを試して変換する必要があります。

<select name="orderby" class="orderby">
    <?php
        $catalog_orderby = apply_filters( 'woocommerce_catalog_orderby', array(
            'menu_order' => __( 'Default sorting', 'woocommerce' ),

        'popularity' => __( 'Sort by popularity', 'woocommerce' ),

        'rating'     => __( 'Sort by average rating', 'woocommerce' ),

        'date'       => __( 'Sort by newness', 'woocommerce' ),

        'price'      => __( 'Sort by price: low to high', 'woocommerce' ),

        'price-desc' => __( 'Sort by price: high to low', 'woocommerce' )
    ) );

    if ( get_option( 'woocommerce_enable_review_rating' ) == 'no' )
        unset( $catalog_orderby['rating'] );

    foreach ( $catalog_orderby as $id => $name )
        echo '<option value="' . esc_attr( $id ) . '" ' . selected( $orderby, $id, false ) . '>' . esc_attr( $name ) . '</option>';
?>

これに似たものに：

<div class="wrapper-dropdown">
    <span>I'm kinda the label!</span>
    <ul class="dropdown">
        <li>I'm hidden!</li>
        <li>Me too!</li>
        <li>So do I.</li>
    </ul>
</div>
4

1 に答える 1

2 
<div class="wrapper-dropdown">
    <span>I'm kinda the label!</span>
    <ul class="dropdown">
    <?php
        $catalog_orderby = apply_filters( 'woocommerce_catalog_orderby', array(
            'menu_order' => __( 'Default sorting', 'woocommerce' ),

        'popularity' => __( 'Sort by popularity', 'woocommerce' ),

        'rating'     => __( 'Sort by average rating', 'woocommerce' ),

        'date'       => __( 'Sort by newness', 'woocommerce' ),

        'price'      => __( 'Sort by price: low to high', 'woocommerce' ),

        'price-desc' => __( 'Sort by price: high to low', 'woocommerce' )
    ) );

    if ( get_option( 'woocommerce_enable_review_rating' ) == 'no' )
        unset( $catalog_orderby['rating'] );

    foreach ( $catalog_orderby as $id => $name )
        echo '<li>' . esc_attr( $name ) . '</li>';
?>

    </ul>
</div>

<option>エコーコードをエコーコードで<li>切り替えるだけです

于 2013-08-09T17:33:21.423 に答える