Diseño Web

Compartir, Correo, Diseño Web, Gestores de contenidos

Cómo integrar MailChimp con WordPress

Muchas PYMES usan MailChimp para mandar newsletter a sus clientes. Es potente, fácil de usar y gratis para la mayoría. Aunque hay alternativas españolas. Y para muchas PYMES, la página web es el primer portal de acceso de sus clientes o visitantes. Así es tiene toda la lógica conectar ambos para mandar e-mails de propaganda (con su permiso evidentemente). Conectar ambos sistemas es una petición lógica. Más aún si se tiene una tienda con WooCommerce. Hoy os explicamos cómo hacerlo. Cómo conectar MailChimp con WordPress. Damos por supuesto que tienes una cuenta de MailChimp con una lista creada de clientes. Y quieres mantenerla actualizada con los clientes que se agreguen al newsletter de la web. Lo primero que tienes que hacer es instalar un plugin de WordPress para conectar tu cuenta de MailChimp con WordPress y poder usar los formularios para rellenear las listas. El más usado seguramente es MailChimp for WordPress. Este plugin lo hemos usado y es sencillo y potente. Para configurarlo sólo tienes que instalarlo, activarlo y, en su configuración, agregar una clave de API. Después puedes, en la sección de formularios del plugin, crear los formularios que necesites, o integrarlo a otros formularios (es compatible con los plugins más usados para formularios).Más información aquí. Pero además este plugin tiene añadidos que son muy interesante. Por ejemplo uno de Captcha, otro de pop-ups, y otros. Sobre todo hay uno que hemos usado y nos parece también importante mencionar: Mail Chimp User Sync. Este plugin sincroniza tus usuarios de WordPress con una lista de MailChimp. Necesita del plugin anterior para funcionar (para realizar la integración). Pero si tienes usuarios suscriptores o miembros de tu página, este es el plugin a usar. La sincronización es completa, al cambiar los datos de usuario se cambian en ambos sitios, al borra un usuario de WordPress se borra de MailChimp etc. Te permite sincronizar todos los roles, o roles específicos. Además te permite realizar un double-opt in para verificar los usuarios. Con estos añadidos, tu página estará totalmente sincronizada con tus listas de Mailchimp.

Diseño Web, Gestores de contenidos

YITH WooCommerce Product Bundles: plugin gratis para crear packs.

Cuando tienes una tienda en WooCommerce, y vendes productos, una de las cosas que quieres vender es packs de productos. Es decir un producto que incluya varios. En WooCommerce tal y como viene “de serie” no tiene opciones para crear packs. Los productos agrupados siguen siendo productos individuales.Existen plugins de pago muy buenos y con varias modalidades. Muchos de estos disponen de una versión gratis pero con limitaciones (como dejar sólo 3 productos).Afortunadamente hemos encontrado uno gratuito muy funcional. Plugin gratis para crear packs, bundles, de productos. YITH WooCommerce Product Bundles es un plugin con versión de pago y versión gratuita. La versión gratuita permite crear packs de productos con un número ilimitado de productos.La única limitación que tiene es que los packs sólo se pueden crear con productos simples (es decir no packs de packs). Pero en la mayoría de los casos esto no causa mayor problema. Lo hemos probado y es perfectamente funcional. Aquí tenéis (en inglés) cómo usarlo.

Diseño Web, Gestores de contenidos, Wordpress

Qué se necesita para tener una página web.

Hoy os dejamos un vídeo sobre algo muy básico: qué se necesita para tener una página web. Para tener una página web necesitamos básicamente tres cosas: Un dominio. Que debéis contratar con un proveedor. Recomendamos que lo compréis vosotros (que las facturas os llegue directamente a vosotros). Es vuestro nombre de marca, que no lo tenga otro (un informático etc). Evita problemas. Un alojamiento o hosting. Es alquilar un espacio web en un ordenador (servidor) en Internet para poner tu página. Suele incluir base de datos (la mayoría de las páginas ahora son dinámicas) y correo. Los precios varían dependiendo de los recursos. A hosting muy barato…web lenta o con problemas. Un gestor de contenidos (CMS). Un gestor de contenidos es un programa que se instala en el servidor y te permite manejar la página como cliente sin saber mucho (y tener usuarios, conectar con las redes sociales etc). El gestor a elegir depende del tipo de página web, aunque el más usado es WordPressl. Obviamente alguien tiene que instalar ese CMS, conectarlo con la base de datos, diseñar el aspecto y estructura de la página web. Eso es lo que se llama diseño de una página y necesitaremos un diseñador. Lo podemos hacer nosotros… pero para resultados óptimos mejor contrata un diseñador.

