Dale identidad a tu sitio
Define el nombre, el logotipo y los iconos, para que el sitio se lea como tuyo y no como el de la capa.
La capa se entrega sin identidad a propósito: sin nombre, sin marca, sin iconos. Un sitio que la extendiera y mostrara la identidad de duxt estaría anunciando el proyecto de otro, así que cada una de estas cosas la defines tú — y hasta entonces, la cabecera recae en un icono genérico de libro.
Pasos
- El nombre.
titlees la palabra en la barra de navegación, en la plantilla del título SEO, en el 404, en el canal RSS y como encabezado dellms.txt. Un valor, siete lectores.export default defineAppConfig({ duxt: { title: 'Acme SDK' } });
Igual en todos los idiomas, así que una cadena simple es lo correcto. Donde no lo sea, la forma de registro funciona aquí como en cualquier otro sitio — mira Varios idiomas. - El logotipo, si tienes uno.
logo.srcsustituye el par de icono y nombre por una imagen.srcDarkse intercambia por CSS bajo la clasedark, no por script — una elección por script representa la marca clara en el HTML del servidor y la cambia tras la hidratación, lo que se ve como un parpadeo.logo: { src: '/wordmark.svg', srcDark: '/wordmark-dark.svg', alt: 'Acme SDK' }altrecae entitle, así que defínelo solo donde la marca diga algo que el nombre no dice.
Cada logotipo tiene su propia proporción, por eso el componente fija la altura y deja que el ancho la siga. Una marca pensada para una caja cuadrada se verá famélica; una mucho más ancha que alta no se aplastará.
- Los iconos del navegador. Esto no es configuración de duxt, sino entradas normales de head de Nuxt — porque un favicon es de un sitio, nunca de un tema.
app: {
head: {
link: [
{ rel: 'icon', type: 'image/svg+xml', href: '/favicon.svg' },
{ rel: 'apple-touch-icon', href: '/apple-touch-icon.png' }
]
}
}
Un icono SVG puede llevar su propia regla prefers-color-scheme, así que un
archivo cubre una franja de pestañas clara y una oscura. El PNG (180×180)
existe solo porque iOS ignora los iconos SVG.
- La línea de atribución, si la quieres fuera. El pie lleva una línea
"Powered by duxt" con la versión de la capa.
poweredBy: falsela quita — una capa a la que no se le puede decir que deje de nombrarse a sí misma es adware.
Lo que sigue siendo de la capa
Colores, espaciado y componentes son otra cuestión, y otra página: Sobrescribir el tema. Esta página cubre la identidad: el nombre y la marca. Merece la pena mantenerlas separadas, porque un color de marca suele resultar ser un token y no una bifurcación del tema.
Lista de comprobación
-
titleestá definido y nada en la cabecera sigue leyéndose como "Documentation" -
logo.srcDarkestá definido, o la marca es legible sobre ambos fondos - El favicon y el apple-touch-icon resuelven — ambos se sirven desde
public/ -
llms.txtyrss.xmlnombran tu sitio, no un marcador de posición -
poweredByes una elección deliberada y no un valor por defecto que nadie miró