viernes, 2 de septiembre de 2016

Botón leer más con Jquery

Aquí pego un fragmento de un botón de leer más que hemos hecho:
Explicar que el texto viene oculto desde el div con  id  #panel.


<strong>Prodimex Global</strong> es una empresa zapatera ubicada en Logroño (España). Ha desarrollado la marca <strong>ORIOCX</strong>, dedicada a la fabricación de <em><b><u>calzado montaña</u></b></em> para actividades al aire libre.

Los productos que presenta <strong>ORIOCX</strong> son el fruto de una larga experiencia en la fabricación de <strong><i><u>calzado</u></i></strong> de calidad que se remonta a 1948.

<strong>ORIOCX</strong> fabrica un <strong><i><u>calzado montaña</u></i></strong> cómodo y práctico para disfrutar al máximo de la actividad junto a la naturaleza.

Este <strong><i><u>zapato montaña</u></i></strong> está pensado para practicar trekking, travesía, trail running, backpacking, caza o para uso cotidiano.

Podemos encontrar <strong><i><u>botas</u></i></strong>, <strong><i><u>zapatos</u></i></strong>, <strong><i><u>deportivos</u></i></strong> y <strong><i><u>sandalias</u></i></strong>.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
 $("#panel p").hide()
    $("button").click(function(){
        $("#panel p").slideToggle(1000, function(){
        });
    });
});
</script>

<style>
#panel, #flip {
    text-align: center;
padding: 5px;
}

#panel {
    padding: 50px;
    display: none;
}
</style>
<button>Leer más</button>
<div id="panel">
<p><strong>ORIOCX</strong> trabaja en investigar y diseñar un <em><b><u>calzado montaña</u></b></em> tecnológicamente avanzado con materiales de primera calidad.

<strong>X-System,</strong> es un sistema de protección y sujeción en la zona del maléolo que permite realizar travesías por todo tipo de terrenos, aportando a los<span class="apple-converted-space"> </span><strong><i><u>zapatos montaña</u></i></strong><span class="apple-converted-space"> </span>una sujeción extra.

<strong>ULTRA LIGHT System, </strong>el uso de innovadores materiales ligeros permite crear unos <em><b><u>zapatos</u></b></em><em><u> </u></em><strong><i><u>montaña</u></i></strong> con los que se puede andar más cómodo y ligero.

<strong>Ocx2-Dry, </strong>gracias a componentes probados y controlados, y a un concepto de ensamble específico, estos <em><b><u>zapatos montaña</u></b></em> son impermeables y transpirables. La membrana Ocx2-Dry asegura una impermeabilidad duradera al <strong><i><u>calzado montaña</u></i></strong>, permitiendo la evacuación de la humedad. El cuero es naturalmente transpirable y tratado hidrófobo. Membrana OCX2DRY formada por 70% poliéster y 30% poliéter.

Forro <em><b>SYMPATEX,</b></em> se trata de una membrana ecológica de cinco micras de espesor laminada sobre base textil, que protege contra la humedad. Sus componentes hidrofílicos atraen el agua y absorben la humedad (transpiración), expulsándola desde el interior hacia el exterior, asegurando al <em><b><u>calzado montaña</u></b></em> un control óptimo del clima interno al tiempo que repele el agua.</p>
</div>

miércoles, 31 de agosto de 2016

Mostrar precio variación seleccionada

Este otro lo encontré en Stack Overflow, cuantas veces nos has salvavo el culo oh estimada Stack Overflow? demasiadas, y espero que siga siendo así por mucho más tiempo. La mejor página para pedir socorro cuando las cosas no salen como queremos....

El precio lo muestra en el desplegable de las variaciones, mostrando el precio de cada una de ellas.

// Mostrar precio de la variacion escogida en el desplegable de variaciones

add_filter( 'woocommerce_variation_option_name', 'display_price_in_variation_option_name' );

function display_price_in_variation_option_name( $term ) {
    global $wpdb, $product;

    if ( empty( $term ) ) return $term;
    if ( empty( $product->id ) ) return $term;

    $result = $wpdb->get_col( "SELECT slug FROM {$wpdb->prefix}terms WHERE name = '$term'" );

    $term_slug = ( !empty( $result ) ) ? $result[0] : $term;

    $query = "SELECT postmeta.post_id AS product_id
                FROM {$wpdb->prefix}postmeta AS postmeta
                    LEFT JOIN {$wpdb->prefix}posts AS products ON ( products.ID = postmeta.post_id )
                WHERE postmeta.meta_key LIKE 'attribute_%'
                    AND postmeta.meta_value = '$term_slug'
                    AND products.post_parent = $product->id";

    $variation_id = $wpdb->get_col( $query );

    $parent = wp_get_post_parent_id( $variation_id[0] );

    if ( $parent > 0 ) {
         $_product = new WC_Product_Variation( $variation_id[0] );
         return $term . ' (' . wp_kses( woocommerce_price( $_product->get_price() ), array() ) . ')';
    }
    return $term;

}


