• <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
    <style>
    *{
      font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    }
    
      .container{
        display: flex;
        gap: 25px;
      }
    
      select{
        border-radius: 5px;
        padding: 6px;
        font-weight: bold;
        color: black;
      }
    </style>
    
    </head>
    <body>
    <div class="container">
      <div>
        <h3>Brand</h3>
        <select>
          <option value="actual value 1">Mercedes Benz</option>
          <option value="actual value 2">BMW</option>
          <option value="actual value 3">Audi</option>
        </select>
        <h3>Body</h3>
        <select>
          <option value="actual value 1">Coupe</option>
          <option value="actual value 2">SUV</option>
          <option value="actual value 3">City Car</option>
        </select>
      </div>
      <div>
        <h3>Fashion model</h3>
        <select>
          <option value="actual value 1">Sedan</option>
          <option value="actual value 2">Sports</option>
          <option value="actual value 3">Offroad</option>
        </select>
        <h3>Fuel</h3>
        <select>
          <option value="actual value 1">Petrol</option>
          <option value="actual value 2">Diesel</option>
          <option value="actual value 3">Electric</option>
          <option value="actual value 3">Hybrid</option>
        </select>
      </div>
      <div>
        <h3>Price(maximum)</h3>
        <select>
          <option value="actual value 1">€15000</option>
          <option value="actual value 2">€12000</option>
          <option value="actual value 3">€10000</option>
          <option value="actual value 3">€8000</option>
          <option value="actual value 3">€5000</option>
        </select>
        <h3>Contrusction year (year)</h3>
        <select>
          <option value="actual value 1">2022</option>
          <option value="actual value 2">2021</option>
          <option value="actual value 3">2020</option>
          <option value="actual value 2">2019</option>
          <option value="actual value 3">2018</option>
          <option value="actual value 2">2017</option>
          <option value="actual value 3">2016</option>
        </select>
      </div>
    </div>
    
    </body>
    </html>

    Ik heb bovenstaande code goed gekregen om te werken. Weet iemand hoe ik dit met wat er geselecteerd is kan laten zoeken naar de producten in Woocommerce?

1 reactie aan het bekijken (van in totaal 1)
  • Hoi,

    Dit is alleen de HTML, om het werkend te krijgen moet er een script aan gekoppeld worden. Er zijn genoeg plugins waarmee je een uitgebreide zoekfunctie voor WooCommerce kunt maken, zie bijvoorbeeld de WordPress plugin pagina.

    Guido

1 reactie aan het bekijken (van in totaal 1)
  • Het onderwerp ‘dropdown’ is gesloten voor nieuwe reacties.