DiseƱo Portal

Disponible con el mĆ³dulo Octopus Guest.

Ā 

Dentro del apartado ConfiguraciĆ³n > Splash portal > DiseƱo portal, se puede gestionar el diseƱo de los portales cautivos de todos los clientes.Ā 

Listado portales

El contenido de cada columna es:Ā 

  • Tipo: Imagen en miniatura que muestra el tipo de portal

  • Nombre: Identificador del Portal

  • Propietario:Ā Campo en el que indica en que OrganizaciĆ³n, Grupo de localizaciones o localizaciĆ³n esta asociado al portal.

  • WLANs asociadas: Numero de WLANs a las cuales esta asociado el portal. Presionando el enlace, tambiĆ©n permite asignar el portal a las WLANs de manera sencilla y masiva.Ā 

  • Operaciones individuales

    • Delete: Borrar el portal cautivo de la base de datos, estĆ” opciĆ³n solo aparece disponible si no hay ninguna WLAN asociada al portal.

    • Clonar: Clona el portal cautivo indicadoĀ y es posible modificar su configuraciĆ³n y guardarlo con otro nombre.

    • Editar:Ā Permite modificar la configuraciĆ³n del portal.

Es posible filtrar en el listado por los campos de Tipo, Nombre, Propietario, WLANs y fecha de creaciĆ³n

AƱadir o editar portal cautivo

Cuando se crea un portal cautivo, aparecerĆ” un portal cautivo con los siguientes parĆ”metros de configuraciĆ³n:

  • Nombre: Identificativo del portal.

  • Propietario: OrganizaciĆ³n, grupo de localizaciĆ³n o localizaciĆ³n a las que estarĆ” asociado el portal.

  • Template: DiseƱo del cual partiremos para realizar la configuraciĆ³n. Existen 4 templates diferentes:

    • Simple: Es el mĆ”s simple de configurar si se quiere implementar un portal de manera rĆ”pida.

    • Fullscreen: Template mĆ”s customizable, con lo cual el mĆ”s aconsejable en caso de querer un diseƱo mĆ”s personalizado.

    • Social: Aspecto basado en el muro de las redes sociales.Ā 

    • Wifi4EU: Cumple todos los requerimientos de la iniciativa Wifi4EU, promovida por la comisiĆ³n europea para ofrecer Wifi a los municipios.

Ā 

Posteriormente, o cuando pulsamos en editar un portal ya creado, se puede ver el entorno de configuraciĆ³n:

Ā 

  • ƁreaĀ de Trabajo: Permite seleccionar el Ć”rea de configuraciĆ³n del portal cautivo, ademĆ”s de observar cĆ³mo quedarĆ­a la apariencia del portal segĆŗn los cambios realizados.Ā 

  • Barra de Herramientas. Se podrĆ”n seleccionar los diferentes parĆ”metros de configuraciĆ³n.Ā 

  • Opciones de Herramientas: Dentro de cada parĆ”metro de configuraciĆ³n se observan las diferentes opciones de ediciĆ³n.

  • Opciones generales: Son comunes para todos los templates:Ā 

    • Preview: Muestra una vista previa del resultado de la ediciĆ³n del portal. Permite simular el aspecto final que visualizarĆ” el cliente, pudiendo seleccionar los mĆ©todos de acceso, el idioma y el tipo de dispositivo (desktop o smartphone)

    • Guardar: Guarda los cambios introducidos sin abandonar la ventana de ediciĆ³n.

    • Eliminar: Borra el portal de la base de datos. Esta opciĆ³n solo aparece disponible si no hay ninguna WLAN asociada al portal.

    • Validar: Salva el portal con los cambios introducidos y regresa al listado de portales.

    • Descartar: Descarta los cambios y vuelve al listado de portales. Si se han efectuado cambios sin guardar, aparecerĆ” una ventana de confirmaciĆ³n.

Ā 

A continuaciĆ³n se describen las diferentes opciones de configuraciĆ³n del portal dependiendo de la opciĆ³n seleccionada en la barra de herramientas:

  • MĆ³vil/PC: Cambio de vistas mobile y desktop en el Ć”rea de ediciĆ³n de portales. Algunos parĆ”metros de configuraciĆ³n como la imagen de backgroud difiere y es necesario configurarlo en ambas vistas. El portal es responsive, pero dependiendo de los pixeles de la pantalla del dispositivo del cliente aplicarĆ” una u otra.



  • Idioma:Ā Permite seleccionar el idioma que se muestra en el Ć”rea de configuraciĆ³n. Las opciones que se muestran serĆ”n las configuradas en el parĆ”metroĀ Idiomas de la pestaƱa Datos generales.

