El Website Builder es el editor de Kajabi para las páginas estándar que forman un sitio: Home, Store, Library, Login, Blog y más. Una sola plantilla las controla todas a la vez, así que el diseño se mantiene coherente en todas partes en lugar de tener que darle estilo página por página.
Las Landing Pages son aparte: páginas individuales e independientes que creas y diseñas una por una, y que conectas a un sitio mediante enlaces y botones. El Website Builder no las modifica. Como todas las Website Pages comparten una misma plantilla, el Website Builder ofrece controles que las Landing Pages no tienen, como la configuración global. Para ver en qué se diferencian los tipos de página, consulta Descripción general de las páginas.
La página Design
Para llegar a la página Design, desde el Dashboard, haz clic en Website y luego en Design.
Esta página controla el aspecto general del sitio. Desde aquí puedes previsualizar el sitio en vivo, copiar la site URL, abrir Site Details, explorar la Template Store y personalizar o administrar cualquier plantilla guardada.
Puedes personalizar cada plantilla de sitio web de forma independiente de las demás, y solo la plantilla que actives es visible para los visitantes. Diseñar una plantilla inactiva es lo que te permite reconstruir un sitio tras bambalinas y lanzar el diseño terminado en un solo paso.
Instalar una plantilla del Website Builder
Desde el Dashboard, haz clic en Website y luego en Design.
Haz clic en Template Store.
Haz clic en la plantilla que quieras.
Haz clic en Add to saved templates. La plantilla se instalará.
Cambia el nombre de la plantilla por un nombre interno que puedas reconocer. Haz clic en la flecha hacia abajo junto al Title y selecciona Rename template.
Todas las plantillas te ofrecen las mismas herramientas de edición y funciones de personalización. Las plantillas prediseñadas se diferencian de las simplificadas solo en cuánto trabajo de diseño ya está hecho.
Nota: Todo lo que hay en la Template Store está incluido en todos los planes de Kajabi sin costo adicional.
Configura primero la marca del sitio
Branding define el logotipo, los colores y las fuentes con los que empieza cada página nueva en Kajabi, así que configúralo antes de diseñar páginas individuales.
Desde el Dashboard, haz clic en Settings y luego, en Site settings, haz clic en Branding.
En Logos, agrega un Logo y un Favicon.
En Typography, elige las fuentes para Headings y Paragraphs.
En Colors, configura el Brand color, el Accent color y la Global color palette.
Haz clic en Save y luego confirma con Save and apply.
Branding solo actualiza las páginas y plantillas que todavía usan la configuración global predeterminada. Todo lo que ya hayas personalizado a mano se queda como está, por eso es más rápido configurar la marca primero.
Personalizar las Website Pages
Abre la plantilla instalada en el editor y luego trabaja en sus páginas una por una.
Desde el Dashboard, haz clic en Website y luego en Design.
En Saved Templates, busca la plantilla que instalaste y haz clic en su ícono Customize.
En la parte superior del editor, selecciona una página en el menú desplegable.
Haz tus cambios y luego haz clic en Save. Guarda cada página por separado.
Nota: Usa el ícono Customize de la tarjeta de la propia plantilla, no el botón Customize de la parte superior de la página Design. El botón del encabezado siempre abre la plantilla que está en vivo en ese momento, así que usarlo cambiaría el sitio que ven los visitantes.
Para abrir una página directamente, haz clic en Website, luego en Website Pages, y haz clic en el Title de la página. Obtén más información sobre la configuración de estilo en el Website Builder.
Estructura de la página
Tanto las Website Pages como las Landing Pages están formadas por bloques y secciones. Cada sección está formada por bloques específicos; por ejemplo, la sección Hero incluye un bloque Text y un bloque Image.
Kajabi te ofrece secciones predefinidas para agilizar el trabajo, pero puedes personalizar cada sección. Agrega, elimina y edita los bloques dentro de cualquier sección que elijas.
Nota: Puedes reconstruir cualquier sección agregando o eliminando tipos de bloque, pero el resultado puede verse distinto a una sección predefinida, que incluye optimizaciones de diseño creadas para ese diseño específico. Para alinear los bloques con precisión, activa las guías y la cuadrícula en Design Tools, que te muestran el diseño de 12 columnas sobre el que se construye una página.
Qué hace cada página
Estas páginas vienen incluidas con el Website Builder y la plantilla activa las controla.
Página | Qué hace |
La página de inicio del sitio | |
Donde los clientes acceden a los Products que tienen | |
Muestra las Offers | |
Donde los clientes inician sesión | |
Se muestra después de una compra | |
La página de error | |
La página de inicio del Blog | |
Un mismo diseño para todas las publicaciones | |
Resultados de búsqueda del Blog | |
Permite que los clientes se conecten entre sí | |
Anuncios de productos y del sitio | |
La historia detrás de la marca | |
Cómo se comunican contigo los visitantes |
Los visitantes que ingresan la URL del sitio llegan a la Template Home Page, a menos que establezcas otra página como página de inicio. En el menú desplegable de páginas del editor, la Template Home Page aparece como Home.
Las páginas que tiene un sitio dependen del propio sitio. Las páginas de Newsletter aparecen cuando el sitio tiene un Newsletter, y las páginas Blog, Blog post y Blog search no están disponibles en los planes Newsletter.
Nota: Cuando inicias sesión como administrador del sitio, el Member Directory muestra a todos los miembros del sitio. Para que tus clientes aparezcan en el Member Directory ante otros clientes, deben aceptarlo desde su configuración de cliente. Obtén más información sobre el Member Directory.
La mayoría de estas páginas están marcadas como System en la lista de Website Pages y no se pueden duplicar. About y Contact son Website Pages normales, así que puedes duplicarlas, publicarlas o despublicarlas, o copiar una a una Landing Page. Para agregar más páginas a un sitio, crea una nueva Website Page o Landing Page.
Optimizar las páginas para dispositivos móviles
Las páginas que creas con el Website Builder son responsivas, así que se ajustan automáticamente a teléfonos, tabletas y computadoras de escritorio. No hay que crear una versión móvil por separado. Aun así, el contenido puede acomodarse de forma diferente en una pantalla pequeña, así que previsualiza la vista móvil antes de publicar.
Previsualizar una página en el móvil
Desde el Dashboard, haz clic en Website y luego en Website Pages.
Haz clic en el Title de una página para abrirla en el editor.
En la parte superior del editor, haz clic en el ícono del teléfono del selector de dispositivo.
Elige un dispositivo en el menú desplegable para previsualizar distintos tamaños de pantalla. Este paso es opcional.
Ajustar el diseño móvil
Los diseños móvil y de escritorio se configuran de forma independiente, así que cambiar uno no afecta al otro. Usa la configuración del diseño móvil para ajustar el padding, ocultar una sección en pantallas pequeñas o afinar el espaciado por dispositivo. Aprende a personalizar el diseño móvil de una sección.
Consejo: Si una sección se ve bien en escritorio pero amontonada en el móvil, duplícala, oculta una copia en escritorio y la otra en el móvil, y luego adapta cada una por separado.
Guardar una copia de la plantilla actual
Cambiar la plantilla en vivo reemplaza las Website Pages integradas (Home, Login, Blog y las demás) por las versiones de la nueva plantilla, y las páginas personalizadas no se transfieren en absoluto. Exporta primero la plantilla actual para poder restaurarla.
Desde el Dashboard, haz clic en Website y luego en Design.
En Saved Templates, abre el menú de más opciones (...) de la plantilla en vivo actual.
Selecciona Export as .zip.
Revisa la bandeja de entrada del correo electrónico de la cuenta de Kajabi. Kajabi envía un enlace de descarga por correo en lugar de descargar el archivo en el navegador, y el enlace vence a los 7 días, así que guarda el .zip en un lugar seguro.
Para restaurar más adelante una plantilla exportada:
Desde el Dashboard, haz clic en Website y luego en Design.
En Saved Templates, haz clic en Upload Template en la fila del encabezado Saved Templates y selecciona el archivo .zip.
Activar una plantilla
Al activar una plantilla, esta pasa a ser la plantilla en vivo que ven los visitantes. Solo puede haber una plantilla en vivo a la vez.
Advertencia: Activar una plantilla tiene efecto inmediato para los visitantes. Las Website Pages integradas cambian a las versiones de la nueva plantilla, y las Website Pages personalizadas que hayas creado (incluidas About y Contact) no se copian a la nueva plantilla. Exporta primero una copia de la plantilla actual.
Desde el Dashboard, haz clic en Website y luego en Design.
En Saved Templates, pasa el cursor sobre la plantilla.
Haz clic en Set to live template.
Haz clic en Set as live template para confirmar.
Preguntas frecuentes
¿Puedo copiar contenido de un sitio existente al Website Builder?
No de forma automática. Tienes que reconstruir el contenido manualmente con las secciones y bloques del Website Builder, página por página. Si un sitio existente está creado con la plantilla heredada Premier, sus datos del editor de código no son compatibles con el Website Builder y no se transferirán.
¿Cómo agrego las páginas Member Directory, Announcements, About y Contact?
Estas páginas vienen con las plantillas del Website Builder. Un sitio que todavía usa la plantilla heredada Premier no las tiene. Instala una plantilla del Website Builder y ponla en vivo, y las páginas aparecerán en Website > Website Pages.
¿Qué pasa con un Blog existente y sus publicaciones cuando cambia el diseño del sitio web?
El contenido de las publicaciones del blog (título, multimedia y cuerpo) se mantiene igual. El aspecto general del blog hereda el diseño de la plantilla que actives.
¿Qué pasa cuando Kajabi actualiza una plantilla?
Actualizar es decisión tuya, y nada cambia hasta que apliques la actualización. Cuando hay una versión más reciente de una plantilla guardada, aparece la etiqueta Update en la tarjeta de esa plantilla en Saved Templates.
Abre el menú de más opciones (...) y selecciona Update template para ver qué cambió y previsualizarlo antes de aplicarlo. Después de una actualización puedes usar Revert para volver a la versión anterior, pero se perderán los cambios hechos desde la actualización.
¿Por qué no hay una página Sales en la lista de Website Pages?
Las cuentas creadas después del 16 de agosto de 2020 no incluyen una página Sales. En su lugar, crea las páginas de venta como Landing Pages independientes.
¿Por qué hay dos páginas About y Contact en un menú de navegación?
Si creaste una página About o Contact y la agregaste a un menú de navegación antes del lanzamiento del Website Builder en 2022, es posible que veas duplicados, porque el Website Builder agregó páginas About y Contact oficiales como Website Pages. Elimina el enlace a la versión que no necesites. Aprende a eliminar un enlace de un menú de navegación.
¿Por qué se revirtieron las personalizaciones después de una advertencia sobre la página de inicio?
Esa advertencia significa que la página que estás editando ya no es la que se muestra cuando los visitantes ingresan la URL del sitio. Los cambios que guardaste con el botón Save siguen en la plantilla que estabas editando. Cuando el diseño esté listo, activa la plantilla personalizada y vuelve a establecer la Template Home Page como página de inicio. Obtén más información sobre cómo elegir qué página se muestra como página de inicio.