Blog

Diseño Web, Prestashop, Trucos

Cómo insertar un vídeo en un producto o módulo de Prestashop

Nos lo ha pedido algún cliente, somos muy vagos y creamos un vídeo para no explicarlo cada vez. Cómo insertar un vídeo en un producto de Prestashop. Sirve lo mismo para un módulo de las barras laterales o del contenido. Sólo tienen que tener editores html El vídeo se puede insertar en el resumen como en la descripción. Tienes dos métodos. Insertar la URL. Casi todos los editores tienen un botón para insertar vídeo. Sólo tienes que copiar la URL (dirección del navegador) de tu vídeo y pegarlo en la ventana que salga al pinchar en ese botón. En Prestashop además te deja cambiar el tamaño y la imagen que presenta el vídeo (si no pones una usa la de Youtube o Vimeo). El mayor problema es que, una vez hecho, si quieres modificar, tienes que editar código o borrar el vídeo y volver a ponerlo. Y que el resultado no suele ser responsive (cuidado con el tamaño que pongas). Incrustar vídeo (embed). El segundo método es más laborioso pero lo usamos cuando no funciona el anterior (sólo es compatible con ciertos servicios de vídeo) o cuando queremos personalizar más lo que insertamos (por ejemplo hacer Youtube responsive). Para ello vamos a pinchar en el botón de Compartir en Youtube (no todos los vídeos lo tienen, tiene que aprobarlo el creador) y elegir la opción Insertar. Ahí veras un código que tienes que copiar  y pegar en Prestashop>Insertar /Editar Video>Incrustar. En ese iframe podemos personalizar width y height y poner CSS y otros cambios.

Trucos, Video

Cómo girar vídeos de vertical a horizontal, con Shotcut

A quién no le ha pasado, o por error o por desconocimiento: nos equivocamos y el vídeo que creíamos se estaba grabando en horizontal sale torcido. “Hay un infierno reservado para la gente que graba los vídeos en vertical”. Y no podemos subirlo a ningún sitio ni verlo sin generar tortícolis. Ahora tenemos que girarlo, ¿cómo lo hacemos? Hoy os enseñamos a hacerlo. Cómo girar vídeos de vertical a horizontal con Shotcut. Para girar el vídeo vamos a usar Shotcut, un editor de vídeo gratuito muy potente y que nosotros usamos mucho. Así que lo primero que tenéis que hacer es bajaros el programa e instalarlo. Una vez abierto el programa, no importéis el vídeo directamente. Shotcut pone las dimensiones de trabajo del primero elemento importado. Así que si subimos el vídeo quedará con la anchura del vídeo vertical. Vamos a “engañarlo” subiendo una imagen con las dimensiones del FullHD. Así que busca en Google una imagen de las dimensiones que quieras. En este momento 1980×1080 está muy bien. Descargar una imagen (la que sea) así, súbela al programa y ponla en la línea de tiempo. Ya tienes el espacio de trabajo con 1980×1080. Ahora puedes importar el vídeo y ponerlo en la línea de tiempo. Borrar la imagen y quédate con el vídeo. Selecciónalo en la línea de tiempo. Ahora ve a Filtros>Rotar. Rota el vídeo (normalmente 270º). Ya lo tienes rotado pero no ocupa el espacio de trabajo. Sube la escala para que ocupe todo el espacio, normalmente un 200%. Ya lo tienes, edita lo que necesites y ahora exporta el vídeo. Sencillo y con resultados excelentes. PD: añado una muy buena aclaración que nos han puesto en el vídeo de Youtube: En realidad no tienes que hacer todo eso de descargar una imagen en línea e introducirla en Shotcut para conseguir la relación de aspecto que quieres. Lo que simplemente tienes que hacer es antes de agregar el video a Shotcut, ve a “Modo de Vídeo” en el menú “Preferencias”. De ahí elige el perfil que coincide con lo que quieres hacer con tu proyecto. Si por causalidad no encuentras el perfil que quieres ve en ese mismo menú a “Personalizado” para crear uno. El estándar en Shotcut en Modo de Vídeo es “Automático” que significa que el proyecto tomara el perfil de video completo del primer video que introduces. Eso lo puedes ver reflejado en el menú Exportar bajo la pestaña Vídeo.

