Diseño Web

Diseño Web, Gestores de contenidos

Plugin Page Builder para Wordress. Diseña tu página fácilmente con este editor

/

La tendencia desde hace unos años en las plantillas de WordPress es usar editores para las páginas. Dichos editores te permiten añadir y quitar filas, añadir y quitar columnas, modificar los años y altos de las mismas, insertar plugins y widgets en filas o columnas, cambiar colores etc. Todo de un modo muy visual y con un drag and drop. Esto hace que no tengas que saber mucho de CSS o html5 (al final hay que saber para poner las cosas a tu gusto), y hace mucho más sencillo crear las páginas responsive y a tu gusto. Uno de los editores más conocidos es el Visual Composer, de pago pero que viene con la plantilla. El problema de este plugin, además de que mete mucho código excesivo para algunos, y ralentiza la página, es que, como es de pago, es fácil tenerlo desactualizado, lo que lo convierte en una puerta de entrada para hackers. Además, al ser de pago, no está disponible para temas que vengan sin editor, o para temas gratuitos. Para estos casos recomendamos este plugin Page Builder por SiteOrigin. No es tan completo como el Visual Composer, pero tampoco añade tanto código ni hace que la página vaya tan lenta. Además vale para cualquier plantilla. Con este editor, y algún conocimiento de CSS, casi cualquiera puede hacer su página como quiera. Es más, dentro de unos días compartiremos otro plugin con el que casi no hará falta saber de CSS. Probadlo, más de 1 millón de descargas y 4.8 de 5 lo avala. Nosotros lo usamos en páginas básicas. Esperemos que os sea útil.    

Diseño Web, Gestores de contenidos, Seguridad

Wangguard: protege tu página de WordPress de usuarios no deseados (sploggers)

/

En algunos casos, las páginas de WordPress se llenan de registros de usuarios “falsos”, los llamados sploggers. Sobre todo aquellas que permitan a los usuarios registrarse sin ningún otro requisito. Evidentemente estas cuentas, además de llenar de “spam” nuestra lista de usuario, y agrandar la base de datos, puede ser un fallo de seguridad.  La mayoría de estos son intentos de acceder a nuestra página con permisos más elevados, o para poder postear links a otras webs. Normalmente yo sugiero establecer un requisito o control previo para registrarse, pero en ciertos proyectos esto no es posible. Así que si tu página requiere el registro público, y se te está llenando de sploggers, usuarios spam o no deseados, sugerimos este plugin, Wangguard. Wangguard no es del todo gratuito, pero lo es para páginas de menos de 5,000 usuarios al día mientras sea para uso personal (un blog por ejemplo): “WangGuard Always will be free for personal use, this means that whenever you have less than 5,000 daily registrations or you make less than $200/month, you never have to pay anything for WangGuard.” Puedes usarlo sin problemas, y si tienes una página con más de 5000 registros, o es profesional, paga la opción siguiente. Para poder activar el plugin, necesitas una clave API desde la página de WangGuard (registrándote), y con ella pegarla en la configuración del plugin. Tiene muchas opciones, y no sólo se puede instalar en WordPress, también en otros CMS. Es importante saber que el plugin APRENDE con el tiempo, y los creadores sugieren una semana para que el plugin coja algo de experiencia y empiece a reconocer bien a los sploggers.    

Diseño Web, Gestores de contenidos, Seguridad

Como activar SSL para Wordress cuando tienes un certificado, por ejemplo de Let’s Encrypt

/

