Crea una galería de imágenes para tu web

Hola, amigos y amigas de Drimgoo.

Hoy vamos a ver cómo podemos crear en apenas unos minutos una galería de imágenes en nuestra web. Con nuestro nuevo videotutorial veréis lo sencillo que es.

Videotutorial - Insertar mapas personalizados en los Datos de Contacto

  ¡Hola, amigos y amigas de Drimgoo!

  Habréis visto que en el apartado "Contactar" de vuestra web Drimgoo aparece un pequeño mapa. Podéis cambiar la localización de este mapa fácilmente utilizando Google Maps. En el videotutorial que os traemos en esta ocasión, os explicamos cómo hacerlo de forma sencilla, en tan solo dos minutos.

Cómo enlazar nuestro Facebook en Drimgoo

¡Hola, amigos y amigas de Drimgoo!

Hoy en día, las redes sociales están cada vez más presentes y tienen más actividad. Por ello, es recomendable que en nuestro sitio web coloquemos los enlaces a nuestros perfiles en dichas redes sociales. La más famosa de estas herramientas es, sin duda, Facebook. Vamos a explicar cómo enlazar nuestra página de Facebook a nuestra web Drimgoo.

Antes de empezar, hay que aclarar una cosa. No es lo mismo, aunque sí muy parecido, un perfil de Facebook que una página. Un perfil se usa a título personal, mientras que una página sirve para promocionar una marca, una empresa, una web, una organización, etc. Los perfiles nunca deberán usarse para estos fines. Las páginas no pueden crearse de modo independiente, sino que estarán asociadas a un perfil de usuario, que será el Administrador de la página. El creardor de la página podrá nombrar Administradores a otros usuarios de Facebook.

Una vez aclarado esto, vamos a empezar a explicar cómo enlazar nuestro Facebook en nuestra web. Veremos tres métodos: por enlace, por botón, o por "Me gusta". Lo primero que debemos hacer es pensar donde vamos a situarlo. Tengamos en cuenta que es algo que debe estar siempre accesible, por lo que recomendamos ponerlo en Inicio o crear un apartado nuevo en el Menú Principal cuyo nombre podría ser algo como "Redes Sociales".

Enlace

Lo primero que debemos hacer es ir a nuestro perfil o página de Facebook, según lo que queramos usar. Si es un perfil de usuario, iremos al apartado Perfil. Una vez allí, copiaremos (seleccionamos y pulsamos Ctrl + C) la URL o dirección. Recordemos que la URL se muestra en la barra de dirección, en la parte superior de nuestro navegador y es algo como "http://www.facebook.com/profile.php..." Tenemos que copiar todo lo que venga en esa barra. Por otro lado, si lo que vamos a enlazar es una página de Facebook, copiaremos la URL de dicha página.

Ahora vamos al Panel de Control de nuestra web. En el editor de texto de la página donde vayamos a crear el enlace, escribimos un texto que invite a ir a nuestro Facebook. Por ejemplo, "Visite nuestro Facebook". Seleccionamos dicho texto y pulsamos el botón de enlaces.

De esta forma, abriremos una ventana para especificar el destino de nuestro enlace. En la pestaña "General" de esta ventana, en el primer campo, "Link URL", pegamos la dirección de nuestro Facebook (Ctrl + V). Es recomendable también añadir un mensaje en el campo "Title", algo del estilo "Sígueme en Facebook". Finalmente pulsamos el botón "Insert".

Cuando tengamos el resto de la página preparada, aceptamos y listo (sin olvidar rellenar el resto de campos obligatorios, igual que hacemos cuando creamos o editamos cualquier página). Nuestro enlace tendrá un aspecto así, saliendo el mensaje que hemos escrito en "Title" al dejar el ratón sobre él.

Botón

Para colocar un botón propio, lo primero que tenemos que hacer es buscar o crear una imagen que haga referencia a la red social a la que queremos enlazar; en este caso, Facebook. Su logotipo puede servir. Cuando tengamos la imagen, la colocamos en nuestro editor de texto y después enlazamos siguiendo el proceso anterior: la seleccionamos, vamos al botón de enlaces que hemos visto antes, se abrirá la ventana que hemos visto y pegamos la dirección de nuestra página o perfil de Facebook en el campo Link URL.

"Me Gusta"

