Cómo personalizar elhead
etiqueta de su aplicación Next.js
Desde cualquier componente de la página Next.js, puede agregar información al encabezado de la página.
Esto es útil cuando:
- quieres personalizar el título de la página
- quieres cambiar una metaetiqueta
¿Cómo puedes hacerlo?
Dentro de cada componente puede importar elHead
componente denext/head
e inclúyalo en la salida JSX de su componente:
import Head from 'next/head'
const House = props => (
<div>
<Head>
<title>The page title</title>
</Head>
{/* the rest of the JSX */}
</div>
)
export default House
Puede agregar cualquier etiqueta HTML que desee que aparezca en el<head>
sección de la página.
Al montar el componente, Next.js se asegurará de que las etiquetas dentroHead
se agregan al encabezado de la página. Lo mismo al desmontar el componente, Next.js se encargará de eliminar esas etiquetas.
Descarga mi gratisManual de Next.js
Más próximos tutoriales:
- Empezando con Next.js
- Next.js vs Gatsby vs create-react-app
- Cómo instalar Next.js
- Vincular dos páginas en Next.js usando Link
- Contenido dinámico en Next.js con el enrutador
- Alimente datos a un componente Next.js usando getInitialProps
- Aplicar estilo a los componentes de Next.js con CSS
- Precarga de contenido en Next.js
- Usando el enrutador para detectar el enlace activo en Next.js
- Ver fuente para confirmar que SSR está funcionando en Next.js
- Next.js: rellene la etiqueta principal con etiquetas personalizadas
- Implementar una aplicación Next.js en Now
- Next.js: ejecuta código solo en el lado del servidor o del cliente en Next.js
- Implementar una aplicación Next.js en producción
- Cómo analizar los paquetes de aplicaciones Next.js
- Módulos de carga diferida en Next.js
- Agregar un componente contenedor a su aplicación Next.js
- Los íconos agregados por Next.js a su aplicación
- Paquetes de aplicaciones Next.js
- Cómo usar el enrutador Next.js
- Cómo utilizar las rutas de la API de Next.js
- Cómo obtener cookies del lado del servidor en una aplicación Next.js
- Cómo cambiar el puerto de una aplicación Next.js