Creo que casi todos habéis oído que Google premia, y lo hará más, a las webs que tienen certificado, es decir que funcionan con SSL. Las que puedes entrar con https://.. Y como antes eran caros, se abrió un proyecto (una apuesta de varias empresas) para obtener certificados gratuitos: Let’s Encrypt. Muchos proveedores de hosting, como nosotros, estamos presentando esta opción a los clientes. Así que ahora los clientes pueden tener certificado de manera asequible. Pero recordad que la primera parte, la activación, debe hacerse a nivel del servidor, o sea el proveedor (a menos que tengáis un servidor dedicado). Vamos a hablar del tema en el que ya tenemos un certificado…¿cómo hacemos que mi web en WordPress funcione con SSL? Hoy os contamos dos maneras: Por plugin (más sencillo): Hay un plugin excelente, que nos facilita la activación de https en WordPress. No activa lo necesario y pone los códigos que necesitamos. Really Simple SSL es perfecto para eso. Las estadísticas lo avalan: 4,9/5 de puntuación, y más de 40.000 instalaciones activas. Esto es lo que hace: El plugin soluciona la mayoría de los problemas de WordPress con ssl, como el tan discutido problema de balanceo de carga, o cuando no se ha definido ninguna variable del servidor. Todas las peticiones entrantes se redirigen a https. Si es posible con .htaccess, en caso contrario mediante javascript. La url del sitio y la url de portada se cambian a https. Tu contenido inseguro se repara reemplazando todas las urls http:// por https://, excepto enlaces a otros dominios. Se hace de manera dinámica, así que no se hacen cambios en la base de datos (excepto en el siteurl y homeurl). Por lo tanto te lo recomendamos. Olvídate de problemas. Manualmente. Tienes que añadir en httaccess para hacer las redirecciones que llegan:   RewriteEngine On RewriteCond %{SERVER_PORT} 80 RewriteRule ^(.*)$ https://tudominio.com/$1 [R,L] Y luego fuerza SSL en WordPress:   define(‘FORCE_SSL_LOGIN’, true); define(‘FORCE_SSL_ADMIN’, true);

Diseño Web, Gestores de contenidos, Trucos

Hacer una copia local de tu Prestashop para poder trabajar con él sin estar en producción

/

Ayer nos hizo una petición un amigo, cómo hacer una copia de un Prestashop activo para poder trabajar con él. Porque si, lo puedes poner en mantenimiento, pero entonces los clientes dejan de verlo y, si va a tardar (por ejemplo un cambio de plantilla) o no estás seguro si lo que vas a hacer funcionará, no es buena idea. Consejo: No hagáis cambios en producción (y menos en viernes). Nosotros solemos trabajar sobre copias de las webs, en nuestros servidores o en otros directorios del hosting del cliente. Este método sirve para ambos casos.  También para mover tu web a otro hosting. Si no tenéis otro servidor, y vuestro hosting está limitado de espacio u otros recursos (los Prestashop “tiran” mucho de recursos) podéis instalar un WAMP en vuestro ordenador y seguir estos pasos. Eso si, entonces no podréis trabajar desde varios ordenadores o mostrarlo fácilmente al cliente al ser una instalación local. Pasos: Haz una copia de los ficheros (por FTP) y de la base de datos (por phpMyAdmin o lo que te deje el hosting). No sólo porque vas a necesitarla, sino que siempre es una buena costumbre antes de modificar nada. Nosotros SIEMPRE hacemos una copia de seguridad antes. Así puedes volver atrás sin problemas. Si gestionas otro servidor puedes crear otro hosting con un subdominio (por ejemplo prueba.tudominio.com) y subir ahí los ficheros. Si quieres hacerlo en tu hosting actual, crea otro subdirectorio en la raíz y llámalo, por ejemplo DesarrolloX8rTL. Los dígitos del final son una manía de informáticos por hacer un poco más difícil que entre “gente no deseada”. Sube los ficheros a ese directorio o al nuevo hosting. Crear en el hosting que estés usando (el nuevo o el actual) una nueva base de datos. Llámala como quieras desarrollo_web por ejemplo. Importa la base de datos que salvaste, la copia de seguridad, a esta nueva base de datos. Ya tienes una copia de la información de la web en otra base de datos. Ahora CUIDADO. Si entras en la web de desarrollo (tudominio.com/desarrollo_web) está apuntando a la base de datos antigua. Esto es un fallo que hemos cometido todos. Te pones a trabajar haciendo cambios y se hacen en la web original, porque la copia está apuntando a la base de datos original. Repito CUIDADO. Para solucionar esto tienes que ir al directorio config de la copia y editar el fichero settings.inc.php. Ahí verás un campo que pone define(‘_DB_NAME_’, ‘XXX’) . Cambia ese XXX por el nombre de tu nueva base de datos, la de desarrollo. Si has creado la base de datos en otro servidor tendrás que modificar el Server también…pero eso depende de cada caso. En principio sólo el DB_NAME. Guarda los cambios. Ahora si intentas entrar en la web no funcionará, pero si podrás (seguramente) entrar en el backend (tudominio.com/adminXXXX donde XXXX son unos caracteres que cambian en cada instalación). Esto es porque hay que decirle a Prestashop que tiene otro directorio. Entra en el backend con el usuario y contraseña originales (ten en cuenta que todo eso es igual al ser una copia). Ve a Preferencias>Seo+URLs y baja hasta el apartado donde pone Dominio de la tienda y Directorio raíz. Ahora los cambios dependen del procedimiento usado para hacer la copia: -Cambia Dominio de la tienda si has creado otro hosting, por ejemplo el prueba.tudominio.com de antes. Si estás en el mismo hosting (en un subdirectorio) no lo toques. -En Directorio raíz tienes que poner el directorio de la copia. Si  lo has puesto en el raíz de otro dominio no lo cambies. Si lo has creado en el mismo hosting pero en un subdirectorio, pon el subdirectorio (por ejemplo /desarrollo_web/). Guarda los cambios (pero no salgas del backend). Prueba a entrar en el frontend de la copia. Por ejemplo http://prueba.tudominio.com o http://tudominio.com/desarrollo_web). Debería entrar. Si no entra vuelve al backend y limpia caché. Ahora para verificarlo, pon la copia en mantenimiento y vete a la original. Si la original no ha cambiado está todo bien, estás en una copia y puedes actualizar, modificar o hacer lo que quieras. Si no revisa los pasos. Con esto ya debería estar. Si no puedes hacer el paso 7 porque no entras en el backend, tendrás que cambiar las url en la base de datos. Eso lo explicaremos en otro artículo. Esperamos que os sea útil.    

