Blog

Código Worpdpress, Diseño Web, Gestores de contenidos

Cómo poner un formulario de Contact Form 7 en dos columnas.

/

Algo que nos han pedido ya varios clientes, y que llevamos queriendo desde hace tiempo subir al blog, pero que nunca hemos encontrado tiempo para hacerlo. Ayer nos lo pidió otro cliente, y aprovechamos para subirlo. Nota: si sabéis CSS podrías modificarlo para ponerlo en más columnas. Cómo poner un formulario de Contact Form 7 en dos columnas. Contact Form 7 no está pensado para dividirlo en columnas, así que tenemos que hacer unas modificaciones de CSS y luego editar el formulario con unas etiquetas de html +css. Os lo explicamos. Primero os dejamos el código CSS (estilo). Este lo tenéis que poner o en el styles.css de vuestra plantilla hijo o en la opción de CSS personalizado de vuestra plantilla. Si miráis el código, este crea el contenedor al 100%, luego una clase de fila al 100%, una de media fila al 50% y luego unas modificaciones para móviles. Una vez que tengáis esto en vuestro CSS, podéis usarlo en vuestro formulario. Id editar el formulario en cuestión y ahí tenéis que poner cada shortcode de campo entre las etiquetas que correspondan a una media fila o a una fila. Este es el código y lo comentamos en azul para que lo entendáis. No tenéis que poner los comentarios. Los campos que corresponderían a un formulario normal están en verde. Lo demás es lo que añadimos de HTML (estructura) con CSS (formato). Obviamente, añadid filas y sus columnas según necesitéis.

Trucos, Video

Editar vídeos en formato vertical para subirlos a redes como Youtube Shorts o Instagram.

/

Últimamente algunas redes sociales están pensadas para ver vídeos en formato vertical. Esto antes era un crimen, pero el entorno ha cambiado, y nos tenemos que adaptar a él. Yo odio editar vídeos en el móvil, no me resulta cómodo, ni tengo las herramientas necesarias. Y me gusta Shotcut, estoy acostumbrado a él. Así que hoy os dejamos cómo editar vídeos en formato vertical en este editor gratuito. Y cómo cambiar a la edición tradicional horizontal si lo necesitamos. Cómo editar vídeos en formato vertical en Shotcut.

Código Worpdpress, Diseño Web, Gestores de contenidos, Plugins Wordpress

Cambiar el texto del botón de Añadir al Carrito en Woocommerce.

/

De nuevo publicamos una solución que nos ha pedido un cliente y que puede que encontréis útil. Cómo cambiar el texto del botón “Añadir al carrito” en vuestras tiendas de Woocommerce en WordPress. Hay ciertas cosas que uno no entiende por qué no vienen por defecto en WordPress, y esta es una de ellas. Queremos cambiar el texto del botón, y no podemos. Hoy os dejamos dos posibles soluciones, como siempre con código y con plugin. Con código. Yo suelo, tras años de trabajar en esto, intentar poner el menor número de plugins posibles. Por velocidad de la página, por evitar conflictos, por no tener que estar actualizando cientos de ellos, por evitar vectores de ataques etc etc. Así que os dejamos unos códigos para poder añadir al fichero functions.php de tu tema hijo o a tu plugin de snippets. ¿Pero ..,.no habíamos dicho que no usabas plugins? Si…pero si no puedo tener tema hijo (porque esté modificando algo que ya está hecho) o si voy a usar varios códigos en un proyecto, Snippets es un plugin que suelo usar. El siguiente código cambia el texto en páginas de producto individual y en páginas de listado de producto. Os dejamos dos variantes más interesantes (fuente): Por tipo de producto: O por categoría: Sólo para los productos gratuitos. Con plugin. Para los que no os atrevéis a usar códigos (hacedlo) os dejamos alguna opción de plugin. Aquí tenéis varios. No los hemos probado porque no usamos plugins para algo tan puntual. Loco Translate. A nosotros nos usa usar plugins que puedan cumplir varias funciones. Este traduce cadenas de muchos plugins y temas, así que es buena idea usarlo. Seguro que tenéis alguna otra cosa que queráis cambiar.

Correo, Sistemas, Soporte

Cómo ver las cabeceras de los correos en Chrome y en Outlook.

/

