Free Images
An image can become that key element to capture your users' attention and keep them on your website longer, whether they're reading the content associated with that chosen image or being offered related products and services.
There are several free online sources with spectacular images that can help you find that eye-catching element you're looking for. So, we'll show you different free image banks where you can search, choose, download, and use them whenever you need them.
commerce.conDrupal.com, permite crear tu tienda gracias a los módulos de commerce, complementado por otras funcionalidades como (Maquetador en tiempo real, animaciones, librería de componentes, entre otras. VER DEMO
conDrupal.com, permite crear proyectos Drupal Standard, complementado por otras funcionalidades como (Maquetador en tiempo real, animaciones, librería de componentes, entre otras. VER DEMO
Una Aplicación Web Progresiva, permite instalar nuestra web, en cualqueir dispositivo, como si se tratara de una aplicación nóvil nativa. Este comportamiento permite a los usuarios acceder más fácilmente, porque añade un icono en su pantalla.
Otra de las ventajas de una Aplicación Web Progresiva, es que permite el envio de notificaciones push, que el usuario recibirá automáticamente, cuado la haya instalado. VER DEMO
Panel de Control
Cuando iniciamos sesión con nuestros datos en la plataforma, nos redirige automáticamente al Panel de Control, cuyas opciones varían según los permisos que tenga el usuario.
El propósito de este panel, es facilitar el acceso a todas las funcionalidades con las que tienes que interactuar regularmente.
El panel está formado por varios bloques personalizables, en los que tendremos la oportunidad de añadir menús completos, listados y tablas con vistas, o cualquier tipo de enlace.
Personalizar el Panel
En cuanto colocas el ratón sobre cualquier elemento del panel, se activará automáticamente el editor en línea.
Si esto no ocurre, puedes activarlo, desde la pestaña ubicada en la parte superior derecha de la pantalla, seleccionando EDITAR.
A continuación, en la parte inferior de la pantalla, verás el selector que activa o desactiva la edición del panel.
Dependiendo de lo que quieras hacer, podrás habilitar o deshabilitar, luego de guardar los cambios, verás el resultado esperado al volver al Panel de control.
Tienes dos posibilidades de edición del panel y sus elementos.
Editar contenidos globalmente:
En la parte superior de todas las páginas verás la opción Editar contenido página, al hacer clic sobre ella, el editor te permitirá modificar todos los contenidos y te devolverá al mismo lugar cuando se guarden tus cambios.
Editar contenidos individualmente:
Si haces clic sobre cualquiera de los bloques, sin activar el editor global, se abrirá una página distinta, específica para ese bloque, donde podrás modificar su contenido. Al guardar los cambios, permanecerás en el mismo lugar..
Componente Referencias de bloques:
El componente Referencias de bloques, permite añadir algunos accesos que se actualizarán automáticamente, como el menú de atajos. Esto resulta muy útil en el Panel de Control, porque el usuario podrá ir añadiendo atajos desde cualquier punto de la web y se actualizarán de manera automática en su Panel.
Para añadir nuevos enlaces al menú atajos, nos colocaremos en el contenido o funcionalidad que deseamos y si vemos una estrella junto al nombre, daremos clic sobre ella y automáticamente se añadirá en su lugar del panel de control.
Este componente puede tener restricciones de permisos, por lo que deberás consultar con el administrador del sitio en caso de que no te permita realizar esta operación.
(Se recomienda añadirlo dentro de un envoltorio de componente para controlar paddings, márgenes, bordes, etc.)
Modificar Bloque duplicando manualmente:
En algunas ocasiones, es posible que tu proyecto requiera un nivel de personalización tan flexible, que la creación de tablas dinámicas usando vistas de Drupal, no sea suficiente para suplir esa necesidad.
Por esta razón, dentro del Panel de control o en la biblioteca de componentes reutilizables, encontrarás este componente que podrás ajustar al nivel que requiera tu proyecto.
El proceso de edición es el mismo que en los demás componentes reutilizables, deberás hacer clic en el icono de editar, hasta acceder al nivel en que quieras hacer la modificación.
Si quieres duplicar una línea completa, deberás hacer clic en el botón de duplicar, y una vez guardado el cambio, podrás volver a acceder y ejecutar el resto de ajustes.
Una vez duplicado el componente, podrás moverlo de posición hacia arriba o abajo según la necesidad.
Dependiendo del nivel al que hayas añadido los cambios, tendrás que hacer clic en el botón guardar hasta que veas en la parte superior de la pantalla un mensaje confirmándose que se ha realizado correctamente.
(Se recomienda añadirlo dentro de un envoltorio de componente para controlar paddings, márgenes, bordes, etc.)
La página de inicio es el primer contacto que tienen los usuarios al visitar nuestro sitio web, por eso es muy importante que sea lo suficientemente atractiva y con la información adecuada para mantener el interés y despertar la curiosidad por saber un poco más mientras permanezcan conectados.
conDrupal.com ofrece varios modelos de páginas de inicio preconfigurados, que podrás personalizar con tu información, además tendrás la opción de añadir componentes individuales, como carruseles de imágenes, banners, textos, botones, entre otros.
En el caso de que optes por crear desde cero tu página inicio, te enseñaré brevemente lo más relevante para el proceso.
El primer paso consiste en seleccionar desde el menú administración, la opción Crear y luego elegir Home Page o Página de Inicio.
A continuación se abrirá una nueva página, divida en dos columnas, en la parte izquierda tenemos los campos relacionados con el contenido de la página, que son: el título de la página, la parte del contenido central, que podrás añadir con todos los componentes que necesites y un campo del tipo taxonomía o vocabulario llamado Categorías, cuyo fin es clasificar y facilitar su búsqueda.
En la columna derecha, están las configuraciones de la página, relacionadas con el menú, restricción de acceso en caso de que lo necesites, las opciones del mapa del sitio, el alias de url, que se generará automáticamente, entre otras.
Para comenzar con tu página de inicio, lo primero que necesitas es añadir un título, al guardar el cambio, se generará automáticamente la url y podrás continuar con el resto de contenidos desde el maquetador en tiempo real.
A partir de ese momento, el próximo paso será elegir si quieres utilizar un envoltorio global para toda la página, si quieres usar varios envoltorios de componentes individuales y personalizarlos o elegir componentes existentes desde la librería, ahorrándote el tiempo de las configuraciones iniciales y enfocarte en agregar las personalizaciones.
A continuación veamos los pasos para crear una página de inicio con un sólo Envoltorio o Layout, con el que definiremos toda la estructura de la página y, a continuación, añadiremos varios componentes reutilizables desde la biblioteca.
Por último, modificaremos la configuración del sitio para que muestre la nueva página, como su página principal.
Recuerda que puedes trabajar en cualquier página antes de publicarla, hasta que tengas la versión definitiva, en esta demostración, sólo nos enfocaremos en los pasos para añadir los componentes sin los ajustes finales para que quede perfecta a nivel gráfico.
En una instalación tradicional de Drupal, encontramos dos tipos de contenido que son el artículo y la página básica, con el objetivo de ofrecernos un punto de partida para nuestros proyectos.
conDrupal.com ha querido ir un poco más allá, incorporando otros tipos como la Página Home y la Página Interior, incrementando las posibilidades de creación gracias a los envoltorios o layouts y a los componentes reutilizables.
Para comenzar, en el menú de administración, daremos clic en contenido y luego seleccionaremos el tipo Página Interior en el filtro.
conDrupal.com incluye múltiples ejemplos para que no tengas que empezar desde cero en tus creaciones.
Daremos clic en algunas para ver la que más nos interesa y luego la clonaremos, de esta manera, no perdemos nuestra guía inicial.
Entre los ejemplos tenemos páginas creadas con un solo envoltorio o Layout, con varios envoltorios, con degradados y hasta combinando vistas y textos.
Una vez elegida la página interior que utilizaremos como modelo, el siguiente paso será clonarla, de esta manera nos ahorraremos el tiempo de empezar desde cero. Para clonar cualquier contenido, dentro del listado, marcaremos el checkbox al lado izquierdo de su nombre y luego seleccionaremos la opción Clonado en masa del selector en la parte inferior de la página.
Esto generará una copia idéntica, añadiendo al título la indicación de que se trata de un clonado, para facilitar que la identifiquemos rápidamente y podamos trabajar con ella.
El siguiente paso sería actualizar el título y con eso se actualizará la url que se genera automáticamente; luego podremos comenzar con los ajustes y modificaciones según lo que necesitemos en el proyecto.
Con el clonado nos evitamos invertir tiempo en detalles de diseño como degradados, padding, márgenes o colores, además tenemos la posibilidad de añadir en cualquier momento con el editor en tiempo real.
Si preferimos trabajar desde cero, daremos clic en la opción Crear del menú de administración y a continuación se abrirá una nueva página, dividida en dos columnas, en la parte izquierda tenemos los campos relacionados con el contenido de la página, que son: el título de la página, la parte del contenido central, que podrás añadir con todos los componentes que necesites y un campo del tipo taxonomía o vocabulario llamado Categorías, cuyo fin es clasificar y facilitar su búsqueda.
En la columna derecha, están las configuraciones de la página, relacionadas con el menú, restricción de acceso en caso de que lo necesites, las opciones del mapa del sitio, el alias de url, que se generará automáticamente, entre otras.
A partir de ese momento, el próximo paso será elegir si quieres utilizar un envoltorio global para toda la página, si quieres usar varios envoltorios de componentes individuales y personalizarlos o elegir componentes existentes desde la librería, ahorrándote el tiempo de las configuraciones iniciales y enfocarte en agregar las personalizaciones.
conDrupal.com, es una plataforma pensada para que cualquier usuario, sin conocimientos sobre programación o maquetación web, pueda crear un sitio web completo o una página de aterrizaje independiente, utilizando únicamente la interfaz de usuario de Drupal.
Esto implica que el usuario podrá construir sus contenidos, combinando varios componentes como si fueran piezas de Lego, y al mismo tiempo, tendrá la capacidad para añadir animaciones, sombras, márgenes, paddings y otras variantes, de forma individual o agrupando estos componentes.
Para facilitar la implementación, conDrupal.com, utiliza varios tipos de envoltorios, con el objetivo de cubrir todas las posibilidades de comportamientos.
Estos son
Envoltorio Global: que permite definir la estructura de una página completa.
Envoltorio Caja: permite añadir atributos adicionales alrededor del componente Caja.
Caja: permite agrupar varios componentes con sus respectivos envoltorios.
Envoltorio Componente: cuyo propósito es añadir atributos adicionales alrededor de cualquier componente.
Envoltorio Flex 3: su objetivo es ofrecer dos columnas con tres zonas adaptables, ideal para proyectos que quieran combinar tres elementos en una cabecera, como en el caso de una tienda online.
Otra característica importante de los envoltorios, es que se comportan igual que un componente normal, es decir, que podremos guardar diferentes versiones de envoltorios en la biblioteca, identificados con una imagen de portada que nos facilitará su identificación, y luego importarlos para su implementación en nuevos contenidos.
En la plataforma conDrupal.com, el Envoltorio Global, permite definir la estructura completa de columnas para una página o para el equivalente a un bloque tradicional de drupal, añadiendo múltiples opciones de personalización como diferentes configuraciones de márgenes y paddings independientes para PC y móvil, degradados, imagen de fondo con efectos, entre otras.
El Envoltorio Global es la primera de las opciones que nos aparece al crear o editar los tipos de contenido Página Inicio, Página Interior o Landing Page.
Al hacer clic para añadirlo, se abrirá en la pestaña Diseño, donde podremos escoger la disposición de las columnas y filas que tendrá el envoltorio antes de añadir el resto de componentes.
Una vez elegida la plantilla, daremos clic en la pestaña Contenido, donde encontraremos el listado con el resto de opciones de personalización para el envoltorio.
Al hacer clic sobre cada pestaña, veremos en la parte derecha, los valores disponibles para añadir, aplicar o modificar, según las necesidades del proyecto.
Cuando hayamos completado los cambios, daremos clic en el botón guardar de la parte inferior para aplicarlos al Envoltorio global.
En la plataforma conDrupal.com, la manera más práctica de añadir modificaciones alrededor de los componentes, cuando utilizamos el editor en tiempo real, es a través de los Envoltorios, esto permite definir varios atributos que podrán compartirse entre múltiples componentes sin tener que definir repetidas veces en cada ocasión.
Recuerda, que estas opciones se encuentran al hacer clic en la pestaña Contenido, dentro de la ventana de edición para el envoltorio.
Otro detalle a tomar en cuenta, es que el aspecto de la interfaz puede cambiar si realizas la edición de tus contenidos, desde el backend, es decir con el tema administrador, o desde el editor en línea, que utiliza el theme frontend.
Tienes libertad de elegir cualquiera de las dos maneras, ya que el comportamiento final no quedará afectado.
Añadir Contenedor:
La plataforma conDrupal.com utiliza los contenedores fluidos de bootstrap para todo el sitio, esto permite que todos los contenidos ocupen todo el ancho de la pantalla en todos los dispositivos.
La opción Añadir contenedor, ofrece la oportunidad de insertar un contenedor normal, para que podamos añadir, por ejemplo, un color o imagen de fondo que ocupe todo el ancho y otros componentes que se ajusten al centro, como en la página inicio.
En la plataforma conDrupal.com, la manera más práctica de añadir modificaciones alrededor de los componentes, cuando utilizamos el editor en tiempo real, es a través de los Envoltorios, esto permite definir varios atributos que podrán compartirse entre múltiples componentes sin tener que definir repetidas veces en cada ocasión.
Recuerda, que estas opciones se encuentran al hacer clic en la pestaña Contenido, dentro de la ventana de edición para el envoltorio.
Otro detalle a tomar en cuenta, es que el aspecto de la interfaz puede cambiar si realizas la edición de tus contenidos, desde el backend, es decir con el tema administrador, o desde el editor en línea, que utiliza el theme frontend.
Tienes libertad de elegir cualquiera de las dos maneras, ya que el comportamiento final no quedará afectado.
Añadir Padding:
En la plataforma conDrupal.com, podrás definir valores globales, que se aplicarán alrededor de todo el componente o por separado para cada uno de los lados superior, laterales e inferior, además, podrás hacerlos de forma independiente para ordenadores y para dispositivos móviles.
Esto ofrece la posibilidad de obtener resultados completamente distintos en todos los dispositivos, sacando el mayor provecho posible según el tamaño de la pantalla y la información que quieras mostrar a los usuarios.
En la plataforma conDrupal.com, la manera más práctica de añadir modificaciones alrededor de los componentes, cuando utilizamos el editor en tiempo real, es a través de los Envoltorios, esto permite definir varios atributos que podrán compartirse entre múltiples componentes sin tener que definir repetidas veces en cada ocasión.
Recuerda, que estas opciones se encuentran al hacer clic en la pestaña Contenido, dentro de la ventana de edición para el envoltorio.
Otro detalle a tomar en cuenta, es que el aspecto de la interfaz puede cambiar si realizas la edición de tus contenidos, desde el backend, es decir con el tema administrador, o desde el editor en línea, que utiliza el theme frontend.
Tienes libertad de elegir cualquiera de las dos maneras, ya que el comportamiento final no quedará afectado.
Añadir Padding:
En la plataforma conDrupal.com, podrás definir valores globales, que se aplicarán alrededor de todo el componente o por separado para cada uno de los lados superior, laterales e inferior, además, podrás hacerlos de forma independiente para ordenadores y para dispositivos móviles.
Color de fondo fijo y degradado:
La aplicación de un color o la combinación acertada de varios colores, puede marcar la diferencia, para llamar la atención de tus usuarios, destacar una información o, sencillamente, hacer tu web más atractiva a la vista.
En la plataforma conDrupal.com, podrás añadir un color de fondo plano o una combinación de varios colores, con distintas formas de efecto degradado, para obtener un acabado novedoso, divertido o mucho más profesional, dependiendo de lo que persigas para tu proyecto.
Si quieres añadir un color plano de fondo a tu envoltorio, tendrás que seleccionar la pestaña con el nombre Color de fondo y, a continuación, elegir el que más nos guste y luego dar clic en el botón guardar los cambios.
En el caso de los colores degradados, tenemos dos pestañas asociadas, en la primera, con el nombre Colores degradados, escogeremos entre tres opciones, el color inicial, el color central y el color final.
A continuación, en la pestaña con el nombre Extras degradado, podremos elegir el tipo de degradado, el ángulo que se aplicará, la orientación del degradado y si queremos que éste se repita.
Antes de aplicarlo, si queremos hacernos una idea de las posibilidades, encontraremos varias muestras en el apartado de Degradados, dentro del menú de Recursos Gratuitos.
En la plataforma conDrupal.com, la manera más práctica de añadir modificaciones alrededor de los componentes, cuando utilizamos el editor en tiempo real, es a través de los Envoltorios, esto permite definir varios atributos que podrán compartirse entre múltiples componentes sin tener que definir repetidas veces en cada ocasión.
Recuerda, que estas opciones se encuentran al hacer clic en la pestaña Contenido, dentro de la ventana de edición para el envoltorio.
Otro detalle a tomar en cuenta, es que el aspecto de la interfaz puede cambiar si realizas la edición de tus contenidos, desde el backend, es decir con el tema administrador, o desde el editor en línea, que utiliza el theme frontend.
Tienes libertad de elegir cualquiera de las dos maneras, ya que el comportamiento final no quedará afectado.
Añadir Imagen de fondo
Otro de los recursos que suele explotarse para destacar o resaltar tu contenido, o para darle un aspecto distrito a tu proyecto web, consiste en utilizar imágenes de fondo en lugar de aplicar sólo colores.
En la plataforma conDrupal.com, además de que puedes añadir imágenes de fondo a tus envoltorios, cuentas con varias opciones adicionales como la de aplicar efectos css, modificar su posición, las repeticiones, entre otras.
El proceso para añadir una imagen de fondo en tu envoltorio es muy sencillo y requiere de interactuar con dos pestañas. En la primera, con el nombre Imagen de fondo, subiremos una imagen desde nuestro ordenador o elegiremos alguna de la biblioteca, gracias al módulo Media Library integrado en la plataforma.
Una vez cargada la imagen, daremos clic en la pestaña con el nombre Ajustes Imagen de Fondo, donde encontraremos el resto de posibles configuraciones disponibles para aplicar a nuestra imagen.
En el caso de que quieras aplicar efectos a tu imagen de fondo, recuerda que previamente necesitarás haber asignado un color de fondo en la pestaña con el nombre Color de Fondo, ubicada un poco más arriba.
Si prefieres consultar antes de aplicar el efecto a tu imagen de fondo, puedes consultar dentro del apartado Imágenes y filtros, del menú Recursos Gratuitos.