Diseño Web, Seguridad

Por qué debes mantener tu página Web en WordPress actualizada. Si no puedes, contrata soporte.

/

Si tienes una página web, hay una gran posibilidad que la tengas en WordPress. Según estadísticas de W3techs, WordPress es el motor del 26,6% de las páginas web que existen, y es el gestor elegido en un 59,4% de las páginas que usan un gestor de contenidos. Es por eso por lo que es también uno de los sistemas más atacados y con más riesgo de que se vean comprometidos. ¿Por qué querría nadie atacar mi web? Hay muchas razones por las que alguien querría atacar tu web, por poco importante que creas que sea. Las enumeramos rápidamente: Dinero: La razón más importante y más común. A grandes rasgos hay dos maneras de ganar dinero con el ataque. 1)Por un lado pueden introducir código en tu página que haga que los usuarios que la vean se descarguen programas tipo viruso (ransomware, spyware, pharming….). De esa manera eres un foco de infección y, cuando se descargan el programa, este les roba datos de cuentas bancarias etc. 2) Por otro lado pueden insertar código en tu web que redirija a los usuarios a sus páginas o a anuncios de las mismas, de manera que les proporcione dinero por clic. Y pueden ganar mucho así. Por ver si pueden: hay mucha gente aburrida, o probando cosas en Internet….y muchas veces el reto de “ver si puedo entrar en esta web”, es suficiente para atacar y destruir tu página. Uso de recursos: tu web puede hackearse para usarla para otras actividades. Como hacer que forme parte de una botnet, para hacer ataques de denagación de servicio o de fuerza bruta a otros servidores o para enviar spam.  Cuantos más servidores tengan en estos grupos atacados, mejor (y antes) realizan esas actividades ilícitas. Se calcula que hay más o menos medio millón de ataques por minuto en el ciberespacio, y más de 30.000 webs son hackeadas al día. ¿Qué puede pasar si tu web es hackeada? Por un lado se pueden estar realizando actividades delictivas desde ella. Puede ser un foco de virus. Imagínate la imagen si alguien se infecta por un virus o le roban la cuenta por entrar en tu web. En ambos casos anteriores, limpiar la web puede ser más caro que un mantenimiento mensual o trimestral. Directamente te puede afectar porque, en el ataque menos dañino, la web “se caiga”. Esto, si tienes copia de seguridad, no conlleva mas que volver a subirla (tiempo o dinero). ¿Pero la tienes? Muchos no. Los buscadores como Google ahora muestran mensajes de alerta MUY llamativos cuando detectan que tu web tiene código malicioso. Esto da una imagen horrible a tu marca. Obviamente puede penalizarte en el SEO y ser muy difícil recuperarse (y caro). Google pone el aviso en seguida, y luego puede eliminarte del buscador (no se si es mejor aparecer con el aviso o que te quite). Si te elimina del buscador, puedes tardar meses de mucho trabajo en recuperarlo. Tu dominio puede aparecer en listas negras (una o varias) lo que afecta, no sólo al SEO, sino también a correos (más opciones de aparecer en la carpeta de spam o  de ser devueltos). En el caso que tratamos, una página de WordPress, ¿cuales son los métodos de ataque más comunes? Lo podéis ver en la imagen de la derecha. Esta imagen refleja claramente que, si haces una labor preventiva de mantenimiento y actualización de los plugins de tu página, del core (el propio Wordpress), así como un control  o políticas de control de la fortaleza de las contraseñas, reduces en más de un 70% el riesgo de ataques a tu página. Por lo tanto, Razones para actualizar un WordPress: Seguridad. Obvio. Cada actualización de los componentes tapa agujeros de seguridad. Correcciones. Tanto de la funcionalidad de WordPress, como del tema y plugins. Nuevas funcionalidades. Del core. WordPress está mejorando cada día. Compatibilidad de los componentes. Cuanto más actualices, más compatible será. Aunque si no actualizas otros componentes…puede que tengas problemas por actualizar. Si no puedes, o no sabes, realizar tu este mantenimiento, puedes contratar empresas que, como la nuestra, lo hagan cada cierto tiempo. Prevenir, siempre es más barato que lamentarse y curar después.