En ocasiones queremos saber el trayecto que ha recorrido un correo antes de recibirlo en tu bandeja de entrada. Normalmente es para poder ver : las IPs de los servidores desde los que salieron. Para ponerlos en una lista negra o blanca. el correo original. las firmas DKIM, SPF etc para mejorar la puntuación de spam. Esto se puede ver en los servidores, pero curiosamente es más fácil en los clientes de correo. Hoy os enseñamos a mirar las cabeceras en Google Chrome, y en Outlook. Para aquellos que vean el correo en navegador, o los que usen el cliente de correo de Microsoft (que son muchos). Cómo ver la cabecera de los correos en Chrome y en Outlook. En este vídeo podemos ver el proceso para ambas plataformas.

Cursos de Informática SmythSys, Diseño Web, Diseño Web, Gestores de contenidos, Wordpress

Cómo instalar WordPress en un hosting o alojamiento desde cero.

/

En esta época mucha gente querrá emprender, abrir sus proyectos tanto digitales como no digitales. Y todos requerirán una página web. Si no tienes web, no tienes presencia en Internet. Un gran porcentaje de esos se montarán sobre WordPress, el CMS más usado. Pero muchos o no tienen ingresos para pagar un diseñador web, o quieren intentar hacerlo por su cuenta.Para ellos, y para los que estén empezando en el mundo del diseño web, iremos grabando algún vídeo de formación. Hoy os explicamos … Cómo instalar un WordPress desde cero. Para este tutorial, suponemos que has contratado un dominio a un proveedor y un alojamiento, o hosting (espacio web en internet) asociado a ese dominio. Una vez tengas eso, puedes seguir los pasos del vídeo para tener un WordPress funcionando en menos de 15 minutos.

Diseño Web, Gestores de contenidos, Trucos

WordPress: restringir todo o parte del contenido a usuarios registrados sin plugin. Web privada.

/

Si quieres restringir todo o parte del contenido de tu web sólo a usuarios registrados, puedes usar plugins. Pero somos partidarios de usar los mínimos posibles para : Optimizar recursos. Cuantos más plugins, más lenta va la web, más css y javascript se cargan. Evitar vectores de ataques: los plugins pueden tener vulnerabilidades por las que puedan entrar hackers. No tener muchos minimiza las opciones. Simplificar la web. Evitas conflictos, te permite hacer nuevos desarrollos sin depender de que otros plugins den problemas etc. Así que, si las cosas son sencillas, preferimos hacerlas por código. Ya sabéis, o poniendo el código en el fichero functions.php de nuestro tema hijo, o en un plugin de código como Code Snippets. Hoy os enseñamos a hacer de vuestra web una web privada, o restringir ciertas páginas a usuarios registrados. Cómo restringir todo o parte del contenido a usuarios registrados. Lo que vamos a hacer es poner un código que compruebe, cuando entres, si estás registrado. Si no, te llevará a la página de registro. Para toda la web. Pon este código en tu functions.php o en tu snippet. Como veis, podéis cambiar el código para redirigir a otra página. Restringir sólo ciertas páginas. Podemos cambiar fácilmente el código para que la comprobación la haga sólo en cierta páginas. donde tienes que cambiar slug (en azul) por el slug de tu página. Si queremos varias páginas podemos: o Ya que || es como un OR (podemos encadenar los que queramos). Si queremos restringir la tienda de Woocommerce. Si queremos redirigir al usuario, después de iniciar sesión, a la página que intentó ver. Aquí os dejamos otra variante donde redirigimos al usuario a la página que intentaba ver cuando le saltó el inicio de sesión, usando auth_redirect.

Compartir, Redes Sociales, Video

Youtube Shorts: si tienes un canal de Youtube, estás tardando en grabarlos.

/

