LogoLogo
  • Bienvenido!
  • Manual de uso
  • Configuración tienda online
  • Videos
Powered by GitBook
On this page
  • Creación del primer Supersitio
  • Selección de plantilla
  • Configurar Supersitio
  • Configuración de idioma, visibilidad y SEO
  • Colores y diseƱo
  • MenĆŗ superior
  • Alineación de menĆŗ
  • Logotipo
  • Ajustes generales
  • Estilo botones
  • Textos y contenido del sitio
  • Imagen superior
  • Texto #1
  • Texto #2
  • Video Corporativo
  • Texto #3
  • Configuración de la tienda y productos
  • Equipo de la compaƱƭa
  • Crear miembros de equipo
  • Información de contacto
  • Estilo
  • Contenido
  • Información de contacto
  • DiseƱo de formulario
  • Estilo del botón
  • Blog
  • Dirección y mapa
  • Dirección
  • Redes sociales

Manual de uso

Primeros pasos para crear Supersitio desde ceros para usuarios nuevos

PreviousBienvenido!NextConfiguración tienda online

Last updated 2 years ago

Atencion: Toda la documentacion redactada aplica para todos los usuarios de SUPERSITIOS de Clickpanda.com, esta documentacion se encuentra actualizada en la version 2.0

Creación del primer Supersitio

Al ingresar por primera vez te encontrarƔs con el dashboard, donde podrƔs ver todos los Supersitios que vayas creando.

Si aĆŗn no tienes el tuyo creado, solo debes dar clic en ā€œCrear tu primer sitioā€.

Selección de plantilla

En Supersitios creamos 4 plantillas en nuestra primera actualización para que las personas de la Versión 1 puedan actualizar su sitio web, tienes las siguientes opciones: Dream House, Future, Web Food y Root Beer.

Puedes conocer estas plantillas dando clic en ā€œvista previaā€.

Lo visualizarƔs asƭ:

En esta vista podrƔs observar el diseƱo responsivo al sitio web dando clic en los botones de referencia de escritorio, tableta y celular.

Su tamaño se ajustarÔ según el dispositivo que elijas.

En el caso de que no te guste la plantilla y quieras ver otra, puedes dar clic en ā€œAtrĆ”sā€.

Y si deseas escoger la plantilla que estĆ”s viendo, solo debes dar clic en ā€œUsar esta plantillaā€.

Posteriormente te saldrĆ” una imagen que te indicarĆ” que se estĆ” preparando tu plantilla, la cual debes esperar a que se configure para empezar a trabajar en tu Supersitio.

Configurar Supersitio

DespuĆ©s de esperar a que se configure la plantilla que seleccionaste, debes iniciar el siguiente paso seleccionando el nombre de tu Supersitio (en el caso de que ya tengas el nombre de tu dominio debes escribirlo sin su extensión), como ejemplo usaremos: supersitiobogota.com e ingresaremos supersitiobogota. DespuĆ©s debes hacer clic en ā€œSiguienteā€.

NOTA: Recuerda que el dominio debe estar disponible o ser registrado previamente.

Configuración de idioma, visibilidad y SEO

En esta sección empezarÔs a completar la información de tu sitio web. Te explicaremos uno a uno:

· Supersitio habilitado: Si dejas desmarcada esta opción nadie podrÔ ver tu sitio web hasta que tú mismo la vuelvas a habilitar. Muchas personas utilizan esta opción para publicar su Supersitio una vez esté completo.

· Supersitio bilingüe: Esta opción te va a permitir crear tu Supersitio con dos idiomas en caso de que lo necesites.

· Título de sitio: Este es el texto que va aparecer en las pestañas de los navegadores de tus visitantes y el título que aparecerÔ en Google o buscadores de Internet.

· Descripción del sitio: Este es el texto que se mostrarÔ como resumen de tu Supersitio en los navegadores y motores de búsqueda en Internet.

· Idioma principal del sitio: En esta opción debes seleccionar el idioma con el que vas a crear tu Supersitio; esto ayuda a Google a identificar y posicionar tu Supersitio.

IMPORTANTE: Ten en cuenta que estas opciones las debes tener muy en cuenta al momento de como va aparecer tu sitio web en google o motores de busqueda

Colores y diseƱo

En esta sección vas a empezar a hacer tus primeras personalizaciones. Las podrÔs realizar haciendo uso del siguiente menú de navegación. Ahora te vamos a explicar cada una de sus funciones:

En la función 1, tendrÔs modo pantalla completa, en la que se mostrarÔ toda la pÔgina web que vas creando en pantalla, sin menú de edición. Para volver a la edición, solo debes dar clic en el siguiente botón:

En la función 2, podrÔs ver tu pÔgina web de forma responsiva en los tamaños que selecciones, estos pueden ser escritorio o celular.

En la función 3, podrÔs ver el estado de guardado automÔtico de tu Supersitio según vayas avanzando.