Diseño Web, Gestores de contenidos

Restringir productos a ciertos clientes en Prestashop. Grupos.

/

En ocasiones nos han pedido para algún proyecto que sólo ciertos clientes puedan ver algunos productos en Prestashop. Hoy os explicamos cómo. La manera más sencilla de hacer esto es con los grupos. Para crear un grupo tienes que ir al backoffice, Clientes ->Grupos. Ahí puedes crear un grupo, ya sea para restringir productos o categorías, desactivar módulos para ellos o para hacer descuentos o precios especiales. Por ejemplo llámalo Grupo Especial. Una vez creado el grupo, deberías crear una categoría para los productos que van a estar ahí, por ejemplo llámala Productos del Grupo Especial. Ahora sólo tienes que asignar los productos a esta categoría, e irte a los usuarios a los que quieres añadir en el grupo y hacerlo (en Clientes, el Usuario, Grupos). Con esto, la gente que se registre en la tienda, y pertenezca al grupo, podrá ver los productos y la categoría. Los que no estén registrados, o no pertenezcan al grupo, no podrán ver ni la categoría (y por tanto tampoco los productos).      

Diseño Web, Gestores de contenidos

Cambiar la página y mensaje de mantenimiento en Prestashop

/

Cuando vas a hacer un cambio y un Prestashop, y no quieres que se puedan hacer compras o se visione la página, debes poner la página en mantenimiento. Para ello puedes ir a Preferencias ->Mantenimiento. Ahí en Activar la tienda debes poner No. Si tu quieres poder ver los cambios, aunque esté en mantenimiento, debes poner tu IP en IP de mantenimiento o pinchar en Añadir mi IP (buena opción para hacerlo automático). Eso si, la página de mantenimiento de Prestashop es fea… La verdad es que la son las de todos los gestores. Algunas plantillas te dejan modificarlo, pero en la mayoría tienes que hacerlo a mano. Aquí te dejamos cómo cambiarla. Mensaje: Lo puedes cambiar en Localización ->Traducciones eligiendo el apartado, plantilla e idioma. Aspecto: Tienes que modificar la página por CSS. La plantilla que se activa es  /themes/tuplantilla/maintenance.tpl. Pero donde más tendrás que cambiar será:  La imagen. Suele estar en  /themes/tuplantilla/img/maintenance.png ,  /themes/tuplantilla/img/bg_maintenance.png o similar. CSS. El fichero a modificar es  /themes/tuplantilla/css/maintenance.css Con eso, y un poquito de “arte” y CSS, tendrás una página de mantenimiento adecuada.  