Está claro que las dos redes sociales que más han crecido últimamente son Tik Tok e Instagram. En ambos casos se tratan de redes en las que se sube contenido corto, principalmente para verse en móviles. Y es lógico, es el dispositivo que más usamos. Youtube se ha dado cuenta, y ha movido ficha, sacando sus Google Shorts para competir con esas redes. Y, como sabe que los creadores van donde haya dinero, ha cread un fondo de 100 millones de dólares para premiar a creadores que suban Shorts (ellos contactan con los usuarios que tengan Shorts que funcionen). Hay que tener en cuenta que Youtube sigue siendo una plataforma indispensable. Cuando vas a buscar algo en Internet, o lo buscas en Google, o vas a Youtube. Y, si se trata de ver pasos, vas a Youtube. Qué son los Youtube Shorts. Es importante darse cuenta que los vídeos de Youtube Shorts tiene ciertas características: Vídeos de menos de 60 segundos. Formato vertical. El máximo creo que es formato cuadrado, pero como es para ver en móviles mejor personalizarlos para móviles. Se suben desde la aplicación del móvil. Si cumple las características verás que en la aplicación del móvil el vídeo aparece con el logo de Shorts. Por que es buena idea subir Youtube Shorts. Ante varias indicaciones de gente de SEO, hemos estado haciendo pruebas con los Shorts. Y los resultados son impresionantes. En canales con pocas visitas, de 5-20 personas en meses, los shorts se ponen en días en 100-150 visitas. En canales con más visitas, obviamente más, aunque no es una ciencia cierta. Esto es porque: Youtube está promocionando los Shorts Muestra esos vídeos a una audiencia diferente a la tuya. Tienes más audiencia. La gente ve los Shorts uno detrás de otro, es como funciona la plataforma. Por lo tanto es fácil que vean tu vídeo. Es decir, Shorts puede hacer que aumenten tus visualizaciones muchísimo. ¿Sustituyen los Shorts a los vídeos normales? No…son como dos plataformas diferentes. Los Shorts son contenido de consumo rápido, fast food. Te pueden dar más visualizaciones, puede darte más visibilidad. Pero no continuidad. Tus ingresos a la larga van a depender de vídeos largos, que creen retención y haga que los usuarios se queden más tiempo. Y que vuelvan. Los Shorts pueden ser marketing, pero tienes que tener un producto de calidad en tu canal. Os mostramos cómo subir Shorts.

Diseño Web, Gestores de contenidos, Prestashop

Cómo exportar productos en Prestashop 1.7 sin instalar módulos adicionales.

/

Por alguna razón, Prestashop siempre ha puesto difícil exportar el catálogo de productos. Y, si querías algo decente, había que instalar un módulo de pago. En la versión 1.7, se pueden exportar productos sin módulo. Os enseñamos cómo. Exportar productos en Prestashop 1.7 sin instalar módulos de pago. En Prestashop 1.7 tenemos dos opciones gratuitas. Desde el menú de productos. Podemos ir a Catálogo -> Productos y pinchar en la rueda dentada (encima de los productos a la derecha). Ahí se nos abre un menú y la primera opción es Exportar. Esto nos exportará los productos a un fichero .csv que podemos abrir con Excel. ¿Problema? Sólo exporta las columnas que se muestran en el panel de productos, que no son muchas. La mayoría de los usuarios querrán más. Pero sirve para tener una exportación simple de productos. Con un script de SQL. No todos conocen que Prestashop tiene una funcionalidad muy potente. Una página, el Gestor SQL, desde la que poder guardar y ejecutar scripts de SQL (SQL es el idioma en el que está guardada la base de dato y desde el que se puede consultar directamente). De hecho cada día lo hacen más manejable, y ahora permiten, desde el editor, ver las tablas que existen en la base de datos y los nombres de los cambios de esas tablas. Si, sabemos que no todo el mundo conoce SQL, pero os vamos a dejar una muestra de un script que extrae bastantes más campos. Si necesitáis más, no es muy difícil ver qué hace el script y añadir campos. Para acceder a esta herramienta tenemos que ir a Parámetros Avanzados -> Base de datos -> Gestor SQL. Ahí podemos : Añadir una consulta SQL. Recuerda que desde el editor puedes ver las tablas y variables. Salvar las consultas para usarlas cuando quieras. Editar y borrar consultas. Ejecutar las consultas para ver los resultados en el backend. Ejecutar las consultas para descargar el resultado en csv (icono nube) Este es un SQL de ejemplo: Nota: en el script, suponemos que ps_ es el prefijo de base de datos (es el de por defecto). Actualización 19/10/2022 Algún usuario me ha pedido un script para exportar con las imágenes. Os dejamos uno (no nuestro, sacado de aquí). Os puede servir al menos como base. Lo hemos probado en una exportación de 1.7.8 y funciona.

Sistemas, Soporte, Trucos

Cómo vincular un PC con Windows a una cuenta de Microsoft.

/

Hace tiempo escribimos un artículo y grabamos un vídeo sobre cómo desvincular nuestro PC de la cuenta de Microsoft. Desde entonces, nos han preguntado varias veces cómo hacer el proceso contrario: cómo vincular nuestro PC a nuestra cuenta de Microsoft. Hoy os dejamos cómo hacerlo. ¿Por que querríamos hacer esto? Dos razones principales: Como ya dijimos en otro artículo, para poder guardar la clave de Windows de nuestro ordenador en nuestra cuenta. Así la podremos usar de nuevo si formateamos el ordenador o cambiamos piezas en el mismo. Para poder entrar automáticamente en los servicios de Microsoft, sin tener que poner el usuario y contraseña constantemente. Cómo vinculamos el PC en Windows a la cuenta de Microsoft. Tenemos dos caminos: Ir a Configuración -> Cuentas y pinchar en Iniciar sesión con una cuenta de Microsoft en su lugar. Ir a Configuración -> Actualización y seguridad -> Activación -> Agregar una cuenta de Microsoft y pinchar en Agregar una cuenta.

