Diseño web

Cómo insertar galerías de WordPress

Galerías en WordPress

¿Sabes que en WordPress puedes insertar galerías de imágenes sin necesidad de instalar un plugin? Lo comentamos porque muchos de nuestros clientes nos preguntan. Saben que existe NextGen Gallery, pero no las galerías de WordPress! Te aconsejamos, que antes de instalar cualquier plugin de galería de imágenes pruebes esta función que trae WordPress. Si necesitas algo más complejo, busca un plugin, pero si no… ¿para qué? Lo explicamos porque reconocemos que no está tan visible y que muchos de vosotros no sabéis que existe esta posibilidad.

Paso 1: Haz clic en el icono de Añadir objeto y empieza a subir las imágenes que quieras que aparezcan en la galería.Añadir objeto

Paso 2: Una vez que tengas tus imágenes subidas, verás la cantidad de éstas en la pestaña Galería. En nuestro caso hemos subido 6 y por eso aparece Galería (6). Haz clic en esa pestaña.

Pestañas

Paso 3: Verás una tabla con todas tus imágenes. Si necesitas cambiarle el título o editar cualquier cosa puedes hacer clic en Mostrar y verás más opciones. Cuando termines de editar esa imagen guarda y pulsa Ocultar. Si no necesitas editar ninguna imagen puedes saltarte este paso.

Imágenes de la galería

Paso 4: Debajo de esta tabla, podrás ver las opciones de la galería. Sí, está un poco escondido… Lo puedes dejar como viene por defecto o cambiar el número de columnas, el orden de las imágenes, qué ocurre cuando hacemos clic en una miniatura… Esto ya es más personal, así que te aconsejamos que pruebes todas las opciones y escojas lo que más te convenga!

Opciones de la galería

Una vez que has insertado tu galería, si necesitas añadir más imágenes, haz clic encima del cuadro que se ha insertado y verás que aparecen dos iconos. El primer icono es para acceder a las opciones de la galería. Ve a la primera pestaña: Desde el ordenador y súbelas como siempre, pero no pulses en Insertar en la entrada, guarda los cambios y listo!

El segundo icono es para eliminar la galería, igual que si pulsaras suprimir con la galería seleccionada.

Editar galeria

¿Tienes dudas? Usa nuestros comentarios e intentaremos ayudarte!

Cómo desactivar los comentarios en las imágenes de la galería Carousel de Jetpack

Si ya conoces la galería de imágenes que trae el plugin de Jetpack sabrás que en cada imagen se pueden hacer comentarios. Pues bien, si prefieres deshabilitar los comentarios, puedes hacerlo copiando y pegando este código en tu archivo functions.php (ubicado dentro de la carpeta de tu tema):

[php title=»Desactivar los comentarios en las imágenes de WordPress»]

function filter_deshabilitar_comentarios($open, $idpost) {
$post_actual = get_post($idpost);

$salida = false;
if( $post_actual->post_type != ‘attachment’ ) $salida = $open;

return $salida;

}
add_filter( ‘comments_open’, ‘filter_deshabilitar_comentarios’, 10 , 2 );

[/php]

Carousel, módulo de Jetpack para las galerías de WordPress

¿Sabes que con el plugin de Jetpack puedes añadir una galería así de chula con un par de clics? Además, si ya estás usando galerías en tu WordPress, y activas Jetpack, verás como tus galerías automáticamente se ven de esta forma (haz clic en una de las imágenes para ver el efecto):

Para ello, sólo tienes que añadir las imágenes y después, en la pestaña Galería asegurarte que tienes seleccionada la opción Archivo de imagen. Y por supuesto, en la pantalla de Jetpack, debes activar el módulo de Carousel. Trae pocas opciones de personalización, pero suponemos que poco a poco se irán ampliando.

Opción de menú sin enlace en WordPress

Suponiendo que ya sabes configurar un menú de WordPress a través de la opción Apariencia -> Menús, hoy te vamos a explicar cómo hacer que una opción o elemento del menú no tenga enlace. Puede parecer algo bastante sencillo pero si nadie te lo dice, puedes pasar horas buscando una solución.

