(Inicio >> Preferencias >> Editor de Branding)
Esta característica le permite editar las imágenes del encabezado y pie de página en cada plantilla, al igual que los iconos de la página principal para el estilo.
En la parte superior de la página, aparecen dos opciones:
- Crear/cargar branding — Este botón le permite duplicar el estilo root para que usted lo pueda editar o pueda cargar un estilo nuevo que haya creado.
- Descargar/borrar branding — Este botón le permite descargar un estilo en su computadora local para editar o eliminar un estilo.
La parte superior de la pantalla Editor de branding.
- Duplicar un estilo de branding
- Descargar un estilo de branding
- Editar un estilo de branding
- Cargar un estilo de branding
- Borrar un estilo de branding
- La pantalla inicial del editor de branding
- Cambiar un logotipo
- Cambiar un icono
- Cambiar encabezado/pie de página
- Editar la UI (Editar la interfaz de usuario)
- Cambiar la imagen premostrada de un estilo (Cambiar la imagen de vista preliminar de un estilo)
- Editar un HTML de estilo
- Editar la CSS de un estilo
Duplicar un estilo de branding
Para duplicar un estilo de branding:
1. Pulse Crear/cargar branding en la primera página.
2. Escriba el nombre del estilo nuevo de branding en el campo Nombre.
- Esta característica duplicará el estilo de branding predeterminado para que usted pueda descargar o editarlo sin hacerle daño al original.
La opción Crear un estilo nuevo de branding.
3. Pulse Crear.
- WHM duplicará el estilo root.
4. Ahora puede pulsar el medio de dos opciones para editar el estilo que acaba de crear:
- Hacia atrás a editar (Volver a editar) — Regresa a la pantalla Editar branding, donde puede personalizar el tema con sus propios logotipos, encabezado, etc.
- Hacia atrás al editor de branding (Volver al editor de branding) — Regresa a la pantalla de inicio del editor de branding.
Descargar un estilo de branding
Para descargar un estilo de branding:
1. Pulse Descargar/borrar branding en la primera página.
2. Pulse el enlace Descargar junto al estilo que desea descargar.
- Si nunca ha descargado antes el estilo, pulse Descargar (sistema). Si ya ha personalizado y subido una versión de este estilo, tendrá la opción de seleccionarDescargar (suyo) para volver a descargarlo.
- Un archivo
*.tar.gz
descargará a su computadora.
La pantalla Descargar/borrar el estilo.
Editar un estilo de branding
Cuando haya descargado el estilo que desea editar:
1. Extraiga el contenido del archivo. Para lograr esto:
- Si usa una máquina con Windows®, tendrá que descargar un programa (como WinRAR) para extraer el contenido del archivo. Por predeterminación, Windows no maneja un archivo .tar.gz.
- Si utiliza una máquina con Mac® o *nix, puede usar el comando
tar -xvzf
de la CLI para extraer el contenido del archivo .tar.gz, o, simplemente, puede abrirlo con el programa de extracción que desee.
2. Cambiar los archivos a su gusto.
- Recuerde: El tamaño de las imágenes contenidas en el archivo .tar.gz debe quedarse igual para manetener la apariencia del estilo.
- Recuerde: Tendrá que dejar igual los nombres de archivo; de lo contrario, el servidor no va a saber dónde colocar los archivos en la interfaz.
3. Antes de subir los archivos al servidor, vuelva a colocarlos en un archivo .tar.gz
.
- Con el mismo programa que empleo para extraer el contenido, utilice una máquina Windows para reemplazar el contenido nuevo en un, archivo .tar.gz.
- En una máquina *nix, puede usar el comando
tar -cvzf
o comprimir el contenido del archivo de nuevo en un archivo .tar.gz con el software de compresión que elija.
¡Ojo!: Para obtener más información sobre el comando tar
, consulte las páginas man al escribir man tar
en la CLI.
Cargar un estilo de branding
Para cargar un estilo nuevo de branding:
1. Pulse Crear/cargar branding en la primera página.
2. Pulse el botón Choose file (Elegir archivo).
La opción Cargar un estilo nuevo de branding.
3. Seleccione el archivo en su computadora.
- El tipo de archivo esperado es un archivo tarball (.tar.gz).
4. Pulse Cargar.
5. Ahora puede pulsar una de dos opciones para editar el estilo que acaba de cargar.
- Hacia atrás a editar (Volver a editar estilo) — Le lleva a la página Editar estilo de branding, donde puede personalizar el tema con sus propios logotipos, encabezado, etc.
- Hacia atrás a regresar al editor de branding (Volver al editor de branding) — Le lleva de nuevo a la pantalla inicia del editor de branding.
Opciones después de cargar un estilo.
Borrar un estilo de branding
Para borrar un estilo de branding que ha cargado:
1. Pulse Descargar/borrar branding en la página inicial.
2. Pulse Borrar estilo junto al estilo de branding que quiere borrar de su servidor.
3. Confirme que quiere borrar el estilo al pulsar Remover paquete de personalización (Borrar paquete de branding) en la página siguiente.
- Pulsa Cancelar para mantener el estilo.
¡Ojo!: No puede borrar el estilo root (predeterminado) instalado con cPanel.
La pantalla Descargar/borrar el estilo.
La pantalla inicial del editor de branding
La pantalla inicial del editor de branding también tiene varias opciones de estilos existentes en su servidor. Puede acceder a una lista de cuatro opciones bajo cada estilo en su servidor y una casilla sobre el estilo.
Opciones disponibles, por estilo, en la pantalla del editor de branding.
Cómo usar estas opciones:
- Para que el estilo esté disponible para los usuarios, seleccione la casilla Activado.
- Para usar un estilo para su cuenta de cPanel, pulse Aplicar branding (Aplicar a mi cuenta).
- Para usar un estilo para todas las cuentas de sus usuarios, pulse Aplicar a todas las cuentas.
- Si accedió este editor de branding al seleccionar una plantilla desde la pantalla de branding de WHM, entonces esta opción sólo aplica a las cuentas que utilizan la pantilla seleccionada.
- Si usted es un proveedor, esta opción sólo aplica a las cuentas que usted posee que utilizan la plantilla seleccionada.
- Para más información sobre el branding de cPanel como root o proveedor, lea nuestra guía de branding avanzada.
- Para seleccionar un estilo como el estilo predeterminado para las cuentas nuevas, pulse Configurar por defecto para sus cuentas nuevas (Aplicar el estilo predeterminado a las cuentas nuevas).
- Para editar un estilo, pulse Editar branding.
La pantalla Editar el estilo.
Cuando selecciona esta opción, las siguientes opciones presentadas le permiten editar varios aspectors de la interfaz de cPanel:
- Editar logotipos
- Editar iconos
- Editar encabezado/pie de página
- Editar premostrar imágenes (vista preliminar de imágenes)
- Editar páginas de HTML
- Editar hojas de estilo
Cambiar un logotipo
Para cambiar un logotipo:
1. Pulse Editar Logotipos.
- Los logotipos se localizan en la parte superior de la interfaz de cPanel. Use la imagen en la pantalla como
La pantalla Editar logotipos.
2. Pulse el botón Choose file (Elegir archivo).
- El logotipo nuevo debe nombrarse
top-logo.png
. - Puede pulsar Resetear (Reiniciar) para cambiar el logotipo a su posición predeterminada.
3. Seleccione el archivo en su computadora que desea utilizar como el logotipo nuevo.
4. Pulse Cargar imágenes.
5. Su logotipo aparecerá en la parte superior de la pantalla de Editar logotipos.
- Seleccione y arrastre al lugar donde desea que aparezca.
- Cambie el tamaño del logotipo con los manipuladores que aparecen cuando se coloca el cursor sobre él.
- El código CSS en el centro de la pantalla se actualizará cada vez que se mueve el logotipo. Desde aquí, usted puede cortar y pegarlo en la pantalla Editar página de estilo (pulse el enlace Editar para acceder a esta pantalla).
Después de cargar el logotipo, pulse el encabezado para cambiar el tamaño o moverlo.
Cambiar un icono
Para cambiar un icono:
1. Pulse Editar iconos.
- Los iconos se encuentra en la pantalla principal de la interfaz de cPanel. Se usan para destacar las características de sus usuarios.
- Recuerde: Use iconos adecuados y claros para asegurarse de que usted y sus usuarios de cPanel puedan navegar por la interfaz fácilmente.
La parte superior de la página inicial de iconos.
2. Pulse el botón Choose file (Elegir archivo).
- Los iconos personalizados tienen que tener los mismos nombres que los originales.
- Puede pulsar Resetear (Reiniciar) para cambiar el icono a su posición predeterminada.
3. Elija el archivo que desee usar como un icono en su computadora.
La parte inferior de la página índice de editar iconos.
4. En la parte inferior de la pantalla, pulse Cargar imágenes.
- Puede pulsar Revertir todos los iconos (Reiniciar todos los iconos) para cambiar todos los iconos a sus posiciones predeterminadas.
- Puede pulsar Generar sprites si su icono no se muestra correctamente. Esto regenerará el archivo de cPanel que contiene el (los) icono(s) y puede arreglar el problema.
Más información acerca de los sprites
Los sprites le permiten ahorrar banda ancha y mejorar rendimiento al reducir el número de peticiones al servidor web. Lo hacen al almacenar todos los botones e iconos en una sola imagen. Al cargar una imagen, los sprites se deben generar de forma automática.
Sin embargo, la interfaz de WHM contiene un enlace, Generar sprites, en caso de que el proceso encuentre un problema. El enlace fue creado como una prueba de fallas y debe ser utilizado si los cambios que le ha hecho a la apariencia de la interfaz de cPanel no se aceptan de forma automática.
Cambiar encabezado/pie de página
Para cambiar el encabezado/pie de página:
1. Pulse Editar encabezado/pie de página.
- Los encabezados y pies de página se encuentran en la parte superior e inferior de la interfaz de cPanel y a menudo sirven como enlaces constantes hacia las secciones comúnmente visitadas de la interfaz.
La parte superior de la página de encabezado y el pie.
2. Busque la imagen que desea reemplazar. Para ayudarle a encontrar la imagen correcta:
- Los números rojos aparecen en el encabezado y el pie de la página. Cuando pulsa un número, el archivo que le corresponde parpadeará.
- Del mismo modo, cada archivo tiene un número de imagen que puede pulsar. Al pulsar el número, la imagen que corresponde con el encabezado o del pie de página parpadeará.
3. Pulse el botón Choose file (Elegir archivo).
- Los encabezados o pies de página personalizados tienen que tener los mismos nombres que los originales.
- Puede pulsar Resetear (Reiniciar) para cambiar el encabezado o pie de página a su posición predeterminada.
4. Seleccione el archivo que desea usar como icono de su computadora.
La parte inferior de la página de encabezado y pie de página.
5. Pulse Cargar imágenes en la parte inferior de la pantalla.
-
- Puede pulsar Resetear todos los iconos Reiniciar todos los iconos para cambiar los encabezados y pies de página a su posición predeterminada.
- Puede pulsar Generar sprites si su imagen no se muestra correctamente. Esto generará el archivo que contiene la(s) imagen(es) de cPanel y puede arreglar el problema.
Editar la UI (Editar la interfaz de usuario)
Para cambiar la apariencia general de la interfaz de usuario:
1. Pulse Editar UI (Editar la interfaz de usuario).
- Estas imágenes se encuentran en muchos lugares de la interfaz e incluyen los bordes y botones.
- Tenga cuidado de examinar cada foto y la descripción para asegurarse de que va a reemplazar los archivos correctos.
La parte superior de la página Editar imágenes de UI.
2. Pulse el botón Choose File (Elegir archivo).
- Las imágenes personalizadas tienen que tener los mismos nombres que los originales.
- Puede pulsar Resetear (Reiniciar) para cambiar la apariencia de la interfaz a su posición predeterminada.
3. Seleccione el archivo que desea usar como icono.
La parte inferior de la página Editar imágenes de UI.
4. Pulse Cargar imágenes en la parte inferior de la página.
- Puede pulsar Restablecer todas las imágenes (Reiniciar todas las imágenes) para cambiar la apariencia de la interfaz a su posición predeterminada.
- Puede pulsar Generar sprites si su imagen no se muestra correctamente. Esto generará el archivo que contiene la(s) imagen(es) de cPanel y puede arreglar el problema.
Cambiar la imagen premostrada de un estilo (Cambiar la imagen de vista preliminar de un estilo)
Para cambiar la forma en que la imagen premostrada (la imagen de vista preliminar) aparecerá en el editor de branding de cPanel:
1. Pulse Editar las imágenes premostradas (Editar las imágenes de vista preliminar).
- Puede sustituir una de las dos imágenes preliminares: la imagen grande o la imagen pequeña.
- La imagen pequeña se muestra en la pantalla inicial del editor de branding.
La parte superior de la página Editar imágenes premostradas (Editar imágenes de vista preliminares).
2. La imagen grande se muestra cuando un usuario pulsa la imagen pequeña en la pantalla inicial del editor de branding.
3. Pulse el botón Choose file (Elegir archivo).
- Debe seleccionar una captura de pantalla del estilo, ya que será más clara cuando sus usuarios seleccionan la interfaz preferida.
- Las capturas de pantalla personalizadas tienen que tener los mismos nombres que los originales.
- Puede pulsar Resetear (Reiniciar) para usar la imagen de vista preliminar predeterminada.
- Recuerde: Tiene que repetir este proceso para de las imágenes grandes y pequeñas.
La parte inferior de la página Editar imágenes premostradas (Editar imágenes de vista preliminares).
4. Pulse Cargar imágenes en la parte inferior de la pantalla.
- Puede pulsar Revertir Todas las Premuestras (Revertir todos los preliminares) para cambiar las dos imágenes de vista preliminar a sus posiciones predeterminadas.
Editar un HTML de estilo
Tiene dos opciones para editar el HTML de estilo directamente: puede usar el editor de *.html
de cPanel o puede cargar su archivo personalizado.
Utilizar el editor de HTML de cPanel
Para editar las páginas de HTML del estilo:
1. Pulse el enlace Editar páginas de HTML.
La parte superior de la página Editar HTML.
2. Pulse Editar para editar el HTML en el editor.
- Puede pulsar Reponer (Revertir) para deshacer los cambios hechos en el editor.
El editor de HTML.
3. Puede pulsar Salvar para guardar los cambios que efectuó en el editor.
- Puede pulsar Resetear (Reiniciar) para cambiar la página de HTML a su posición predeterminada.
- Puede presionar el botón derecho del ratón en el nombre del archivo de HTML para descargarlo a su computadora y editarlo en un editor de texto.
Cargar su página de HTML personalizada
Alternativamente, puede subir una página de HTML personalizada:
1. Pulse el botón Choose file (Elegir archivo) junto al archivo que desea reemplazar y navegar al archivo *.html
que desea cargar.
La parte inferior de la página Editar HTML.
2. Pulse Cargar páginas en la parte inferior de la pantalla.
- Puede pulsar Resetear (Reiniciar) para cambiar la página de HTML a su posición predeterminada.
- Puede presionar el botón derecho del ratón en el nombre del archivo de HTML para descargarlo a su computadora para editarlo en un editor de texto.
Advertencia: Si no usa un lenguaje de UTF-8, debe tener mucho cuidado de no emplearlo al crear páginas de HTML. En este caso, utilizar los datos en lenguaje UTF-8 resultará en una página corrompida.
Editar la CSS de un estilo
Para editar la hoja de estilo en cascada (CSS):
1. Pulse el enlace Editar hojas de estilo.
La página Editar hojas de estilo.
2. Haga cualquier cambio o adición en el cuadro del editor de CSS.
3. Pulse Salvar CSS para guardar los cambios.
- Puede pulsar Reponer (Revertir) para cambiar la página de estilo a su posición predeterminada.
Advertencia: Si usa un lenguaje UTF-8, debe tener mucho cuidado de no utilizarlo al crear páginas de HTML. En este caso, el uso de los datos del lenguaje UTF-8 resultará en una página corrompida.