Sistemas, Soporte, Trucos

SOLUCIONES a los problemas de los certificados caducados en Septiembre que impiden navegar.

/

Puede que hayáis oído que se han caducado unos certificados raíz el 30 de Septiembre, concretamente el que Let’s Encrypt está utilizando actualmente, el certificado IdentTrust DST Root CA X3. ¿Por qué es esto importante? Porque los navegadores usan certificados para la autenticación en Internet entre cliente y servidor. Esta es la primera vez que caducan certificados raíces, y están ocasionando problemas en muchos dispositivos, ordenadores y páginas web antiguas. Porque cuando una de las partes detecta un problema con el certificado de la otra, corta la comunicación y no deja navegar. Y ahora, casi todo Internet es seguro, va por https en vez de http. Nos estamos encontrando este problema en muchos frentes diferentes, así que hemos decidido subir este artículo a modo de recopilación e ir agregando aquí las soluciones que vayamos encontrando. Espero que os sea de utilidad. Solución general. Una solución general para cualquier dispositivos es intentar instalar o usar Mozilla Firefox (versiones superiores a la 50). Parece ser que tiene su propio certificado raíz y no se ve afectado por este problema. En MAC versiones anteriores a la 10.12.1. Uno de los afectados son los MAC con versiones Gran Capitán (10.12.1) e inferiores. La solución para estos casos viene muy bien detallada en esta página. Se trata de : Abrir un Terminal. Puedes hacerlo abriendo la búsqueda (Command(⌘) + Space) y desde ahí escribir Terminal y Enter. O encontrarlo en Utilidades del Finder. Escribir el siguiente comando: Esto lo que hace es abrir un script ( http://logi.wiki/rootcerts.sh ) como veis desde http (porque https no funciona en esos dispositivos). Y ese script, que podéis ver lo que contiene, carga los certificados de este fichero http://logi.wiki/images/0/01/rootcerts.pem.txt , que como veis contiene varios uno detrás de otros. Estos son los nuevos certificados y el script cambia los viejos por estos. Con eso ya debería funcionar la navegación. PHP cURL. Muchísimos servicios web han dejado de funcionar porque esta herramienta, cURL, que se usa para hacer llamadas de URL por línea de comandos. Se usa mucho. Y el truco es que tiene sus propios certificados, no usa los del servidor. Así que puedes tener una página con certificados al día, y que no te funcionen servicios porque las conexiones de cURL están siendo rechazadas. Podéis ver la solución en esta página: https://support.deskpro.com/is/kb/articles/how-to-update-curl-trusted-root-certificates pero os lo resumimos.Vamos a explicarlo para Ubuntu 18, pero sería similar para otros sistemas de Linux. Y se van a descargar los certificados CA de Mozilla desde aquí. Baja los certificados: wget https://curl.se/ca/cacert.pem -O /etc/ssl/certs/cacert.pem Tienes que editar dos ficheros php.ini. /etc/php/<version>/cli/php.ini y /etc/php/<version>/fpm/php.ini . Donde version es tu versión de php. Es decir si es la 7.2 tienes que editar /etc/php/7.2/cli/php.ini . En estos ficheros tienes que modificar y/o añadir los siguientes parámetros.Nota: sólo añade el parámetro si no está. No pongas parámetros duplicados o dejará de funcionar. [curl] curl.cainfo = /etc/ssl/certs/cacert.pem [openssl] openssl.cafile = /etc/ssl/certs/cacert.pem Reinicia el fpm de esa versión para que se activen los datos.systemctl restart php<version>-fpm En el artículo explica cómo hacerlo también en Windows, nosotros sólo lo explicamos para Linux (la mayoría de servidores están en Linux). Windows inferiores a XP SP3 y Windows 7 SP1. Hemos detectado este fallo tanto en Windows XP como en Windows 7 SP1. Estos usan el certificado ISRG Root X1. Esta es la solución: Ve a https://letsencrypt.org/certificates/ En la sección Root certificates -> Active -> ISRG Root X1 Botón derecho en el .pem o el .txt o el .der y lo descargas como .crt o .cer, formatos que acepta Windows. Después vas a l navegador que uses Edge, o Chrome y lo agregas a la sección certificados, autoridad certificante.

Scroll al inicio