Diseño Web, Prestashop, Trucos

Campos obligatorios en el registro de Prestashop: DNI, teléfono, código postal

Esto debería ser fácil, deberías poder entrar en la configuración de Prestashop y marcarlo. Pero no… Estar está ahí, pero parece que lo han escondido a conciencia. Os decimos cómo seleccionar los campos que queréis que sean obligatorios en el registro de Prestashop. Campos obligatorios en el registro de Prestashop DNI, teléfono código postal. Método 1. Para seleccionar que campos, dentro de los que deja Prestashop, son obligatorios en el registro de Prestashop tienes que ir al backend a Clientes > Direcciones. Ahí aparece todas las listas de direcciones de clientes registrados y, al final (casi para pasar desapercibido, tienes un campo recogido con un +, llamado Establecer los campos requeridos para esta sección. Pincha en el más y verás una serie de campos que puedes seleccionar. Siempre es mejor hacerlo de esta manera porque no retocas ni el sistema ni la plantilla. Nota: esto debería funcionar en teoría. A nosotros en la 1.7.42 se nos marca la casilla (teléfono) pero al refrescar se desmarca. No hay manera. Usamos el modo 2. Método 2. Si esto no te vale, o necesitas algún otro campo puedes hacerlo de esta manera. Primero tienes que ver si es un campo de cliente o de dirección. Por ejemplo teléfono es de dirección. Los campos de dirección están en Address.php y el de cliente en Customer.php, ambos en el directorio clases. Te ponemos el ejemplo con el de cliente (es lo mismo en Address). Copia el fichero classes/Customer.php en la carpeta override/classes/Customer.php Edita el fichero. Donde pone /**     * @see ObjectModel::$definition     */    public static $definition = array(        ‘table’ => ‘customer’,        ‘primary’ => ‘id_customer’, Vienen todos los campos. Sólo tienes que poner ‘required’ => true al final del campo que quieras que sea obligatorio. Por ejemplo si quieres la empresa obligatorio cambias: ‘company’ =>array(‘type’ => self::TYPE_STRING, ‘validate’ =>’isGenericName’), por ‘company’ =>array(‘type’ => self::TYPE_STRING, ‘validate’ => ‘isGenericName’,’required’ => true), Algún campo puede requerir más modificaciones porque impliquen algún otro campo más (por ejemplo el cumpleaños incluye año, mes y día). Una vez hecho este cambio, da un error 500 si intentas dejar vacío el campo. En Address.php hay que modificar el fichero AddressFormat.php (copialo antes a override/classes) y meter el valor en el array required. Por ejemplo aquí meto al final el phone: /** @var array Default required form fields list */ public static $requireFormFieldsList = array( ‘firstname’, ‘lastname’, ‘address1’, ‘city’, ‘Country:name’, ‘phone’, ); En Customer.php hay que buscar la clase que valida y hacer lo mismo.

Clientes, Diseño Web, Trabajos

Nueva web para Laosgarden. Tienda online

Hoy os presentamos uno de los proyectos en que llevamos trabajando desde verano. La nueva web para Laos Garden, una de las mejores (si no la mejor) tiendas de bonsai de Europa. https://www.laosgarden.com Esta web ha sido un proyecto intenso, por varias razones. Por un lado porque la nueva web tenía muchos requisitos personalizados de envíos y productos. Además tenían mucho stock con imágenes de calidad e información que había que importar. Además el cliente tenía muy claro todas las funcionalidades y requisitos de la nueva web y ha ido repasando cada paso con nosotros. Esto siempre es de agradecer, porque hace que el producto final sea mucho mejor y haya pasado por múltiples revisiones (reduciendo los errores posibles).  Pero produce muchas horas de revisión, y mejoras. Al final, ha sido un parto exitoso, deseado y estamos muy contentos con el resutlado. Estamos hablando de una web que puede vender automáticamente a cualquier lugar de Europa, con varios transportistas según zona y peso. También puede vender fuera de zona con opciones de recibir la información tras el pedido. Permite varios métodos de pago, es responsive y además gestiona los pedidos realizados en la tienda física. Las imágenes son mejoradas con respecto al Prestashop por defecto (ya explicaremos cómo). Como decimos… estamos todos muy contentos con el producto final.

Gestores de contenidos, Prestashop, Trucos

Prestashop: backend va lento o no puedes acceder. Solución

Estos días muchos de nuestros clientes con Prestashop han tenido el mismo problema. O lentitud (enorme) en el backend, o directamente no podían entrar en él (rueda girando indefinidamente tras pinchar en acceder). Obviamente todos pensamos en los hosting y hemos perdido mucho tiempo intentando depurar el problema. Pero la causa era otra. Parece ser que Prestashop usa servidores externos cuando ciertos módulos o addons están activos. Estos módulos estaban colapsados y esto provocaba la lentitud o la imposibilidad de acceso. Os decimos cómo solucionarlo. Solución a backend lento o a no poder acceder por los problemas de addons externos. La solución varía dependiendo de la versión de Prestashop. En Pretashop 1.6: hay que desactivar el módulo gamification. Pero no vale hacerlo desde el backend (y si no puedes acceder peor jejeje). Hay que cambiar el nombre de la carpeta  /modules/gamification  Con esto verás como ya puedes acceder a tu backend y va muy rápido. En Prestashop 1.7:  no hay módulo, hay que modificar unos ficheros. Podéis ver la solución propuesta por Prestashop aquí pero consiste en: – Editar el fichero classes/Tools.php y cambiar la línea : protected static $is_addons_up = true;  a protected static $is_addons_up = false; – Editar el fichero src/Adapter/Addons/AddonsDataProvider.php  y cambiar la línea: protected static $is_addons_up = true; a protected static $is_addons_up = false; Con esto debería estar arreglado. Nota: hay quien recomienda borrar el fichero config/xml/default_country_modules_list.xml. Si no te funciona prueba con eso, aunque nosotros no lo hemos necesitado.

Diseño Web, Gestores de contenidos, Prestashop

Prestashop: mostrar las variables y valores que llegan a un tpl en Smarty con debug

Cuando tienes que modificar ficheros tpl en Prestashop, muy a menudo necesitas saber qué variables le llegan desde Smarty (no las de la plantilla). Porque existen unas variables globales y otras que llegan a cada plantilla (diferentes a cada una). Si no pierdes mucho tiempo “probando”. Cómo mostrar las variables y valores que llegan a un tpl en Smarty. Esto para nosotros ha sido “un descubrimiento”.  Sólo tienes que poner {debug} en la plantilla tpl que quieras “evaluar”. Después de poner ese código, recarga la página. El código va a producir un pop-up, así que comprueba que el navegador no te lo está bloqueando. Cuando lo activas, saldrá un pop up como el de la imagen con las variables buscadas y sus valores. Con eso sólo tienes que programar lo que necesites. Esto es muy útil para programar cambios, pero también para hacer “debug”, es decir para ver por qué falla alguna cosa. Las de la plantilla puedes obtenerlas con getTemplateVars. Por ejemplo con: $all_tpl_vars = $smarty->getTemplateVars(); var_dump($all_tpl_vars);

Diseño Web, Gestores de contenidos, Trucos

Woocommerce: cómo editar varios productos a la vez. Asignar la misma categoría a muchos productos.

En ocasiones queremos hacer cambios a muchos productos en Woocommerce. Por ejemplo para cambiarles de categoría. ¿Es necesario hacerlo de uno en uno? La respuesta es no. Hoy os enseñamos a editar productos en grupo en Woocommerce. Cómo editar varios productos a la vez en Woocommerce. Podemos editar varios productos a la vez en Woocommerce. Para ello tenemos que irnos a Productos en el backend, y marcar los que queremos editar. Después tenemos que ir al desplegable que pone Acciones en lote y elegir Editar. Se os abrirá una nueva ventana con un pequeño editar y todos los posts marcados. Ahí podréis hacer cosas como cambiar de categoría, cambiar el precio y alguna cosa más. No se puede hacer todo, es una edición limitada, pero si alguna cosa muy útil. Nosotros lo hemos necesitado cuando teníamos que “mover” productos a otras categorías. Aquí os mostramos cómo:  

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

Prestashop: el archivo es demasiado grande. Configurar el tamaño de subida de archivos

En ocasiones, sobre todo si tienes imágenes grandes, puedes recibir un error de “el archivo es demasiado grande”. Os enseñamos a modificar el tamaño de subida en Prestashop. Cómo configurar el tamaño de subida de archivos en Prestashop. Este error se puede deber a dos causas: a) configuración de Prestashop y b) configuración del servidor. Lo primero sería verificar la fácil, la de Prestashop. Para ello tenemos que ir al backend, a Configuración> Parámetros Avanzados > Administración. Ahí veréis un apartado llamado Cuota de subida donde podéis cambiar el tamaño de ficheros. El interesante es el de “Tamaño máximo para una imagen de producto“, porque suele ser la que falla. Subidla a lo que necesitéis (teniendo en cuenta que imágenes más grandes tardan más en cargar). En Diseño >Imágenes tenéis algún que otro parámetro más para las imágenes de personalización de productos (sólo para ese caso especial). Paso 2. Si esto falla lo más seguro es que tengáis alguna limitación en el servidor. Lo mejor es poner por prestashop un fichero phpinfo y ver los parámetros configurados. Sobre todo mira post_max_size y upload_max_filesize. Si estos parámetros están demasiado bajos tienen que cambiarse. Cómo hacerlo depende de tu alojamiento. Muchos admiten cambiarlos desde el panel. Otros admiten crear php.ini personalizados o incluso cambiar los parámetros desde htaccess. Lo mejor es que contactes con tus administradores o con algún técnico para que lo vea. Una modificación errónea puede “tirar” tu web.  