Código para mostrar Desde X (menor precio de todas las variaciones de ese producto)

 
En woodemia he encontrado este código que te permite que en vez de mostrar el rango de precios
salga Desde x, el autor original de este código es el magnífico gerhardpotgieter: 
 
/**
 * Use WC 2.0 variable price format, now include sale price strikeout
 *
 * @param  string $price
 * @param  object $product
 * @return string
 */
function wc_wc20_variation_price_format( $price, $product ) {
    // Main Price
    $prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
    $price = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

    // Sale Price
    $prices = array( $product->get_variation_regular_price( 'min', true ), $product->get_variation_regular_price( 'max', true ) );
    sort( $prices );
    $saleprice = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

    if ( $price !== $saleprice ) {
        $price = '<del>' . $saleprice . '</del> <ins>' . $price . '</ins>';
    }
    
    return $price;
}
add_filter( 'woocommerce_variable_sale_price_html', 'wc_wc20_variation_price_format', 10, 2 );
add_filter( 'woocommerce_variable_price_html', 'wc_wc20_variation_price_format', 10, 2 );

jueves, 25 de agosto de 2016

Opción en el desplegable de ordenador por número de referencia (SKU)

// Para ordenador por numero de referencia (Código de Beka Rice https://www.skyverge.com/ )

/**
 * Adds the ability to sort products in the shop based on the SKU
 * Can be combined with tips here to display the SKU on the shop page: https://www.skyverge.com/blog/add-information-to-woocommerce-shop-page/
 */

function sv_add_sku_sorting( $args ) {

    $orderby_value = isset( $_GET['orderby'] ) ? wc_clean( $_GET['orderby'] ) : apply_filters( 'woocommerce_default_catalog_orderby', get_option( 'woocommerce_default_catalog_orderby' ) );

    if ( 'sku' == $orderby_value ) {
        $args['orderby'] = 'meta_value';
            $args['order'] = 'asc';
            // ^ lists SKUs alphabetically 0-9, a-z; change to desc for reverse alphabetical
        $args['meta_key'] = '_sku';
    }

    return $args;
}
add_filter( 'woocommerce_get_catalog_ordering_args', 'sv_add_sku_sorting' );


function sv_sku_sorting_orderby( $sortby ) {
    $sortby['sku'] = 'Sort by SKU';
    // Change text above as desired; this shows in the sorting dropdown
    return $sortby;
}
add_filter( 'woocommerce_catalog_orderby', 'sv_sku_sorting_orderby' );
add_filter( 'woocommerce_default_catalog_orderby_options', 'sv_sku_sorting_orderby' );

martes, 9 de agosto de 2016

Añadiendo el SKU a la página de detalles de productos

Para que se visualice el SKU de un producto en su página de detalles del producto es tan simple como añadir el siguiente código en el archivo functions.php que se encuentra localizado en tu theme correspondiente

add_action( 'woocommerce_single_product_summary', 'dev_designs_show_sku', 5 );
function dev_designs_show_sku(){
    global $product;
    echo 'SKU: ' . $product->get_sku();
}
 
Si quieres puedes personalizar el texto cambiando la línea de echo, yo lo he dejado de 
la siguiente manera :

add_action( 'woocommerce_single_product_summary', 'dev_designs_show_sku', 5 );
function dev_designs_show_sku(){
    global $product;
    echo 'Referencia producto: ' . $product->get_sku();
}
 
Así en vez de SKU que sonará raro a los clientes se les mostrará Referencia de producto, algo 
mucho más intuitivo :) 

Resolviendo problemas rarunos gracias a las herramientas de desarrollador de Mozilla Firefox

Llevaba un par de días que me ocurría algo extraño... en una de las página cuando entraba a una categoría no cargaba bien las imágenes, es más, cargaba la primera y tras dos segundos cargaba el resto.
Tras muchas pruebas y muchos comederos de cabeza decidí hacer lo que tenía que haber hecho desde un principio: usar el inspector de Firefox.
Tras echar un vistazo en la sección de red me dí cuenta de que cuando tenía que cargar un CSS no lo localizaba (error 404) así que mira cual era y lo subí de nuevo. Error solucionado y todo funcionando correctamente.
La pregunta que me hago ahora es... ¿y cómo es que había desaparecido? ¿actualización mal hecha? ¿Polstergeist? Misterios de la ciencia y el vudú...

martes, 19 de julio de 2016

Hostings, transferencias de dominio, y DNS locas xDDD

Esta tarde nos ha pasado algo bastante curioso pero simple a la vez, tras pedir una transferencia de dominio de un proveedor a otro, nos aparecería la página de redirección de cuando estaba en el otro servidor... pero no aparecía en ninguna parte en el nuevo servidor.
Tras un rato trasteando y buscando pasamos a la acción.
De la manera más simple, empezamos comprobando mediante un ping al dominio si este apuntaba al antiguo o al nuevo servidor, la respuesta fue al nuevo.
Tras esto decidimos probar a borrar los datos de navegación del navegador y ahi estaba el problema, el muy simpatico nos cargaba la página de la cache en vez de descargar la nueva dirección.