Diseño Web

Diseño Web, Gestores de contenidos, Prestashop

Prestashop Module Generator: utilidad para crear módulos básicos sobre los que trabajar

Prestashop es un gestor de contenidos para tiendas online que se basa mucho en la comunidad. Ellos generan un núcleo funciona básico y luego, si quieres más cosas, tienes que o comprar módulos, o crearlos tu. La compra de módulos es una buena idea porque mantiene a los desarrolladores activos, ellos mejoran el sistema mientras ganan dinero en el proceso. Y los clientes obtienen su funcionalidades extra. Si no quieres gastarte dinero, puedes desarrollar tu los módulos (que luego puedes vender etc). Cuando quieres construir un módulo, puedes empezar desde cero con la documentación de Desarrollador de Prestashop. Pero hoy os hablamos de una funcionalidad que os ahorra tiempo. Cómo crear un módulo de Prestashop desde cero con el Prestashop Module Generator. Prestashop Module Generator es una funcionalidad de la página https://validator.prestashop.com de Prestashop para crear módulos básicos. Este generador funciona a base de asistente paso a paso con el que puedes crear un módulo de cualquier tipo compatible para la versión que quieras de Prestashop. En el siguiente vídeo os lo explicamos, pero es muy sencillo. Recordad que es importante seleccionar el tipo de módulo que queremos, para que agregue lo que necesita, así como los Hooks que necesitemos (aunque estos se pueden registrar y usar más adelante). Y recordad también que esto es sólo una plantilla sobre la que trabajar…el módulo no hace nada. Sólo es la base. La funcionalidad se la das tu. Esta página: https://validator.prestashop.com , también sirve para luego validar tu módulo final y asegurarte que cumple con los “PrestaShop’s coding standards“, lo que facilita su compatibilidad y su posterior venta (si ves que es útil para otros).  

Diseño Web, Gestores de contenidos, Sistemas

Cómo probar los pagos con PayPal en una web. Paso 1. PayPal Sandbox.