Este botón que proporciona el propio servicio de Facebook solo es posible utilizarlo para las páginas, nunca para los perfiles de usuario. Para usarlo, vamos a nuestra página de Facebook y pulsamos el botón "Editar Página", situado arriba a la derecha.

Entraremos en una pantalla con un menú de opciones a la izquierda. Ahí seleccionaremos "Recursos". En la parte central de la pantalla aparecerán distintos enlaces. Buscamos "Usa los plugins sociales" y accedemos.

Una vez hayamos accedido a "Usa los plugins", nos aparecerá una serie de elementos que podemos usar. Nosotros nos dirigiremos a "Like Box" ("Caja Me Gusta"). Veremos una ventana con una serie de campos a rellenar. Conforme rellenemos cada campo, a la derecha se actualizará la previsualización, de forma que iremos viendo a cada momento el aspecto que tendrá nuestro botón. 

En el primero de los campos, "Facebook Page URL", pegamos la dirección de nuestra página de Facebook. El segundo, "Width", es el ancho que ocupará como máximo la caja "Me gusta" en nuestro sitio web. En tercer lugar tenemos "Color Scheme" ("Combinación de colores"), opción que nos permite mostrar la caja en tono claro ("light") u oscuro ("dark").

Con el tercer campo, "Show faces" ("Mostrar caras"), especificamos si queremos que se vean las fotos de perfil de aquellas personas a las que les gusta nuestra web. En el cuarto, "Border Color", no es obligatorio escribir nada. Nos deja elegir un color para el borde que rodea la caja. Podemos escribir cualquier color, pero tendremos que hacerlo en inglés. Así, si queremos un borde rojo pondremos "red", si lo queremos azul escribiremos "blue", etc. Pero, repetimos, no hace falta especificar nada.

A continuación tenemos "Stream", que hace referencia a las últimas actualizaciones que se realizan en la página de Facebook. Si señalamos esta opción serán visibles y si no, se ocultarán. Por último, tenemos "Header" ("Cabecera"), para dejar o quitar la cabecera con el texto "Find us on Facebook" ("Encuéntranos en Facebook").

Cuando lo tengamos todo decidido le damos al botón "Get code" ("Obtener código"). Aparecerá una ventana con dos códigos. Copiamos el de iframe. Recordemos copiarlo absolutamente todo, no dejar nada fuera.

Ahora volvemos a nuestra página de redes sociales en Drimgoo, en el modo edición. En el editor de texto, pulsamos el botón "HTML" y aparecerá una ventana, donde copiaremos el código. Si ya hemos escrito algo en la página, veremos que se ha generado algo de HTML. Es importante que peguemos el código que nos ha proporcionado Facebook sin interrumpir el que ya veamos escrito en esta ventana.

Pulsamos el botón Update y ya tendremos la aplicación de Facebook en nuestra página. Guardamos y listo.

Tutoriales Cómo Crear Una Web en Pocos Pasos - Tercera Entrega

Crear y gestionar el contenido (Primera parte)

Bienvenidos a esta nueva entrega de la serie de tutoriales Cómo Crear Una Web en Pocos Pasos. Como ya sabéis, para cumplir nuestro objetivo estamos utilizando la herramienta online Drimgoo, que nos permite crear nuestro sitio web sin tener conocimientos de programación, al contrario de lo que ocurre con otros gestores de contenido. No te preocupes si te perdiste alguna de nuestras entregas anteriores, están disponibles en cualquier momento.

En esta ocasión, vamos a adentrarnos en el segundo módulo de nuestro Drimgoo, el dedicado a los Contenidos. Este apartado lo veremos a lo largo de dos entregas de tutoriales, ocupándonos ahora de las tres primeras secciones: Estructura de Contenidos, Noticias y Eventos.  

Estructura de Contenidos

En primer lugar, como siempre, tenemos que recordar que habrá que configurar la estructura una vez por cada idioma en el que trabajemos, de modo que hay que seleccionar uno de ellos, para luego repetir el proceso si tenemos más idiomas.

Una vez hayamos elegido el idioma, veremos un listado de los módulos que habíamos establecido anteriormente (en Configuración > Visualización de Módulos). Justo debajo, se encuentra la sección de Páginas Independientes, junto con la opción de modificar la página de bienvenida. Finalmente, en la parte superior a la derecha, está el botón de Nuevo Registro.