Linux, Servidores, Sistemas, Trucos

Cómo saber las conexiones activas por FTP en un servidor Linux

Si tienes un servidor Linux y quieres saber qué conexiones de FTP están activas en ese momento o, dicho de otra manera, cuánta gente hay conectada en ese momento por FTP, hoy os decimos cómo. Enumerar las conexiones activas por FTP en un servidor Linux. Pure-ftpwho: Este es uno de los primeros comandos a probar. En línea de comandos lista las conexiones de FTP activas. Pero además tiene algún parámetro interesante como -c  o -w que hace que el resultado se muestre en html. Por lo tanto puede usarse en u script y mostrarse en una web o herramienta interna. Puedes filtrar los resultados de netstat para el puerto que quieras, tanto el 21 de FTP clásico como el 22 de sftp. netstat -tan | grep \:21 para FTP netstat -tan | grep \:22 para SFTP En algunos servidores, si lo tienen instalado, también puedes ejecutar ftptop o ftpwho. Así podréis vigilar vuestras conexiones en  el servidor.

Sistemas, Trucos

Cómo encontrar la ruta de la imagen fondo de escritorio en Windows

Ayer nos surgió la siguiente duda: tengo una imagen en el escritorio que quiero recuperar, ¿cómo encuentro la ruta de dicha imagen? Cómo encontrar la ruta de la imagen fondo de escritorio en Windows Para encontrar la ruta de la imagen fondo de escritorio en Windows tenemos que usar el registro de Windows. En este caso no debería haber ningún peligro porque no vamos a modificar nada, sólo consultar, pero como siempre cuidado. Nunca está de más hacer una copia. Para abrir el editor de registro hay que ejecutar regedit (en buscar o en ejecutar). Después hay que buscar la siguiente clave: \HKEY_CURRENT_USER\Control Panel\Desktop y ahí la clave Wallpaper Ahí está la ruta, que podremos copiar y pegar si hacemos doble clic sobre la clave. En el vídeo os mostramos cómo.  

Scroll al inicio