Imagínate que tienes tu típico menú en la web: INICIO, NOSOTROS, PRODUCTOS… Y dentro de PRODUCTOS tienes varias subcategorías, por ejemplo SUBCAT1, SUBCAT2… Has creado las páginas SUBCAT1, SUBCAT2, pero no has creado una página para PRODUCTOS, porque sólo quieres que sea la categoría padre, no quieres tener contenido en esa página, pero WordPress automáticamente le pone un enlace.

Pues bien, la solución es bastante fácil. Para esta opción de menú, usa un enlace personalizado y en el campo URL escribe simplemente #. De esta forma, cuando se haga clic en esta opción de menú no irá a ninguna parte, sólo servirá para abrir las subcategorías.

Cómo entregar la documentación al diseñador web

Cuando un cliente contrata una página web, no tiene porqué saber cómo entregar la documentación (textos, fotos…). Así que a continuación, os indicamos la mejor forma, o al menos para nosotros, para agilizar el proceso a la hora de hacer una página web:

  • Textos: Lo mejor es facilitar los textos en formato plano ¿y qué es esto? pues aquel que no tenga formato, es decir, no lo envíes en un documento de word porque luego tendremos que pasarlo a texto plano para la web. Puedes enviarlo en un archivo .txt o directamente en un e-mail. Si optas por el e-mail, asegúrate de especificar un asunto intuitivo. Por ejemplo, si vas a enviar el texto de la sección «Quiénes somos», podrías poner en el asunto algo como: NombreDeTuWeb: Quienes somosNombreDeTuWeb[Quienes somos], así lo tendremos todo mejor organizado. Si decides enviar archivos .txt, puedes hacerlo por correo electrónico o a través de Dropbox. Pregúntanos y te facilitaremos nuestra cuenta.
  • Imágenes: Envíanos siempre las imágenes o fotos en el tamaño más grande que tengas, ya nos ocuparemos nosotros de disminuir el tamaño o recortar. Y cuantas más imágenes mejor, nosotros nos ocuparemos de hacer una selección. Igualmente, envíalas a través de e-mail o súbelas a Dropbox. Ten cuidado al enviar por e-mail de no reducir la calidad, para asegurarte, puedes comprimir la carpeta que contenga las imágenes y listo!

Si quieres indicarnos qué fotos van en cada sección, crea una estructura de carpetas con los nombres de las secciones e incluye en cada una las fotos y el texto. También puedes cambiar el nombre a las imágenes para hacer que sean más intuitivas. Intenta ponerte en nuestra situación, intenta averiguar si de la forma que lo estás entregando podremos saber dónde va esa foto o texto dentro de una semana.

Otra cosa que te agradecemos es la organización, mejor enviar toda una sección junta (fotos y texto) que ir enviando el texto por una parte, luego una foto, después otra… Eso hará que la información no esté bien organizada y supondrá más tiempo de organización y posibles despistes.

Nuestro trabajo es realizar la página web, el tuyo es facilitarnos la información de tu negocio lo más clara posible. No olvides nunca que sabemos hacer páginas web, y que no tenemos por qué entender de una tienda de zapatos, o de hoteles, o de ropa… Si entendiéramos de todo… ¿Qué hacemos aquí? Ya nos gustaría a nosotros entender de todo!

Capturar pantalla en mac con un atajo de teclado

¿Conoces la aplicación Instantánea de tu mac? Viene instalada por defecto, y sirve para hacer capturas de pantalla. Puedes hacerla de una selección, de una ventana, de la pantalla entera e incluso con temporizador.

Puedes usar esta aplicación para hacer capturas, pero ¿sabes el tiempo que se gana usando atajos de teclado? Para ver los atajos de mac puedes acceder a las Preferencias del Sistema -> Teclado

Si miras estos atajos y no los pruebas, quedarán en el olvido, en cambio si lo haces dos o tres veces seguro que te acordarás siempre.

