Si los ajustes del diseño no te bastan, puedes añadir tu propio CSS y HTML a tu sitio web. Según lo que deba hacer el código, hay cuatro lugares para él. Todos están disponibles en todos los paquetes.
Dónde va tu código
- Hoja de estilos propia para todo el sitio web: Ajustes → Área de cabecera, sección Hoja de estilos CSS propia adicional. Tus reglas CSS se aplican a todas las páginas y también a la disposición móvil.
- Código en el área head: Ajustes → Área de cabecera, sección Código HTML propio adicional (entre <head> y </head>). Este es el lugar para las etiquetas
<style>y<link>, etiquetas meta adicionales o fuentes web. - HTML al principio o al final de cada página: Ajustes → General, sección Todo el sitio, campos Principio de cada página y Final de cada página. Adecuado para códigos de contador y fragmentos similares que deben aparecer en todas las páginas.
- Código dentro de una sola página: en el editor de contenido mediante Añadir bloque → Especial → HTML insertado, por ejemplo para un mapa, un widget o el código de inserción de un vídeo. El Editor HTML de la barra de herramientas te permite además editar directamente el HTML del contenido de la página.
Añadir tu propia hoja de estilos
- Escribe tus reglas CSS en un editor de texto y guarda el archivo con la extensión
.css. - Sube el archivo en Archivos → Subir archivos (consulta Subir archivos). Los archivos CSS pertenecen a la carpeta de archivos de código; Selección automática de carpeta los coloca allí.
- Abre Ajustes → Área de cabecera y elige el archivo en Hoja de estilos CSS propia adicional, en el campo URL (del archivo .css):.
- Haz clic en Guardar y recarga tu sitio web.
Si solo necesitas unas pocas reglas, puedes ponerlas en su lugar en el campo Código HTML de Código HTML propio adicional (entre <head> y </head>) dentro de una etiqueta <style>...</style>.
Insertar código en una página
- Abre la página en Páginas → Gestionar páginas → Editar el contenido de la página.
- Haz clic en Añadir bloque (o en Añadir elemento después en un elemento existente), abre la pestaña Especial y elige HTML insertado.
- Pega el código y guarda la página.
Conviene saber
- Tus cambios se publican de inmediato; no existe una versión de prueba separada de tu sitio web.
- El CSS propio también se aplica a la disposición móvil. Evita anchos fijos y usa
max-width: 100%para que tus elementos quepan en pantallas pequeñas (consulta Sitios web adaptados a móviles). - Los archivos HTML completos (
.htm,.html) solo se pueden subir con el paquete Premium. Para los fundamentos de HTML, consulta ¿Qué es HTML?.