Con Nuevo Registro podemos establecer nuevos apartados en nuestro Menú Principal (incluyendo subapartados) o bien hacer Páginas Independientes que podremos enlazar en cualquier sitio de nuestra web. Vamos a verlo todo poco a poco.

Nuevo apartado en nuestro Menú Principal

Entramos en Nuevo Registro y atendemos cuidadosamente a los distintos apartados que hay que rellenar. Los dos primeros aparecerán en gris: debemos ignorarlos, pues Drimgoo los rellenará automáticamente. A continuación, nos pide que establezcamos el orden, por lo que asignaremos un número para indicar en qué posición queremos que aparezca. Por ejemplo, si queremos que sea la primera opción del Menú Principal, pondremos 1. No importa si en los módulos preestablecidos (Noticias, Galerías, etc.) hay uno de ellos con el mismo número: los números que establezcamos en esta sección tendrán prioridad sobre los otros.

Como paso siguiente, debemos asegurarnos que estamos creando un registro nuevo en Menú Principal y no en Página Independiente. De no ser así, lo cambiaremos en el desplegable que aparece en "Ubicación en el sitio". Justo después, le daremos un nombre a nuestra nueva sección.

Para darle un enfoque más práctico a este tutorial, trabajemos con un ejemplo. Imaginemos que estamos haciendo una página para una academia de refuerzo escolar y que esta sección irá dedicada a explicar los distintos cursos que se imparten. La llamaríamos, por ejemplo, "Los Cursos".

Justo después, Drimgoo nos pide que introduzcamos una Descripción y una serie de Palabras Clave. Ninguna de estas informaciones aparecerán públicamente en la web, sino que serán datos internos. Entonces, ¿por qué es imprescindible escribir estos apartados? Aunque los usuarios no puedan leer estos datos, los motores de búsqueda, como Google o Bing, sí que hacen un repaso por esta información para elaborar sus listas de resultados. Por ello, tendremos que rellenar estos huecos atendiendo a posibles búsquedas que realicen nuestros clientes potenciales.

¿Es confuso? No te preocupes, lo vemos con un ejemplo. Piensa en esta hipotética academia de refuerzo escolar que imaginábamos antes. Sus clientes potenciales, es decir, el grupo de personas cuya atención quieren captar, son padres de alumnos que llevan mal una o varias asignaturas en el colegio. Estas personas pueden buscar cursos para sus hijos en Internet. ¿Qué palabras emplearías tú para realizar la búsqueda? Posiblemente, algo tan sencillo como "cursos de refuerzo en mi ciudad". O "academia en mi ciudad", o "academia de refuerzo en mi ciudad", o "refuerzo escolar en mi ciudad"... Como ves, hay muchas posibilidades pero suelen repetirse varias palabras. Son esas las que tendremos en cuenta para rellenar estos datos. Así, en el apartado Descripción explicaríamos muy brevemente qué tipo de cursos se pueden encontrar y dónde se imparten, mientras que en Palabras Clave se escribirían aquellos términos que probablemente puedan usarse en la búsqueda. Las Palabras Clave siempre se escriben separadas por comas; en este ejemplo, podrían ser: cursos, refuerzo escolar, nombre de mi ciudad, academia...

Seguidamente, tenemos el apartado Contenido. Aquí es donde escribimos lo que queremos que se muestre en la web. Como podéis comprobar, el editor de texto funciona de forma muy similar a populares programas como Microsoft Word. Además, podéis añadir imágenes, enlaces, vídeos...

Aunque todo este panel es muy intuitivo, especialmente por la semejanza con otros programas que antes comentábamos, vamos a detenernos en dos botones que, por ser más característicos del trabajo en web, pueden resultar algo más desconocidos. Se trata de los llamados "Paste as Plain Text" ("Pegar como Texto Plano") y "Paste from Word" ("Pegar desde Word").