Puedes aprenderte el que más vayas a usar, por ejemplo, el más útil es el de capturar una selección de la pantalla y guardarlo como archivo. Si mantienes pulsado:

⌘ + ↑ + 4

Dónde ⌘ es la tecla cmd, ↑ es la tecla shift y 4 no hace falta explicarlo. Verás que el cursor de tu ratón se convierte en una cruz, esperando a que arrastres para seleccionar el trozo de pantalla que quieras capturar. Una vez que lo hagas y sueltes las teclas, tendrás el archivo en tu escritorio! El atajo parece complicado, pero es tan útil que seguro que lo aprendes rápido!

Cómo crear el favicon para tu web

El favicon es ese icono pequeñito que aparece justo delante de la dirección de tu web en el navegador, es un pequeño detalle que muchos olvidan, pero es algo que te identifica y además cuando el usuario tiene abiertas varias pestañas abiertas podrá identificar rápidamente cuál es la pestaña que quiere abrir en cada momento.

Este icono, tiene la extensión .ico y una forma muy sencilla de crearlo es a través de www.favikon.com. Hay muchas páginas donde puedes crear el favicon, pero desde nuestro punto de vista esta es una de las más sencillas.

Tendrás que subir la imagen (jpg, png, gif…) y te devolverá el favicon (archivo .ico). Te aconsejo que la imagen que subas sea cuadrada, por ejemplo 150x150px y que no uses mucho detalle, ya que al ser tan pequeño, no se verá bien.

Una vez que tengas el .ico, sólo tienes que subirlo a tu alojamiento web o usarlo en tu panel de gestión de Prestashop, WordPress

 

Crear un comando en Fireworks para usarlo en un proceso por lotes

Si sueles hacer trabajos repetitivos con Fireworks quizás deberías saber que casi siempre existen herramientas para realizar procesos por lotes. No hace mucho explicamos Cómo hacer un proceso por lotes en Fireworks, pero ¿qué ocurre si el proceso por lotes que quieres hacer no existe? Que no cunda el pánico, para eso están los comandos!

Imaginemos que queremos cambiar el tamaño del lienzo de 1000 imágenes. Sólo tienes que tener tu ventana de Historial visible y realizar el proceso con una imagen de prueba. A continuación selecciona todas las filas del historial y haz clic en el icono para copiar en el portapapeles:

A continuación abre un archivo en cualquier editor de textos y pega el código que has copiado. Sólo te falta guardar el archivo con extensión .jsf dentro del directorio:

Adobe Fireworks CS6 / Configuration / Commands

Una vez que lo guardes, y vayas al menú Comandos de Fireworks o crees un proceso por lotes lo verás con el nombre que le hayas puesto al archivo.

Listado de sitios para descargar todo tipo de recursos para tu web

A veces, si no conocemos buenas páginas donde descargar iconos, imágenes, vectores…, podemos perder mucho tiempo para conseguir lo que buscamos. Os dejo una web que llevo usando años y donde siempre suelo encontrar lo que busco, una de esas que deberían estar en tu Delicious:

Blue Vertigo

Podrás encontrar de todo: imágenes, texturas, vectores, iconos, fuentes, pinceles para photoshop, patterns, sonidos, fondos de escritorio… Y todo estructurado por categorías que indican si son recursos gratuitos o de pago.

La web tiene un diseño peculiar ya que el scroll es horizontal, algo que me resulta incómodo, pero claro, es bastante original…

Cómo descargar el archivo KML de Google Maps

Descargar el archivo KML de Google Maps es tan fácil como añadirle a la URL del mapa el parámetro output=kml seguido de &

Por ejemplo:

http://maps.google.es/maps?q=aeropuerto&hl=es&sll=37.389936,-5.997076&sspn=0.033279,0.047851&hq=aeropuerto&t=m&z=15&output=kml

Aunque ya en Google Maps tienes la opción para descargarlo directamente, en algunos navegadores esta opción no aparece.