Ā 

  • Datos generales:

    • Nombre: Se indicarĆ” el nombre que se va a asignar al portal

    • Propietario: Se deberĆ” seleccionar unaĀ OrganizaciĆ³n, Grupo de localizaciones o localizaciĆ³n al que se atribuirĆ” el portal.

    • Idiomas: Se marcarĆ”n los idiomas que se desean que aparezcan en el portal. El idioma inglĆ©s estĆ” configurado automĆ”ticamente y dentro de los idiomas seleccionados se podrĆ” configurar cual carga por defecto, en caso de que el idioma configurado en el navegador del dispositivo del usuario no estĆ© en el listado. Tener e cuenta:

      • El portal cautivo siempre cargarĆ” automĆ”ticamente el idioma que tenga el cliente en el navegador del dispositivo y, en caso de no estar en el listado, el marcado por defecto.Ā 

      • Todos los textos editables del portal (tĆ­tulo, subtĆ­tulo, footer, ā€¦) habrĆ” que traducirlos en los idiomas configurados. De igual manera es muy importante tener en cuenta estos idiomas en la parte de configuraciĆ³n de textos legales y campaƱas.

Ā 

  • Estilos generales:Ā Posibilidad de modificar los estilos de los diferentes elementos como los botones, cajas y texto del portal.

    • Fondo: SelecciĆ³n del color que se quiere establecer para el fondo del portal.

    • Errores: SelecciĆ³n del color que se vaya a aplicar en los errores de validaciĆ³n que se puedan mostrar.

    • Radio bordes: Mediante una barra horizontal se puede seleccionar el radio de los bordes de las cajas de texto y botones.

    • Texto Font: SelecciĆ³n de fuente en la que se desea mostrar el texto del portal.

    • Texto Color: SelecciĆ³n del color de texto.

    • Botones Normal:Ā En la paleta de colores de la izquierda se puede seleccionar el color del texto en los botones y el color del botĆ³n en sĆ­.

    • Botones Seleccionado: Permite seleccionar el color del texto en los botones, y el color del botĆ³n cuando estĆ© seleccionado.

    • Cajas de texto/Color de texto: SelecciĆ³n del color de texto en las cajas de formulario.

    • Cajas de texto/Color de fondo: SelecciĆ³n del color de fondo de las cajas de formulario.

  • TĆ­tulo:Ā En cuanto a estilos es seleccionable el color, fuente, alineaciĆ³n, tamaƱo de letra e incluso y sombreado del tĆ­tulo. TambiĆ©n es configurable el texto de cada uno de los idiomas seleccionados en el portal.

Ā 

  • SubtĆ­tulo:Ā En cuanto a estilos es seleccionable el color, fuente, alineaciĆ³n, tamaƱo de letra y el sombreado del tĆ­tulo. TambiĆ©n es configurable el texto de cada uno de los idiomas seleccionados en el portal.

Ā 

  • Logo: Se deberĆ” de seleccionar la imagen que se quiera poner como logo y que se haya subido previamente, Para subir una imagen nueva simplemente se debe que pulsar con el ratĆ³n sobre la imagen que haya actualmente o sobre el icono , en caso de no tener ninguna imagen subida. Se abrirĆ” una galerĆ­a de imĆ”genes donde se podrĆ”n ver todas las que tenemos subidas actualmente . Con el botĆ³n de la papeleraĀ  se podrĆ”n borrar las imĆ”genes que deseemos. Con el botĆ³n es posible subir nuevas imĆ”genes.

Ā 

  • Imagen:Ā Se deberĆ” seleccionar la imagen que se quiera y que se haya subido previamente, Si no se desea poner ninguna imagen, es posible seleccionar un color de fondo. Es posible aplicar transparencia a la imagen sobre un color de fondo, muy Ćŗtil en caso de querer resaltar el formulario de autenticaciĆ³n y textos. El proceso para seleccionar imĆ”genes, subir nuevas o borrarlas es igual que en la secciĆ³n "Logo". Para que la imagen se vea correctamente es conveniente configurarla con los siguientes formatos:

    • Desktop: JPG/PNG |Ā 1024px Ɨ 512px

    • Mobile: JPG/PNG |Ā 375px Ɨ 518px

Ā 

  • Cabecera:Ā Es posible seleccionar un color de fondo en la cabecera, al cual tambiĆ©n se puede aplicar transparencia. TambiĆ©n se puede elegir el color de texto que aplicarĆ” al selector de idioma.

Ā 

  • Pie de pĆ”gina:Ā Posibilidad de seleccionar un color de fondo al footer o pie de pĆ”gina, al cual tambiĆ©n se puede aplicar transparencia, tambiĆ©n el color de texto y tipo de fuente que aplicarĆ” al texto. El texto tambiĆ©n se podrĆ” traducir en cada uno de los idiomas seleccionados en el portal.

Ā 

Para mayor claridad, en la secciĆ³nĀ VideotutorialesĀ es posible visualizar un ejemplo de configuraciĆ³n del portal.