Archivos de Etiquetas: #conceptos #wordpress #woocommerce #shortcodes #css

Definir el País y el Estado al finalizar la compra (checkout)

En el siguiente ejemplo crearemos dos funciones que nos ayudará a definir el País y el Estado al finalizar la compra (checkout) en WooCommerce

Asegúrate de insertar el código en el archivo functions.php del tema activo en tu sitio web.

add_filter( 'default_checkout_state', 'change_default_checkout_state' ); 
function change_default_checkout_state() {
  return 'Distrito Federal'; // Default state code
}
 
add_filter( 'default_checkout_country', 'change_default_checkout_country' );
function change_default_checkout_country() {
  return 'MX'; // Default country code
}

Si deseas más información sobre como desarrollar en

WooCommerce

, visita el Codex oficial de WooCommerce haciendo clic aquí.

Si necesitas consultoría sobre

WooCommerce

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Insertar un mapa de Google Maps como imagen

En el siguiente ejemplo crearemos una función que nos ayudará a crear un «shortcode» que utilizaremos para insertar un mapa de Google Maps como imagen en nuestro sitio creado en WordPress

Asegúrate de insertar el código en el archivo functions.php del tema activo en tu sitio web.

function smp_map_it_atts($atts,$content=null)
{  
	$atts = shortcode_atts( array( 'width' => '640', 'height' => '640', 'title' => 'Mi mapa', 'address' => 'Ciudad de México, centro', 'zoom' => '13' ), $atts, 'map-it-atts');
	$base_map_url = 'http://maps.google.com/maps/api/staticmap?sensor=false&size=640x640&format=png&center=';
	return '
	<h2>' . esc_html( $atts['title'] ) . '</h2>
	<div id="map-it-atts" style="width:' . esc_html($atts['width']) . 'px;height:' . esc_html($atts['height']) . 'px;max-width:640px;background:url('. $base_map_url . urlencode($atts['address']) . '&zoom='. urlencode($atts['zoom']) . '&markers=size:mid%7Ccolor:red%7Clabel:%7C' . urlencode($atts['address']) .') no-repeat center center; display:inline-block;" ></div>';
}
add_shortcode('map-it-atts','smp_map_it_atts');
Como se inserta el shortcode:

[map-it-atts width="480" height="320" title="Google Maps" address="Barcelona, España" zoom="16"]

Si deseas más información sobre como desarrollar en

WordPress en español

, visita el Codex oficial de WordPress haciendo clic aquí.

Si necesitas consultoría sobre

WordPress

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Excluir una categoría del blog en la página de inicio (home)

En el siguiente ejemplo crearemos una función que nos ayudará a excluir una categoría del blog en la página de inicio (home) de nuestro sitio web, pero será pública en todas las demás secciones de nuestro sitio web desarrollado en WordPress.

function exclude_cat( $wp_query ) {   
    if( !is_admin() && is_main_query() && is_front_page() ) {
        $wp_query->set( 'cat', '-15'); //id de nuestra categoría
    }
}
add_action( 'pre_get_posts', 'exclude_cat' );

Si deseas más información sobre como desarrollar en

WordPress en español

, visita el Codex oficial de WordPress haciendo clic aquí.

Descargar WordPress del repositorio oficial para México:haciendo clic aquí.
Repositorio oficial de Plugins para WordPress: haciendo clic aquí.
Repositorio oficial de temas gratuitos para WordPress: haciendo clic aquí.

Si necesitas consultoría sobre

WordPress

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Añadir target=»_blank» a todos los enlaces

En el siguiente ejemplo crearemos una función que nos ayudará a añadir target=»_blank» a todos los enlaces (lo cual hará que todos los enlaces se habrán en una pestaña nueva en el navegador).

function target_blank($text) {
	$return = str_replace('<a', '<a target="_blank"', $text);
	return $return;
}
add_filter('the_content', 'target_blank');

Si deseas más información sobre como desarrollar en

WordPress en español

, visita el Codex oficial de WordPress haciendo clic aquí.

Descargar WordPress del repositorio oficial para México:haciendo clic aquí.
Repositorio oficial de Plugins para WordPress: haciendo clic aquí.
Repositorio oficial de temas gratuitos para WordPress: haciendo clic aquí.

Si necesitas consultoría sobre

WordPress

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Agregar un campo personalizado en los productos