Diseño Web, Gestores de contenidos

Baja de versión plugins y temas de WordPress. WP Rollback

A todos los que llevamos páginas en WordPress nos ha pasado alguna vez. Actualizas un plugin o un tema a una versión superior…y ya deja de ser compatible con lo que tienes. La solución es tener backups…si. Pero, ¿y si no tienes?Hoy os hablamos de un plugin que te permite retroceder de versión tus temas y plugins. WP Rollback: plugin para retroceder de versión temas y plugins. Lo descubrimos hace unos días por un problema con un cliente. Con WP Rollback es muy sencillo solucionar temas de incompatibilidades al actualizar. Instala WP Rollback, y te añadirá una opción de menú llamada Rollback en cada plugin. Si la pinchas te deja elegir la versión a la que quieres “descender”. Escógela y pincha en aceptar a los avisos. Esto descarga la versión solicitada y la instala, reemplazando la que tienes. Muy muy útil. Eso si, como ellos advierten, haz siempre antes una copia de ficheros y base de datos por si acaso.

Diseño Web, Sistemas, Trucos

PhpMyAdmin timeout. Solución al importar bases de datos grandes.

Bueno, ponemos solución y debería ser una posible solución, ya que las causas pueden ser muchas. Una de las cosas que puede suceder cuando estemos importando bases de datos grandes con phpMyAdmin o con servidores mysql lentos es que nos de un error por agotamiento de tiempo de espera. Un timeout. Os dejamos la solución. PhpMyAdmin timeout. Solución al importar bases de datos grandes. Lo primero que tenéis que hacer es comprobar que los parámetros de php en el servidor no están muy restringidos. Esto está en el fichero de php.ini. Y podéis verlos con un phpinfo. Pero si estás aquí supongo que ya has probado eso. Lo que no creo que sepas (nosotros no lo sabíamos) es que phpMyAdmin tiene su propio timeout. Configurado a 300. Así que la idea es cambiar eso. Tienes que ir a /libraries/config.default.php   y editar ese archivo. En teoría (lo pone en un aviso) deberías editar el fichero /config.inc.php pero nosotros no lo teníamos así que editamos el primero. Hay que buscar la línea que pone $cfg[‘ExecTimeLimit’] = 300; y cambiarla a $cfg[‘ExecTimeLimit’] = 0; Lo que corresponde a tiempo ilimitado. Con eso, cuando lo guardes, verás que el phpMyadmin ya no dice que el script ha hecho un timeout. Seguramente lo siguiente que te salga es que “Mysql has gone away” porque el propio servidor de el timeout. En dicho caso, te recomiendo que lo subas por línea de comandos.  

Diseño Web, Gestores de contenidos, Trucos

Realizar pedidos desde el backend de WooCommerce en WordPress

A todos los clientes que tienen una tienda de WooCommerce en WordPress les guesta este “truco”. Cómo realizar pedidos desde el backend. Así pueden hacer pedidos por clientes que piden cosas presencialmente, o para aquellos que no se atreven a usar la página. También es útil para regalar productos a clientes con cupones descuento y que quede reflejado. Realizar pedidos desde el backend de WooCommerce en WordPress. El proceso es sencillo. Hay que ir al backend, a WooCommerce>Pedidos y ahí: Elegir el cliente al que queremos asignar el pedido. Seleccionar el estado en que queremos que se quede el pedido (Completado, Pendiente de pago…). Nota: si queremos mandar enlaces de pago por tarjeta, paypal etc hay que realizar el pedido desde el frontend con plugins para usar la web como un usuario. Asignarle los productos y las cantidades. Poner un coste de envío o un cargo por servicios. Recalcular el precio. Aplicar cupones si es necesario. Elegir si queremos que se notifique al cliente. Guardar el pedido En este vídeo os lo explicamos:

Diseño Web, Gráficos y Fotografía, Trucos

Convertir imágenes a Base64. Cómo y por qué