Para explicarlos, hay que aclarar varias cosas. A veces, alguien puede querer escribir el texto de una página web en un documento de Word para después copiarlo y pegarlo. Esto no puede hacerse. ¿Por qué? Porque el programa Microsoft Word genera una serie de códigos en el texto que, aunque sean invisibles para nosotros, entran en conflicto cuando se pega directamente en nuestra web. Si queremos copiar y pegar, lo normal es que tengamos que hacerlo a partir de un texto plano. Pero, ¿qué es un texto plano? Es un texto generado por aplicaciones como el Bloc de Notas de Windows, es decir, un texto sin formato (sin alineación a izquierda o derecha, sin negrita, cursiva, ni cualquier tipo de añadidura).

No obstante, en Drimgoo podemos copiar y pegar desde Word. ¿Cómo? Seguro que muchos ya lo sabéis, pero vamos a decirlo claramente. Primero, copiamos el texto que queremos en Word; después, en nuestro Drimgoo, pulsamos el botón "Paste from Word" y aparecerá la siguiente ventana:

Aquí, pegamos el texto que ya hemos copiado en Word. Basta con pulsar las teclas Ctrl + V de nuestro teclado, pero también se puede hacer un click con el botón derecho de nuestro ratón y seleccionar Pegar en el menú desplegable que aparecerá. Una vez tengamos el texto en esta ventana, pulsamos Insert y listo.

Por otro lado, para copiar un texto plano, basta con pegar normalmente (con las mismas teclas de antes) en el apartado de Contenido. Si esto no funcionase, utilizaríamos el botón "Paste as Plain Text".

Por último, debajo de Contenido tenemos el apartado Subir Archivo, de forma que podamos facilitar el archivo que deseemos al usuario para que lo descargue. Puede subirse cualquier tipo de archivo y cualquier tamaño. Eso sí, cuanto mayor sea el tamaño, más tardará en subirse (esto dependerá también de la velocidad de nuestra conexión a Internet) y más espacio ocupará dentro de nuestro Drimgoo. Para subir un archivo, basta con acceder a Examinar, elegir el archivo en cuestión, y luego pulsar Subir. Aparecerá un enlace al final de nuestro texto que permite la descarga de dicho elemento.

Para finalizar, pulsamos el botón Aceptar que hay abajo y surtirán efectos todos los cambios.

Bien, con esto ya tenemos un apartado nuevo en nuestro Menú Principal. Ahora aparecerá en Estructura de Contenidos junto con todos los demás. Pero notaremos una difrencia: la presencia de dos botones a la derecha de nuestro nuevo apartado, uno con el dibujo de un lápiz, una escuadra y una regla, y el otro con el aspecto de una papelera. El primero es para editar el contenido y el segundo es para eliminar el apartado.

Si vamos a Editar, acabaremos en el mismo lugar de antes pero con los datos que ya hemos rellenado antes. Podremos añadir y/o eliminar a nuestro antojo. Si vamos a Eliminar, también iremos al mismo sitio, pero no podremos cambiar nada. En su lugar, abajo del todo, nos dará la opción de eliminar también todas las páginas anidadas, es decir, todos los subapartados que hayamos creado, o bien podremos guardarlas como si fueran Páginas Independientes.

Crear un submenú 

Podemos añadir un submenú dentro de los apartados que hayamos creado. ¿Cómo? Basta con añadir subapartados (páginadas anidadas) dentro de estas nuevas secciones. El proceso es muy simple y similar al anterior.

En Estructura de Contenidos, volvemos a dirigirnos a Nuevo Registro, donde accederemos a la parte donde hemos trabajado antes para crear la nueva sección del Menú Principal. Lo único nuevo que hay que hacer es dirigirse a Ubicación en el Sitio y seleccionar la sección donde queremos que se incluya este subapartado. Según el ejemplo que hemos utilizado antes, sería  "Los Cursos".

El resto del proceso es exactamente igual que el de creación de una nueva sección. Podemos añadir tantos subapartados como queramos.

De igual forma podemos añadir otras secciones dentro de los mismos subapartados. Basta con seleccionarlos en la Ubicación en el Sitio.

Así se mostraría en el Panel de Control, dentro de Estructura de Contenidos.

Y este sería el aspecto que tendría el resultado final de cara al público.

Recuerda que puedes cambiar el color del submenú en Configuración > Estilo y Colores Base (más información en la anterior entrega de esta serie de tutoriales).

Crear una Página Independiente

Una página independiente tiene las mismas posibilidades que una página normal, excepto que a priori no se mostrará en ningún apartado del sitio web, sino que tendremos que enlazarla donde nos parezca oportuno.