En el siguiente ejemplo crearemos varias funciones que nos ayudarán a agregar un campo personalizado en los productos de WooCommerce con el uso de varias acciones. Para este ejemplo en particular agregaré el campo «Marca» debajo del precio que se muestra en los productos.

Asegúrate de insertar el código en el archivo functions.php del tema activo en tu sitio web.

Creamos el campo y lo añadimos al formulario de productos (en la pestaña «General»):

add_action( 'woocommerce_product_options_general_product_data', 'wc_custom_add_custom_fields' );
function wc_custom_add_custom_fields() {
    woocommerce_wp_text_input( array(
        'id' => '_custom_text_field',
        'label' => 'Marca del producto',
        'description' => 'Escribe la marca del producto.',
        'desc_tip' => 'true',
        'placeholder' => 'Marca del producto'
    ) );
}

Guardamos la información:

add_action( 'woocommerce_process_product_meta', 'wc_custom_save_custom_fields' );
function wc_custom_save_custom_fields( $post_id ) {
    if ( ! empty( $_POST['_custom_text_field'] ) ) {
        update_post_meta( $post_id, '_custom_text_field', esc_attr( $_POST['_custom_text_field'] ) );
    }
}

Imprimimos el campo debajo del precio:

function themeprefix_custom_price_message( $price ) { 
 global $post;
 $product_id = $post->ID;
 $marca = get_post_meta( get_the_ID(), '_custom_text_field', true );
 return $price . '<span class="price-description"></span>' . '<br>' . '<span> Marca: '  .  $marca  . '</span>';
}
add_filter( 'woocommerce_get_price_html', 'themeprefix_custom_price_message' );

Si deseas más información sobre como desarrollar en

WooCommerce

, visita el Codex oficial de WooCommerce haciendo clic aquí.

Si necesitas consultoría sobre

WooCommerce

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Mostrar un contenido a usuarios no registrados

En el siguiente ejemplo crearemos una función que nos ayudará a crear un «shortcode» que utilizaremos para mostrar un contenido solo a los usuarios que no estan registrados en nuestro sitio creado en WordPress

Asegúrate de insertar el código en el archivo functions.php del tema activo en tu sitio web.

function contenido_no_usuarios($attr, $content = null) {
	extract(shortcode_atts(array(
		'deny' => '',
	), $attr));
	if ((!is_user_logged_in() && !is_null($content)) || is_feed()) return $content;
	return $deny;
}
add_shortcode('contenido_no_usuarios', 'contenido_no_usuarios');
Como se inserta el shortcode:

[contenido_no_usuarios deny="Este contenido solo es para usuarios no registrados"]Lorem ipsum dolor sit amet[/contenido_no_usuarios]

Si deseas más información sobre como desarrollar en

WordPress en español

, visita el Codex oficial de WordPress haciendo clic aquí.

Si necesitas consultoría sobre

WordPress

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Mostrar un contenido solo a usuarios registrados

En el siguiente ejemplo crearemos una función que nos ayudará a crear un «shortcode» que utilizaremos para mostrar un contenido solo a los usuarios registrados en nuestro sitio creado en WordPress

Asegúrate de insertar el código en el archivo functions.php del tema activo en tu sitio web.

function contenido_para_usuarios($attr, $content = null) {
	extract(shortcode_atts(array(
		'cap'  => 'read',
		'deny' => '',
	), $attr));
	if (current_user_can($cap) && !is_null($content) && !is_feed()) return $content;
	return $deny;
}
add_shortcode('contenido_para_usuarios', 'contenido_para_usuarios');
Como se inserta el shortcode:

[contenido_para_usuarios cap="read" deny="Contenido solo para usuarios registrados"]Lorem ipsum dolor sit amet[/contenido_para_usuarios]

Si deseas más información sobre como desarrollar en

WordPress en español

, visita el Codex oficial de WordPress haciendo clic aquí.

Si necesitas consultoría sobre

WordPress

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Agregar un texto personalizado al lado del precio en WooCommerce

En el siguiente ejemplo crearemos una función que nos ayudarán a agregar un texto personalizado al lado del precio que muestran los productos en WooCommerce

Asegúrate de insertar el código en el archivo functions.php del tema activo en tu sitio web.

function custom_price_message( $price ) { 
	global $post;
 	$product_id = $post->ID;
 	$textafter = ' (IVA incluido)'; //texto que vamos agregar
 	return $price . '<span class="textafter">' . $textafter . '</span>'; //class textafter para el CSS
}
add_filter( 'woocommerce_get_price_html', 'custom_price_message' );