Esto es un truco muy interesante en ciertos casos. Coge una imagen y la convierte en código, el cual es puede poner en un html para mostrar directamente la imagen. Os enseñamos cuando y cómo hacerlo. Cuándo es interesante convertir imágenes a Base64. Básicamente en 3 situaciones. En firmas de correo que admitan html. El poner la imagen ahí como código y que no tenga que buscarla de otro sitio reduce la posibilidad de spam y facilita la carga. En ciertas ocasiones es la única manera porque no permiten subir imágenes (firma de Gmail). En páginas web que tengamos que poner imágenes pero no nos deje cargarlas de sitios de terceros o subirlas porque esté restringido. En tu página web cuando quieres reducir la carga de imágenes. Cuando una web abre una imagen el código es como este:<img src=”….”  title=”….” alt=”……..” />La web abre un proceso para cargar esa imagen desde ese src y esto gasta tiempo y procesador. Las imagenes en Base64 se cargan “incrustadas”, directamente desde código, y no tiene que abrir otro proceso ni gastar tanto tiempo. Cuando no es interesante. Las imágenes en Base64 aumentan el código, y no permiten etiquetas para SEO. Así que no es bueno hacerlo en todas. Sólo en ciertas como los favicon, iconos, logos pequeños, ciertos fondos en css o cualquiera que tarde mucho. También si se cargan desde sitios de terceros. No lo hagáis en imágenes grandes, el código sale larguísimo. Nosotros, por ejemplo, hemos puesto como ejemplo un logo grande, pero porque lo teníamos a mano. Nunca lo pondríamos tan grande en Base64. Cómo se hace. Lo mejor es usar un sitio web. Existen varios si buscas en Google, por ejemplo https://www.base64-image.de/ Ahí subes la imagen y te dará el código tanto para html como para css. Una imagen en Base64 en html se carga así: <img src=”data:image/gif;base64,……..” title=”Título” /> En CSS se pondría algo como: background: #FFF no-repeat center center url(“……”) En los puntos suspensivos se pone el código que te dan las webs anteriores.    

Diseño Web, Gestores de contenidos

Activar y crear cupones descuento en WooCommerce

Cuando tienes una tienda online, el uso de los cupones de descuento es una gran herramienta para premiar clientes, corregir errores o realizar promociones. WooCommerce dispone de esta opción de serie, pero no está activada. Os enseñamos a activar los cupones y configurarlos. Activar y crear cupones en WooCommerce. Lo primero que tenemos que hacer es activar los cupones. Para ello vamos, en el backend, a WooCommerce>Ajustes>General y bajamos hasta la mitad. Ahí veréis la opción para activar los cupones y podéis elegir si queréis que se apliquen secuenciales (uno detrás de otro). Esta última opción es cosa vuestra (a gusto vuestro), pero tenéis que activar los cupones, la primera opción. Después tenemos que crear los cupones. Para ello refrescamos (F5) y veremos que nos aparece una opción de Cupones en el menú de WooCommerce. Vamos ahí y creamos el cupón deseado. Existen muchas opciones. Cupones de porcentaje, de cantidad en el producto, en el carrito, restricciones de uso por producto, categoría, usuario, restricciones de veces que se usa, fecha de caducidad….. Conviene que las recorráis y comprendáis las opciones. Lo que a mi me confundía la primera vez es que el título del cupón es lo que ellos tienen que poner o en el carrito o al realizar al compra. Y la descripción lo que queráis para saber vosotros que cupón es. Aquí tenéis el vídeo con las instrucciones. Nota: Han cambiado el menú de cupones. Ahora aparece en Marketing->Cupones

Diseño Web, Gestores de contenidos, Trucos

Prestashop error 500 al entrar en el backend