En la función 4, podrÔs volver al dashboard de tu Supersitio, donde encontrarÔs todas las herramientas de administración de tu Supersitio.

MenĆŗ superior

Tipo de menĆŗ

En esta sección tendrÔs dos opciones:

  • Ancho completo: Esta opción tomarĆ” todo el ancho de la pantalla del navegador para desplegar los elementos del menĆŗ, asĆ­ como el logo y sus ubicaciones.

  • MenĆŗ centrado: Esta opción genera una relación tipo caja, donde los Ć­tems dejarĆ”n de estar a los lados de la pantalla y estarĆ”n en una sección mĆ”s centrada.

Alineación de menú

EncontrarÔs la alineación tradicional, con el logo a la izquierda y el menú a la derecha; pero también hemos implementado menú centrado, poniendo el menú a la izquierda y el logo al medio (esta opción estÔ condicionada a que el tipo de menú siempre sea centrado).

Logotipo

En esta sección podrÔs subir tu logo o podrÔs crear uno, para subir el logo solo necesitas una imagen .png o .jpg con las siguientes dimensiones: 250px de ancho y 75px de alto.

TambiƩn podrƔs crear tu logotipo agregando un texto, color, tipo de fuente y un ƭcono que podrƔs encontrar a mano izquierda.

A este ƭcono podrƔs cambiarle el color de forma independiente al del texto.

Ajustes generales

Estos ajustes se configuran para todo el sitio web, incluyendo la fuente y el color de fondo. Debes tener en cuenta que, si modificas el tipo de fuente en otros aspectos y quieres la general para el resto de texto, debes dejarla configurada como la tienes inicialmente.

Estilo botones

En esta opción podrÔs configurar todos los botones de tu sitio web, pero no incluye el botón de tu formulario en caso de usarlo. Si deseas personalizar el botón de formulario, ve a la sección de formulario, para su modificación.

En este menú de edición agregamos opciones como el radio o curvatura de las esquinas de los botones.

Si quieres que la letra esté mÔs cerca del bordeado o del borde del botón, puedes aumentar o disminuir el margen interno de botones.

Textos y contenido del sitio

En esta sección encontrarÔs todo lo que corresponde a la imagen superior que se encuentra debajo del menú, a los textos que se encuentran debajo de la imagen y debajo de tus productos, así como también, la posibilidad de agregar un video de presentación de tu negocio o productos.

Imagen superior

En esta sección podrĆ”s agregar una imagen que tiene como nombre ā€œbanner de sitio webā€ en la que puedes usar un fondo o una fotografĆ­a atractiva y llamativa de tus productos, que impacte a tus clientes o visitante para que conozca mĆ”s sobre tu negocio o emprendimiento. Esta imagen debe cumplir con los siguientes requisitos:

Formato .jpg

Peso mƔximo 1MB.

Dimensiones sugeridas 1980px ancho y 800px alto

Texto #1

En esta sección ajustarÔs el texto e imagen del banner según como lo vayas a organizar, a continuación, te mostraremos las distribuciones asignadas:

Nota: A continuacion veras las distribuciones de imagen para el texto y el banner 1

Primero imagen, despuƩs texto

Primero texto, despuƩs imagen

Texto/imagen

Imagen/texto

Texto sobre imagen - centrado / altura parcial

Texto sobre imagen - centrado / altura total

Texto sobre imagen - derecha / altura parcial

Texto sobre imagen - izquierda / altura parcial

Estas son las distribuciones que puedes hacer un el banner de tu sitio web.

Texto #2

Esta sección estarÔ ubicada debajo de tus productos. Tiene las mismas condiciones de distribución de imagen y texto para que puedas asignar un aviso muy llamativo para tu negocio.

Adicional, hemos agregado un gestor de imagen para que no sea solo texto. PodrƔs agregar una imagen con efecto parallax, donde la imagen estarƔ estƔtica y, si bajas o subes en tu sitio web, se podrƔ ver un efecto de movimiento en la imagen.

Video Corporativo

A veces tenemos videos subidos a YouTube para promocionar nuestros productos, para subirlos usualmente copiamos y pegamos todo el link del video, en este caso vamos a poner de ejemplo este video:

Lo que tendrƔs que hacer es copiar el ID del video y pegarlo en tu Supersitio.

El código es lo que va despuĆ©s de ā€œv=ā€, en este caso el código serĆ­a: 75a1BUOd7wU y es el que debes poner en el espacio de ā€œID del videoā€.

Texto #3

Esta sección es similar a Texto 1, solo que su ubicación cambia a la parte inferior del video. Comparte las mismas configuraciones.

Configuración de la tienda y productos

Conoce en la siguiente pƔgina toda la guƭa para configurar tu tienda y crear tus productos.

Equipo de la compaƱƭa

Como opción inicial podrÔs activar o desactivar esta sección en el caso que no desees mostrar el equipo de trabajo.