Si deseas más información sobre como desarrollar en

WooCommerce

, visita el Codex oficial de WooCommerce haciendo clic aquí.

Si necesitas consultoría sobre

WooCommerce

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Redireccionar solo el móvil (smartphones) hacia una página interna

En el siguiente ejemplo crearemos una función que nos ayudará a redireccionar solo el móvil (smartphones) hacia una página interna de nuestro sitio web cuando se ingresa desde la página de inicio (home).

function mobile_home_redirect(){
	if (!empty($_SERVER['HTTP_USER_AGENT'])
        && false !== strpos($_SERVER['HTTP_USER_AGENT'], 'iPad') //removemos tablets iOS
		|| false !== strpos($_SERVER['HTTP_USER_AGENT'], 'Tablet') //removemos tablets Android
    ) {return false;}
elseif( wp_is_mobile() && is_front_page() ){ //si es móvil y la página de inicio
   wp_redirect( '/movil' ); //nombre de la página
    exit;
}
}
add_action( 'template_redirect', 'mobile_home_redirect' );

Si deseas más información sobre como desarrollar en

WordPress en español

, visita el Codex oficial de WordPress haciendo clic aquí.

Descargar WordPress del repositorio oficial para México:haciendo clic aquí.
Repositorio oficial de Plugins para WordPress: haciendo clic aquí.
Repositorio oficial de temas gratuitos para WordPress: haciendo clic aquí.

Si necesitas consultoría sobre

WordPress

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css

Agregar un campo personalizado al formulario de pago en WooCommerce

En el siguiente ejemplo crearemos varias funciones que nos ayudarán a agregar un campo personalizado al formulario de pago en WooCommerce con el uso de varias acciones. Para este ejemplo en particular agregaremos el RFC (Identificación tributaria para México) por si el cliente requiere factura.

Asegúrate de insertar el código en el archivo functions.php del tema activo en tu sitio web.

Creamos el campo y lo añadimos al formulario de pago (antes de las notas):

add_action( 'woocommerce_before_order_notes', 'my_rfc_checkout_field' );
function my_rfc_checkout_field( $checkout ) {
    echo '<div id="my_rfc_checkout_field"><h3>' . __('Detalles del cliente') . '</h3>';
    woocommerce_form_field( 'my_field_rfc', array(
        'type'          => 'text',
        'class'         => array('my-field-rfc-class form-row-wide'),
        'label'         => __('RFC*'),
        'placeholder'   => __('Ingresa el rfc'),
        ), $checkout->get_value( 'my_field_rfc' ));

    echo '</div>';
}

Asignamos una restricción para que nuestro campo sea obligatorio (solo en caso de que así sea):

add_action('woocommerce_checkout_process', 'my_rfc_checkout_field_process');
function my_rfc_checkout_field_process() {
    if ( ! $_POST['my_field_rfc'] )
        wc_add_notice( __( 'Por favor ingresa el RFC.' ), 'error' );
}

Insertamos el RFC al pedido del cliente:

add_action( 'woocommerce_checkout_update_order_meta', 'my_rfc_checkout_field_update_order_meta' );
function my_rfc_checkout_field_update_order_meta( $order_id ) {
    if ( ! empty( $_POST['my_field_rfc'] ) ) {
        update_post_meta( $order_id, 'RFC', sanitize_text_field( $_POST['my_field_rfc'] ) );
    }
}

Mostramos el RFC en el pedido:

add_action( 'woocommerce_admin_order_data_after_billing_address', 'my_rfc_checkout_field_display_admin_order_meta', 10, 1 );
function my_rfc_checkout_field_display_admin_order_meta($order){
    echo '<p><strong>'.__('RFC').':</strong> ' . get_post_meta( $order->id, 'rfc', true ) . '</p>';
}

Mostramos el RFC en los correos del pedido:

add_filter('woocommerce_email_order_meta_keys', 'rfc_select_order_meta_keys');
function rfc_select_order_meta_keys( $keys ) {
	$keys['RFC'] = 'rfc';
	return $keys;
	
}

Si deseas más información sobre como desarrollar en

WooCommerce

, visita el Codex oficial de WooCommerce haciendo clic aquí.

Si necesitas consultoría sobre

WooCommerce

envíame un correo a hola@dannydshore.com o haciendo clic aquí.

#conceptos #wordpress #woocommerce #shortcodes #css