Diseño Web, e-Learning, Gestores de contenidos

Establecer la página por defecto de usuarios al registrarse en Moodle

/

Moodle, en la mayoría de las instalaciones, requiere que los usuarios se registren para ver el contenido (de su curso por ejemplo). Cuando un usuario sin registrar ve la página, suele ver la página de Incio, que puedes modificar para que quede visualmente agradable. Cuando entras en un contenido registrado, te lleva a la página donde poner tu usuario y contraseña. Página que ya os enseñamos a modificar. Y cuando has introducido estos datos, te suele llevar a la página Área Personal, que es una especie de Escritorio personal de cada usuario. Con sus cursos, sus detalles y además es una página que ellos pueden modificar. Sin embargo he encontrado que esto lía a casi todos los usuarios. Prefiero que vayan directamente de nuevo a la página de Inicio cuando se registren, y vean ahí contenido como sus cursos, cursos disponibles etc. Para ello hay que cambiar dónde van los usuarios registrados. Ve a Administración del sitio -> Apariencia -> Navegación. Ahí en el primer apartado veréis la opción: Página de inicio predeterminada para los usuarios defaulthomepage. Por defecto tiene Área Personal. Yo la suelo cambiar a Sitio (que es la página de Inicio). Más información aquí.

Diseño Web, Gestores de contenidos

Módulo gratuito Open Graph, OG, para Prestashop

/

Aunque esto está cambiando poco a poco, no todas las plantillas de Prestashop, ni todos los módulos, tienen bien configurada la opción de Open Graph, OG, que usan redes sociales como Facebook para presentar la imagen de la publicación. Y entonces nos encontramos con que cuando intentamos compartir una página (por ejemplo la raíz) o publicación de Facebook, Pinterest etc, no nos aparece imagen (o no la que queremos). Hoy en día esto es esencial. Además, las etiquetas og son importantes para el SEO y buen aspecto de la página en los buscadores. Afortunadamente hay módulos gratuitos como este Facebook Open Graph Module, ahora para 1.5 y 1.6 pero (según dice) con actualizaciones gratuitas de por vida), que no solucionan este problema. Este módulo añade las etiquetas necesarias de og a todas las página, información de precio y moneda al objeto og en el producto, es compatible con Pinterest, imágenes en fabricantes y distribuidores….Se puede además escoger la imagen por idioma. Muy sencillo pero eficaz para quien tenga este problema en su Prestashop.      

Diseño Web, e-Learning, Gestores de contenidos

Como añadir un chat en una actividad de Moodle

/

Hace unos días un cliente estaba emitiendo un streaming en una página en Moodle y quería poner chat en esa actividad para que los alumnos pudieran hacer preguntas, e interactuar con el que impartía el curso. El chat no es útil en todas las actividades, pero si en aquellas donde van a participar más de un alumno a la vez. Os dejamos cómo activarlo: Primero, una vez dentro de la actividad, tenéis que ir arriba a la derecha y pinchar en Activar Edición Después, pincha en “Añadir recurso o actividad” (en la propia página). Igual que añadías un cuestionario. Ahí elige la actividad Chat. Tienes que añadir un nombre al chat, una descripción, y cuándo se hacen las sesiones (frecuencia). También si quieres que se guarden y vean las sesiones anteriores. Con eso ya lo tienes, un chat en tu actividad, donde los alumnos pueden conversar con los profesores.

Scroll al inicio