Soporte » Plugins y Hacks » WooCommerce » Mostrar imagen variación sin tener que marcar talla

  • Resuelto elosecadero

    (@elosecadero)


    No consigo averiguar como mostrar la imagen de variación sin tener que seleccionar una talla, o otra opción seleccionar una talla por defecto, eso tan poco doy como hacerlo.
    He encontrado que se genera desde wc_dropdown_variation_attribute_options_html pero tampoco doy donde se encuetra esta funcion.
    https://secadero.es/wordpress_help/6123_Gaia1.jpg
    https://secadero.es/wordpress_help/6123_Gaia2.jpg
    Usa el plugin – YITH Ajax Product Filter

    He hecho una chapuza de forzalo a añadir una class con jquery pero igual la linea que hay que agregarlo que seria la option dentro de class=»sellect-wrap» no la reconoce el resto si pero esto no. Use este código:

    <script>
    (function($){
    
    $(‘.variations .value .sellect-wrap .option.text’).each(function(){
    alert($(this).attr(‘class’,’selected’));
    });
    
    })(jQuery);
    </script>

    El HTML que se genera con las variaciones:

    <div class="variations">
    	<div class="label">
    		<label for="pa_color">Color</label>
    	</div>
    	<div class="value">
    		<select id="pa_color" class="" name="attribute_pa_color" data-attribute_name="attribute_pa_color" data-show_option_none="yes" style="display: none;">
    			<option value="">Elige una opción</option>
    			<option value="curry" class="attached enabled">Curry</option>
    			<option value="maquillaje" class="attached enabled">Maquillaje</option>
    		</select>
    		<div class="sellect-wrap">
    			<div class="option image" data-toggle="tooltip" data-original-title="Curry" data-value="curry">
    				<span style="background-image:url("https://ladamajuanadelacueva.es/wp-content/uploads/2020/02/Natural_World_Mujer_Botas_Ecológicas_Gaia_6123_Curry-100×100.png&quot;)">
    				</span>
    			</div>
    			<div class="option image selected" data-toggle="tooltip" data-original-title="Maquillaje" data-value="maquillaje">
    				<span style="background-image:url("https://ladamajuanadelacueva.es/wp-content/uploads/2020/02/Natural_World_Mujer_Botas_Ecológicas_Gaia_6123_Maquillaje-100×100.png&quot;)">
    				</span>
    			</div>
    		</div>
    	</div>
    	<div class="label">
    		<label for="pa_talla">Talla</label>
    	</div>
    	<div class="value">
    		<select id="pa_talla" class="" name="attribute_pa_talla" data-attribute_name="attribute_pa_talla" data-show_option_none="yes" style="display: none;">
    			<option value="">Elige una opción</option>
    			<option value="36″ class="attached enabled">36</option>
    			<option value="37″ class="attached enabled">37</option>
    			<option value="38″ class="attached enabled">38</option>
    			<option value="39″ class="attached enabled">39</option>
    			<option value="40″ class="attached enabled">40</option>
    			<option value="41″ class="attached enabled">41</option>
    		</select>
    		<div class="sellect-wrap">
    			<div class="option text" data-toggle="tooltip" data-original-title="36″ data-value="36″>
    				<span>36</span>
    			</div>
    			<div class="option text selected" data-toggle="tooltip" data-original-title="37″ data-value="37″>
    				<span>37</span>
    			</div>
    			<div class="option text" data-toggle="tooltip" data-original-title="38″ data-value="38″>
    				<span>38</span>
    			</div>
    			<div class="option text" data-toggle="tooltip" data-original-title="39″ data-value="39″>
    				<span>39</span>
    			</div>
    			<div class="option text" data-toggle="tooltip" data-original-title="40″ data-value="40″>
    				<span>40</span>
    			</div>
    			<div class="option text" data-toggle="tooltip" data-original-title="41″ data-value="41″>
    				<span>41</span>
    			</div>
    		</div>
    		Clear all 
    	</div>
    </div>

    POR FAVOR ALGUNA IDEA NO SE POR DONDE ENDEREZARLO

    • Este debate fue modificado hace 2 años por elosecadero.
    • Este debate fue modificado hace 2 años por elosecadero.
    • Este debate fue modificado hace 2 años por Jose Luis. Razón: etiquetar código
Viendo 2 respuestas - de la 1 a la 2 (de un total de 2)
  • Moderador Jose Luis

    (@jose64)

    Hola

    La opción más sencilla es seleccionar una talla por defecto.

    Para seleccionar una talla por defecto (o cualquier otra opción por defecto) en el apartado Variaciones tienes la opción Valores por defecto del formulario: con un desplegable donde seleccionas la opción que quieras (por defecto pone Sin valor por defecto), de esta forma te aparecerá una talla preseleccionada y al escoger el color te pondrá directamente la imagen correspondiente.

    Si con esto queda aclarada tu consulta, por favor, recuerda comentarlo y cerrar el debate marcándolo como resuelto, de esta forma nos ayudas a mantener el foro al día.

    Iniciador del debate elosecadero

    (@elosecadero)

    Perfecto, muchas gracias por la ayuda.
    Claramente era mas sencillo de lo que yo me lo había planteado.
    @SecaderoC

Viendo 2 respuestas - de la 1 a la 2 (de un total de 2)
  • El debate ‘Mostrar imagen variación sin tener que marcar talla’ está cerrado a nuevas respuestas.