Cuando diseñamos páginas web, sobre todo comercios electrónicos, una petición típica es que acepten pagos por PayPal (además de otros sistemas). En esos momentos uno tiene que poder hacer pruebas con pagos no reales. También cuando ocurre algún error con este método de pago: las pruebas deben hacerse en en entornos no reales. Para eso PayPal tiene un entorno de pruebas, PayPal Sandbox, que es un clon del entorno real. Esto es realmente útil porque se puede usar para realizar tantos pagos y operaciones ficticias como queramos en un entorno que funciona igual que el real pero que no nos cuesta dinero. Hoy os enseñamos a usarlo (porque no es tan sencillo). Cómo probar pagos con PayPal. PayPal Sandbox. Lo primero es que, obviamente deberías tener una cuenta de PayPal (si vas a vender de Business). Pero esa no la vas a usar para las pruebas. Podrías crear una directamente en Sandbox, pero no te lo recomendamos…luego es difícil autentificarla. Te aconsejamos seguir los siguientes pasos: Entre en PayPal Developer con tu cuenta real de PayPal. Este sitio, además de tener mucha información para programadores, te enlazará con el Sandbox. Lo siguiente que te recomiendo es que vayas a Accounts y ahí crees una cuenta con el nombre de tu e-mail de PayPal (usa otra contraseña). Esto crea cuentas en el PayPal Sandbox tranquilo, no te va a decir nada de cuenta duplicada. Si te pide verificar la cuenta, puedes ir a Notifications, elegir tu correo y verificarlo. Todos los correos que se mandan desde el entorno Sandbox no salen al exterior, sino que van aquí, a la bandeja de Notifications (si tienes asociada la cuenta a tu cuenta de developers). Si creas la cuenta directamente desde PayPal Sandbox te va a pedir verificarla, y te frustrarás porque no te llega ningún correo. En ese caso ve a Accounts (en Developers) y donde pone “To link your sandbox account to your developer account, log in with PayPal and provide your sandbox account credentials” pincha en log in with PayPal. Así podrás asociar la cuenta crear en el sandbox con esta de developers, y desde ahí ir a Notifications y ver las peticiones de confirmación. En accounts verás que también tienes una cuenta de vendedor (facilitator) y una de comprador (buyer) que son las que podrás usar para probar las compras en tu tienda. Puedes crear más cuentas de Sandbox, las que necesites. Para poder poner las credenciales pincha en cada cuenta y en Profile. Ahí verás el e-mail de acceso, podrás establecer la contraseña y, en el caso de las de vendedor, podrás ver los datos de la API (API credentials)que te pedirá tu módulo de PayPal o tu CMS. Con esto ya vas a poder trabajar y hacer pruebas de compra y de venta en tu tienda. Haz lo siguiente: Pon el addon o módulo en modo pruebas o sandbox (esto hará que se comunique con sandbox.paypal.com y no con paypal.com Usa las credenciales API (ver más arriba) de tu cuenta de vendedor para configurar el addon o módulo de Paypal. Usa el e-mail y contraseña de comprador para realizar compras en tu tienda. Podrás ir a Notifications en tu cuenta de developer para poder ver tanto ventas como errores que surjan con cada pedido. Una vez hayas probado todo y funcione, desactiva el modo Sandbox, y pon las credenciales API de tu cuenta real de PayPal. Todo debería funcionar sin problemas. Más información en la guía de Sandbox de PayPal.  

Diseño Web, Gestores de contenidos, Prestashop

Cómo limitar el tiempo que dura un carrito en Prestashop

Prestashop, por lo menos en la versión 1.7 , trae una cosa interesante, y es que reserva los productos cuando los guardas en el carrito. Esto hace que puedas realizar tu pedido con calma, sin peligro que otro cliente te quite productos que dispongan de poco stock. Pero también tiene un problema: por defecto el carrito “recuerda” tu carrito 480 horas (¡¡20 días!! ). Esto puede ser interesante si tienes productos con mucho stock para mantener clientes que tengan dudas o mañana quieran retomar su pedido. Pero en tiendas con poco stock quiere decir que la tienda pueda tener stock retenido 20 días por clientes indecisos (o competencia con mala leche). Hoy os enseñamos a reducir ese tiempo. Cómo limitar el tiempo que dura un carrito en Prestashop. La configuración que decide cuanto tiempo está se guarda el carrito son las “cookies del front-office“. Al guardar algo en el carrito, el sistema guarda una cookie en el ordenador del cliente. Dicho fichero tiene un tiempo de duración que está limitado por esta configuración. Lo ideal, en el caso que hemos expuesto (tiendas con poco stock) es limitar este tiempo. Para ello (en 1.7, PS tiende a variar los menús) vamos a ir a Parámetros Avanzados >Administración (en 1.6 estaba en Administración>Preferencias>General). Ahí en Configuración tenéis el parámetro Tiempo de vida de las cookies front-office. Y como veréis está en 480 horas. En el caso que nos ocupa puede ser interesante ponerlo a algo como 3 horas. Así los clientes tienen tiempo suficiente para rellenar su carrito, pero eliminas a los indecisos.    

Diseño Web, Sistemas, Trucos

Cómo buscar caracteres raros como Ascii usado SQL

Hace unos días teníamos que buscar, en una base de datos de productos, la cadena de caracteres &quot;  para sustituirlas por otras (espacio o “). &quot; es el código Html de las comillas (“). Y teníamos que quitarlas en esa base de datos, en la descripción del producto. El problema es que SQL detecta ciertos caracteres como ; como caracteres de ruptura o división de código. Y da error si lo incluimos en nuestra búsqueda. Por ejemplo algo como esto da error cerca del punto y coma y por culpa de ese signo: UPDATE ps_product_lang SET description = REPLACE(description, ‘&quot;’, ”) WHERE description LIKE ‘<span class=%’ AND id_product LIKE ’56’ AND id_lang LIKE ’10’ ¿Cómo podemos encontrarlo? Os lo contamos. Cómo buscar caracteres ASCII o similares por SQL. El truco está en buscar el resto de términos de la expresión, y concatenar la búsqueda con el término Ascii indicándolo con el comando CHAR. Os mostramos la variación: UPDATE ps_product_lang SET description = REPLACE(description, CONCAT(‘&quot’,CHAR(59)), “”) WHERE description LIKE ‘<span class=%’ AND id_product LIKE ’56’ AND id_lang LIKE ’10’ De esta manera hemos puesto la misma búsqueda (&quot concatenado con el CHAR(59) que es el caracter Ascii para ; ) pero SQL lo entiende.  

Diseño Web, Gestores de contenidos, Prestashop, Trucos

Prestashop: que el menú del backoffice pueda hacer scroll.

Con Prestashop 1.7 han venido muchas ventajas. Pero también alguna cosa extraña que ha habido que arreglar. Entre ellas esta del menú del backoffice. Si añades muchos módulos que agreguen apartados en en menú de la sección de administración, verás que no se puede llegar a la parte inferior porque no hace “scroll”. Dicen que lo van a solucionar, pero llevan diciéndolo desde las primeras versiones, así que os dejamos una arreglo mientras lo hacen. Cómo hacer que el menú del backoffice en Prestashop pueda hacer scroll. Lo primero es hacer que se pueda hacer scroll. Para ello edita el fichero tucarpetadeadmin/theme/default/css/admin-theme.css o mejor, para mantener ese intacto tucarpetadeadmin/theme/default/css/override.css Y añade las líneas: #nav-sidebar { overflow-y: auto; } ::-webkit-scrollbar {display:none;} Con esto se puede hacer scroll y sin ver la barra. PERO (un gran pero) desaparecen los submenús del menú principal. También tenemos solución para eso. Ahora tienes que editar el fichero tucarpetadeadmin/theme/default/js/admin-theme.js   y poner lo siguiente al final: $(function () { $(document).on(‘hover’, ‘#nav-sidebar li.has_submenu’, function () { var submenu = $(this).find(‘.submenu’).eq(0); var marginTop = $(this).position().top + parseInt($(‘header#header > nav’).height()); if ((marginTop + parseInt(submenu.height())) > parseInt($(window).height())) marginTop -= (marginTop + parseInt(submenu.height()) – parseInt($(window).height())) + 10; if ($(‘body’).hasClass(‘page-sidebar-closed’)) marginTop += 34; setTimeout(function () { submenu.attr(‘style’, ‘position: fixed !important; top: ‘ + marginTop + ‘px !important’); }, 50); }); }); Con esto ya tendrás los menús funcinando (fuente de esta función). Parece mentira que no solucionen estas cosas “tan sencillas”.

Diseño Web, Gestores de contenidos

Addon gratis para Prestashop: Cumplimiento de la legislación europea

Si tu tienda Prestashop va a vender productos en Europa, necesitas cumplir las leyes europeas. Si no te arriesgas a una demanda¿Conoces todas? No, seguramente no. Y tampoco es necesario con este excelente addon gratuito Cumplimiento de la legislación europea. Prestashop 1.7 está pre certificado por empresas como Trusted Shops, EHI, Händlerbund y Protected Shops como que está adecuado a la legislación europea. Esto no quiere decir que tu tienda lo esté, simplemente que tiene los mecanismos para que lo consigas. Con este módulo, cumplimentándolo correctamente, tienes el “el 90% de la configuración de una tienda cumpla con la normativa legal vigente“. Cómo instalarlo. Desde el backend ve a Módulos y Servicios y en la barra de búsqueda pon “Cumplimiento normativo legal“. Uno de los resultados (gratis), es este módulo.   Qué hace el módulo. El módulo, al instalarse crea páginas y opciones que son necesarias por normativa europea. Las puedes ver aquí detalladas. Cosas como : Se crean varias páginas estáticas, lo que te proporciona los medios necesarios para poder indicar la información legalmente requerida a tu cliente. Para obtener más información, consulta la sección “Gestionar el contenido legal”. Estas páginas estáticas con contenido legal incluyen un botón “Imprimir”, que permite a los clientes imprimir fácilmente o guardar en PDF esta información legal. El resumen final en el último paso de la tramitación del pedido es también habilitado. La opción ‘Mostrar impuestos en el carrito de la compra‘ es también activada. Las condiciones de envío “Gratis”: a veces, el transportista por defecto de tu país predeterminado puede ser gratuito y esta información se muestra en la página del carrito de la compra, incluso si no ha establecido su dirección y método de entrega durante la compra. Debido a que el importe final de la compra depende de la dirección del cliente y del transportista seleccionado, el módulo Cumplimiento normativo legal, añadirá automáticamente una mención “bajo condiciones” que enlaza a la página estática “Envío y Pago” donde debes detallar las condiciones y los gastos de envío. El opt-in para los Términos del Servicio también incluirá los Términos de Revocación (si están disponibles) durante la compra.   Una vez configuradas todas las opciones de este módulo no sólo estaremos más seguros de cumplir la ley europea, sino que además podemos solicitar una certificación a las empresas mencionadas anteriormente y tener más posibilidades de obtenerla.

Diseño Web, Gestores de contenidos

Módulo editor de CSS para el backend de Drupal

Hace unos días tuvimos que modificar las páginas de un cliente en Drupal. El cambio que teníamos que hacer implicaba CSS. Pero no teníamos acceso a editar los ficheros (y tampoco queríamos). Así que descubrimos este módulo para editar CSS desde el backend, a través del navegador. Módulo editor de CSS para el backend de Drupal. Con este módulo, CSS Editor, la modificación de CSS (casi imprescindible al personalizar tu web) se hace muy sencillo. Está disponible para Drupal 7 y 8. Instálalo de manera normal, o por el backend o subiéndolo a la carpeta módulos (o sites/all/modules si es un multisite). Después actívalo desde la sección de módulos del backend. Cuidado: después tienes que configurarlo y activarlo para la plantilla que quieras (si no lo haces no aparecerá el editor). Una vez instalado y activado, ve a la plantilla elegida y verás que al final de la página principal de configuración de la misma aparece una ventana para editar CSS. Ahí el manejo es el de siempre, pon la clase, o el id que quieras, y cambia el estilo a tu gusto, estas modificaciones tendrán preferencia sobre el CSS de la plantilla. Recuerda borrar caché si no ves algo o poner !important. No tiene mucho más, cumple su objetivo. Te permite cambiar el editor a modo texto si lo prefieres (quien lo prefiere…) y poco más. Una gran ayuda para personalizar tus páginas web en Drupal.

Diseño Web, Gestores de contenidos, Trucos

Cómo exportar e importar posts, entradas, gratis en WordPress con las imágenes destacadas

Llevamos unos días migrando o renovando webs. En muchas ocasiones tenemos que pasar posts de una web antigua a una nueva con contenido, autor, comentarios e imagen destacada. Hoy os vamos a enseñar la manera más sencilla de hacer eso. Existen muchos plugins, en teoría gratuitos, para hacer esto. Los debemos haber probado todos. Algunos fallan, no funcionan bien, o están limitados a ciertos campos. Y, sobre todo con las imágenes, cuando queramos subir otros nos piden pasar a la versión de pago. ¿Quién querría migrar un post sin su imagen? Cómo exportar e importar posts en Wordress con imagen destacada. La solución, como ocurre frecuentemente, es más sencilla. Los plugins oficiales de WordPress funcionan muy bien, aunque hay que saber usarlos. Os recomendamos que uséis el orden que os indicamos (primero posts y luego imágenes). Exportar posts. Lo primero que tenemos que hacer es exportar los posts en la web antigua. Para eso no tenemos que instalar nada. Sólo ir a Heramientas > Exportar y seleccionar Entradas. Escoged la configuración que queráis y pinchad en Descargar el archivo de exportación.  Esto generará un archivo xml que, por cierto (ya hablaremos de esto otro día) es fácilmente editable si lo necesitas. Importar posts. Id al nuevo WordPress e instalad el plugin oficial para importar. Es este: Importador de WordPress. Una vez instalado ir a Herramientas >Importar y, al final, veréis la opción de importar entradas. Es fácil de usar, sólo tenéis que indicar el archivo exportado en el punto anterior, y seguir los pasos del asistente. Esto importará los posts, los autores, los comentarios y muchos campos personalizados (aunque algunos no podrás verlos). Exportar imágenes. Vamos a por las imágenes destacadas. Vuelve al WordPress original y ve a Herramientas >Exportar. Elige ahora la opción de Medios y de nuevo Descargar el archivo de exportación. Descargará las imágenes. Importar imágenes. Por último vamos al nuevo WordPress y, de nuevo en Importar, escogemos la misma opción pero ahora el fichero de imágenes que acabamos de exportar. Importará (va a tardar) las imágenes, y asignará cada imagen destacada a la del artículo en cuestión. Así tendremos los artículos con sus imágenes. Puede (tenemos que comprobarlo) que en la base de datos quede la asignación del as url de las imágenes al antiguo blog. Sólo tenemos que usar el plugin de Buscar y Reemplazar para cambiar dichas url por las nuevas.  

Diseño Web, Gestores de contenidos, Trucos

Estados y provincias en Prestashop 1.5, 1.6 y 1.7

Cuando estás configurando una tienda en Prestashop, con envíos fuera de España te encuentras con un problema muy extraño: no hay provincias. Y muchos transportistas cobran según zonas o provincias, no según países. En Prestashop 1.7 hay una sección ( Internacional>Localización) donde en teoría se puede importar las provincias de Internet o de un fichero en el servidor. NO FUNCIONA. No lo intentéis. Y cuando ves que no funciona entras en el fichero local del servidor (directorio localization) y ves que sólo España y dos o tres países más tienen provincias. Así que piensas que si descargas el Prestashop del país en cuestión (por ejemplo Portugal), debería tener el fichero con provincias. No lo tiene. Mi teoría es que no están en el core “todavía”. No se les ha ocurrido configurarlo. Alguien, en algún momento, debío pensar que era una buena idea, porque el problema lleva desde la versión 1.4, pero luego se quedó ahí. Solución para agregar estados y provincias en Prestashop. Hay dos soluciones. Por SQL. La primera es la que se lleva haciendo desde Prestashop 1.4.  y es agregarla por comandos de SQL. Funciona, y de hecho antes teníamos que agregar así hasta las de España. Pero, en mi opinión tiene varios problemas respecto al segundo método: Es tocar la base de datos, y mucha gente no sabe bien y asusta. Hay que usar phpMyAdmin o similar…hay gente que no sabe y ya es otra instalación. Tienes que asegurarte que los ids de los países no están ya cogidos (y si lo están cambiarlos) y comprobar que el id de zona es el que quieres. Pero funciona como decimos. Así que si optáis por este método haced copia de la base de datos y adelante. Os dejamos este enlace donde un usuario ha subido los comandos para cada país. Tenéis que abrir cuenta en los foros de Prestashop (gratis) para poder descargarlos y recordad comprobar bien los ids. Por fichero xml. En el directorio localizations de la raíz de tu servidor tienes un montón de ficheros xml por país. A estos ficheros se les puede agregar al final un apartado entre las etiquetas <states> </states> con los estados y códigos ISO que encuentras aquí. Una vez editado el fichero puedes ir al backend de tu tienda y en Internacional>Localización elegir el país, marcar la opción de provincias y en Descargar datos del paquete marcar la opción No. Esto hará que lea el fichero en el servidor (en vez de los inexistentes en Internet) y subirá esos estados. Obviamente la tarea es ardua, hay países con más de 200 provincias o estados. Así que, ya que lo hemos tenido que hacer por un cliente os dejamos aquí los ficheros. Sólo tenéis que subirlos a la carpeta que os hemos dicho, ir al backend e importar las provincias del fichero local país por país. Luego lo comprobáis en Internacional > Ubicaciones Geográficas >Provincias. Aquí tenéis los xml que hemos creado. Puede que tengáis que cambiar o modificar las zonas porque las hemos creado con respecto a nuestro cliente. Eso si el formato es sencillo (más que el del SQL): <state name=”Lower Silesia” iso_code=”PL-DS” country=”PL” zone=”Europa – Zona VI“/> Cambiad la zona a la que queráis (Europa sólo por ejemplo). Portugal Francia Alemania Mónaco Austria Bélgica Gran Bretaña Luxemburgo Países Bajos Suiza República Checa Dinamarca Polonia Eslovenia Eslovaquia Bulgaria Estonia Finlandia Croacia Hungría Irlandia Lituania Letonia Noruega Serbia Rumania Suecia          

Diseño Web, Gestores de contenidos, Trucos

Crear un usuario administrador de WordPress por base de datos

La semana pasada tuvimos un caso de una web que teníamos que reparar pero no teníamos acceso administrador. Era urgente y el cliente no estaba accesible, así que, como teníamos acceso a la base de datos, creamos uno por SQL. Hoy os enseñamos a hacerlo. Cómo crear un usuario administrador en WordPress por base de datos. Lo primero es obviamente tener los datos de acceso a la base de datos y poder acceder a ella o por comandos de SQL o por (más fácil) phpMyAdmin. Una vez tenemos este acceso. Método gráfico (phpMyAdmin). Haz una copia de la base de datos. No debería decirlo…pero siempre se debe hacer antes de modificarla. Cuando no lo haces “porque es fácil” es cuando falla. Ve a la tabla wp_users. Ahí dale a Insertar y rellenamos los siguientes campos. Campos (pongo los esenciales): –ID: Hay que usar uno que no exista en la base de datos. Mira los que hay en esa tabla y pon un número que no esté en uso. Por ejemplo el 6. –user_login: El usuario que vamos a usar, el que queráis. Por ejemplo goduser. –user_pass: En valor tienes que poner la contraseña que quieres. Pero en función pon MD5 para que la meta encriptada y no en texto plano. Si no no sólo es un fallo de seguridad pero WordPress no la entenderá. –user_nicename: Es el nombre de usuario corto. Puede ser el mismo que el login o (por ejemplo) uno el e-mail y el otro el nombre de usuario. –user_email: el e-mail del usuario. –user_registered: Pon una fecha. Te abre un calendario para ponerlo fácilmente. –user_status:  0 –display_name: El nombre que se mostrará a otros usuarios o en publicaciones. Dale a Continuar y, si no hay error, ya tienes el usuario creado. Pero todavía no podrás entrar o no será admin. Ahora tienes que ir a la tabla wp_usermeta. De nuevo dale a Insertar y rellena los siguientes campos. Campos: – unmeta_id: No pongas nada. Lo pone el sistema. –  user_id: El id que pusimos en la tabla wp_users. En el ejemplo 6. – meta_key: Pon esto: wp_capabilities –meta_value: Pon (verás que el otro admin también lo tiene):  a:1:{s:13:”administrator”;b:1;} Dale a Continuar y debería grabarse esos valores. Todavía no está. Vuelve a insertar en esta misma tabla, wp_usermeta, otro registro con los siguientes campos. Campos: – unmeta_id: No pongas nada. Lo pone el sistema. –  user_id: El id que pusimos en la tabla wp_users. En el ejemplo 6. – meta_key: Pon esto: wp_user_level –meta_value:  10 Dale a Continuar para que se guarde. Y ya estaría, ya podríais acceder al WordPress como administrador. Método por comandos SQL. Si no puedes usar phpMyAdmin te dejamos los comandos. Verás que son los mismos que hacemos en modo gráfico en el punto anterior. Haz copia de la base de datos. En la ventana de SQL con acceso a la base de datos pon los siguientes comandos. En azul puedes ver los valores que tienes que cambiar (mira arriba para la explicación): INSERT INTO ‘wp_users’ (‘user_login’, ‘user_pass’, ‘user_nicename’, ‘user_email’, ‘user_status’) VALUES (‘tuusuario‘, MD5(‘tucontraseña‘), ‘tunombrecorto‘, ‘tuemail‘, ‘0’); INSERT INTO ‘wp_usermeta’ (‘umeta_id’, ‘user_id’, ‘meta_key’, ‘meta_value’)  VALUES (NULL, (Select max(id) FROM wp_users), ‘wp_capabilities’, ‘a:1:{s:13:”administrator”;s:1:”1″;}’); INSERT INTO ‘wp_usermeta’ (‘umeta_id’, ‘user_id’, ‘meta_key’, ‘meta_value’)  VALUES (NULL, (Select max(id) FROM wp_users), ‘wp_user_level’, ’10’);   Como veis aquí crea el usuario (el id se lo dará SQL) y luego usa el max(id) para coger el último id que se ha creado (el tuyo). Nota: Si tenéis problemas con los comandos cambiad (pones a mano) las comillas simples ‘. A veces al copiar pegar se ponen como otros valores.