Crear miembros de equipo

En esta sección podrÔs mencionar a cada uno de los miembros de tu equipo de trabajo, especificando su cargo, escribiendo un resumen sobre sus funciones y también su experiencia.

Para iniciar su creación solo debes dar clic en ā€œcrear miembroā€ y se abrirĆ” una nueva pestaƱa en tu navegador, en esta pĆ”gina vas a poner los datos de cada miembro de tu equipo.

Después crear los perfiles de cada uno de los miembros de tu equipo, podrÔs elegir su ubicación y distribución, ya sea en modo carrusel o en combinaciones mosaico.

Mosaico

Carrusel

Información de contacto

En este espacio podrĆ”s crear toda la sección de ā€œcontĆ”ctenosā€, donde encontrarĆ”s un formulario en el que debes ingresar la información de contacto de tu empresa. Puedes habilitar o deshabilitar esta sección dependiendo de si deseas o no mostrar esta información de tu empresa.

Estilo

En esta opción podrÔs configurar el color de fondo del formulario de toda la sección.

También, cambiar el color de texto y tamaño de la información que agregues. Como opción de alineación, tienes la ubicación del texto a la izquierda, derecha o centrado.

Contenido

El texto de la sección de contacto estÔ ubicado en la parte superior de la información de contacto que desees escribir.

Información de contacto

En esta sección podrÔs agregar la información de tu empresa y contacto para que todos los clientes que visiten tu sitio web puedan contactarte, también tenemos una opción donde puedes agregar el número telefónico para tu WhatsApp y, así, puedan escribirte.

DiseƱo de formulario

Con estas opciones podrƔs configurar todo tu formulario, ya sea con tamaƱo de letra, color de texto dentro del formulario y su altura en cada casilla asignada.

También podrÔs asignar bordes, colores y dimensiones para su personalización.

Estilo del botón

Esta opción de edición para tu formulario te permitirÔ modificar el botón de acción de envío de información de dicho formulario.

PodrÔs poner el fondo transparente o retirar el borde del botón, igual verÔs la configuración de forma predeterminada.

Blog

En esta sección podrÔs crear artículos de interés para incrementar el trÔfico de tu sitio web, dar consejos y tips, también dar información sobre la utilidad de tus productos o las últimas tendencias del sector. Esta sección se puede ocultar en caso de que no tengas creado un blog.

Para crear tu blog solo debes dar clic en ā€œcrear artĆ­culoā€ y se abrirĆ” una pestaƱa adicional en la que podrĆ”s redactar tu blog generando un tĆ­tulo, autor, categorĆ­a, asignarle una imagen y, sobre todo, un editor muy completo para redactar tu contenido.

En caso de tener creados artículos, puedes organizar y ubicar su distribución para la visualización de tu blog.

Dirección y mapa

En esta sección podrÔs compartir la ubicación de tu negocio con el objetivo de mostrarle a tus clientes donde queda tu local físico, en caso de que lo tengas, o especificar si eres emprendedor digital.

A continuación, te mostraremos cuÔles son las ediciones y opciones que tienes en este módulo.

Dirección

En esta opción vas a tener como opción principal mostrar u ocultar la ubicación de tu negocio, todo dependerÔ de tus necesidades.

Tienes como opción escribir dos direcciones en caso de que cuentes con uno o dos locales u oficinas físicas.

Adicional, podrÔs compartir la información de tu ubicación como, por ejemplo, ciudad y departamento.

Hemos creado para ti una increĆ­ble opción, se trata de mostrarle a tus visitantes cómo pueden llegar a tu negocio, solo debes habilitar el mapa para mostrar el botón ā€œĀæCómo llegar?ā€ En esta opción debes seleccionar la ubicación de tu empresa en el mapa.

PodrÔs poner el mapa en la pantalla completa para ver bien la ubicación y escoger con precisión el lugar específico de tu negocio.

NOTA: El funcionamiento correcto estĆ” sujeto a disponibilidad de Google Maps

Redes sociales

Por último, y no menos importante, tienes la sección de redes sociales, donde solo agregando tu usuario a cada una de las opciones, se habilitarÔn.

En el caso de que no tengas una red social, por ejemplo YouTube, puedes borrar el contenido y dejarlo en blanco, de esta forma desaparecerÔ el botón de la red social.

En nuestro ejemplo la URL es:

https://www.youtube.com/watch?v=75a1BUOd7wU
Configuración tienda online
Ingreso a la plataforma de Supersitio
Eleccion de plantilla
Previsualizacion de plantilla
Modo responsivo de plantilla
Seleccion de plantilla
Configuracion de dominio
Configuracion de idioma y SEO
Edicion color y diseƱo
Editar vista previa
Menu superior
Logotipo
Ubicacion logotipo
Ajuste general pagina completa
Estilo de botones
Imagen banner 1
Video en YouTube