Como siempre, vamos despacio y por partes. La primera Página Independiente que encontramos es la Página de Inicio, que podemos editar siguiendo el enlace que aparece en Estructura de Contenidos. Se edita con las mismas herramientas que hemos estado viendo en este tutorial.

Para crear una Página Independiente nueva, nos dirigiremos nuevamente a Nuevo Registro y en Ubicación en el Sitio seleccionaremos la opción correspondiente. El resto del proceso de creación ya lo conocemos.

Cuando ya la hayamos creado, veremos en Estructura de Contenidos el nombre de nuestra página seguido de la dirección de la página que acabamos de hacer.

Será esta dirección la que necesitaremos para enlazarla en el lugar de nuestro sitio web que queramos. Si no sabes enlazar, recuerda que en este mismo blog te explicamos cómo hacerlo. Y con esto, ya hemos visto todo lo relevante a Estructura de Contenidos.

Gestión de Noticias

Dentro del módulo de nuestro Panel de Control Contenidos, nos dirigimos a Noticias. Lo que publiquemos aquí, se verá en el apartado Noticias del Menú Principal. Esta parte del sitio web es una especie de blog que nos permite ir actualizando con asiduidad nuestro contenido e informar de novedades (o lo que queramos) a nuestros usuarios.

Para crear una noticia seguiremos un camino muy similar al que hemos seguido antes para hacer los nuevos apartados del Menú Principal. Lo primero es seleccionar el idioma en el que vamos a trabajar; luego, como antes, nos encontramos con la opción Nuevo Registro. Al acceder ahí, veremos una pantalla muy parecida a aquella con la que hemos estado trabajando tanto antes, pero hay algunos puntos cambiados.

El Código, que aparece en gris, será rellenado automáticamente por Drimgoo sin que nosotros intervengamos. La fecha de creación también aparecerá sola y no la tocaremos. A continuación, rellenamos el Título y la Descripción Breve.

Justo después nos encontramos con los campos Fecha Desde y Fecha Hasta. Aquí señalaremos el periodo de tiempo en el que queremos que nuestra noticia esté activa y visible para el público. A continuación, tenemos los Tags, que no son otra cosa que las Palabras Claves que vimos antes, de modo que rellenaremos este hueco siguiendo el mismo criterio.

Finalmente, tenemos el editor de texto, que ya lo conocemos.

Al guardar y volver a Gestión de Noticias, veremos un listado de aquellas noticias que hayamos hecho. Como siempre, tendremos la opción de editarlas o de borrarlas.

Gestión de Eventos

En el Panel de Control de nuestro Drimgoo, vamos a Contenidos, y una vez ahí, a Eventos. La interfaz es muy parecida a las que hemos estado tratando durante todo este tutorial, y en los próximos tutoriales nos encontraremos con más sitios así, por lo que cada vez nos será más fácil manejar Drimgoo.

Seleccionamos el idioma y accedemos a Nuevo Registro; estaremos ahora en Gestión de la Agenda, donde podemos definir nuestro evento de la misma forma que escribimos las noticias. De nuevo, solo cambian algunos campos.

El Código, como siempre, se rellena solo. En la fecha tendremos que indicar el día para el que tenemos previsto el evento en cuestión. Luego añadimos una Descripción Breve y los Tags o Palabras Clave, como hemos hecho antes. Finalmente, escribimos la Descripción Amplia con el mismo editor de texto que ya conocemos de sobra.

Una vez hayamos guardado el evento, volveremos a Gestión de Eventos, donde tendremos una lista de todos los eventos publicados, con opción a editarlos o eliminarlos.

En la parte pública, los eventos estarán accesibles en el Menú Principal y/o en el lateral, según lo hayamos definido en Visualización de Módulos (si no te acuerdas, repasa el último tutorial). Si los tenemos disponibles en el lateral, veremos un calendario en el que aparecerá sombreado el día actual y aquellos días para los que se señalado algún evento.

Vamos a dar esta entrega por terminada. El próximo lunes publicaremos la cuarta, en la que terminaremos de repasar el módulo Contenidos del Panel de Control de Drimgoo. Así que estad atentos, os avisaremos por nuestras redes sociales (Facebook y Twitter) cuando esté disponible.

¡Hasta pronto!