Ayer un cliente vació la caché de Prestashop y, tras ese cambio “inofensivo”, ya no era posible entrar en el backend. “La página ….. no puede procesar esta solicitud ahora. Http Error 500“. Os contamos cómo lo solucionamos, por si os sirve de ayuda. Prestashop. Error 500 en el backend. Solución. Obviamente este error puede deberse a un montón de cosas…. cada caso es un mundo. Pero os damos algún consejo que podéis probar. Primero os dejaremos la causa y solución en nuestro caso, por si alguien quiere ir “directamente a la solución“. El error en los logs mencionaba el fichero /var/cache/prod/ContainerPbimghi/appProdProjectContainer.php  como menciona también estos posts: http://forge.prestashop.com/browse/BOOM-4676   y  https://www.prestashop.com/forums/topic/842833-http-error-500-al-quitar-el-modo-debug/ Aunque ellos optaron por borrar (por FTP) todo el contenido de /var/cache/prod/ (haced una copia antes) nosotros sólo borramos el fichero en cuestión y se solucionó. Todo parece relacionado con la caché que no se vacía correctamente. Así que podéis optar por vaciarla a mano o quitar sólo el fichero que os da problemas. Por ello seguid estos consejos: Al backend podréis acceder si activáis el modo debug. Desgraciadamente si lo desactiváis y no borráis la caché por FTP, aparece el error de nuevo. Por qué en modo debug deja y en producción no….no se. A menos que en debug no use caché. Por cierto, a nosotros no nos salieron errores en debug. Borrar la caché de nuevo por backend y no hacerlo a mano no arregla el problema. Siempre es bueno, si tenéis acceso, mirar los logs de apache del servidor. Ya sea generales o para ese dominio. Os da una idea de lo que está pasando. Afortunadamente el frontend sigue funcionando. Los usuarios no lo notan. Así que resumen: Activad modo debug para poder Borrar la caché a mano por FTP. Desactivar el modo debug y ver que todo ok.  

Diseño Web, Gestores de contenidos, Trucos

Ocultar categorías y productos de ciertas categorías en la tienda de WooCommerce

En ocasiones queremos ocultar ciertas categorías del listado de categorías de WooCommerce, o productos de la tienda. Por ejemplo la categoría Sin Categoría, o ciertas subcategorías que quieras sólo para algún cliente. Hoy os dejamos unos códigos para hacerlo. Ocultar categorías y productos de ciertas categorías en la tienda de WooCommerce. Como no es una funcionalidad de WooCommerce, que sólo deja ocultar ciertos productos, tenemos que implementar código. Para ello, como siempre, podemos editar el fichero functions.php de nuestra plantilla, preferiblemente hija, o (mejor) poner un Snippet. Os vamos a dejar dos. El primero quita la categoría del listado de categorías y del menú de categorías (widget) de la tienda. Pero los productos siguen apareciendo. /** * @snippet Hide Products From Specific Category @ Shop * @how-to Watch tutorial @ https://businessbloomer.com/?p=19055 * @sourcecode https://businessbloomer.com/?p=572 * @author Rodolfo Melogli * @testedwith WooCommerce 3.1.2 */ add_action( ‘woocommerce_product_query’, ‘bbloomer_hide_products_category_shop’ ); function bbloomer_hide_products_category_shop( $q ) { $tax_query = (array) $q->get( ‘tax_query’ ); $tax_query[] = array( ‘taxonomy’ => ‘product_cat’, ‘field’ => ‘slug’, ‘terms’ => array( ‘ponerslugaqui’ ), // Category slug here ‘operator’ => ‘NOT IN’ ); $q->set( ‘tax_query’, $tax_query ); } Fuente aquí. Recuerda que tienes que poner el slug de la categoría donde pongo ponerslugaqui. El segundo código oculta los productos del listado de productos de la tienda. Pero no quita la categoría del listado de categorías o del widget de categorías. Así que, en mi opinión, lo más completo es implementar ambos en el mismo Snippet. /** * Show products only of selected category. */ function get_subcategory_terms( $terms, $taxonomies, $args ) { $new_terms = array(); $hide_category = array( XXX ); // Ids of the category you don’t want to display on the shop page // if a product category and on the shop page if ( in_array( ‘product_cat’, $taxonomies ) && !is_admin() && is_shop() ) { foreach ( $terms as $key => $term ) { if ( ! in_array( $term->term_id, $hide_category ) ) { $new_terms[] = $term; } } $terms = $new_terms; } return $terms; } add_filter( ‘get_terms’, ‘get_subcategory_terms’, 10, 3 ); Fuente aquí. Tenéis que poner el número de categoría donde pongo XXX. Si dais a editar a la categoría, el ID aparece en la url. Con esto veréis como podéis elegir qué categorías o productos de las mismas aparecen en vuestra tienda.

Scroll al inicio