gpt4 book ai didi

next.js - NextJS动态标题

转载 作者:行者123 更新时间:2023-12-04 01:41:49 24 4
gpt4 key购买 nike

一直在谷歌搜索,找到了改变<title>的方法.就是这样:https://github.com/zeit/next.js/tree/master/examples/layout-component

主要问题是每次有人刷新站点/更改页面时,标题都会从 http://localhost:3000 开始。到实际标题(例如关于我们),我有点害怕这会如何影响 SEO。

动态更改页面标题的正确方法是什么?

我的布局文件:

import Link from 'next/link'
import Head from './../node_modules/next/head'

export default function Layout({ children, title = 'Welcome to my website' }) {
return (
<div>
<Head>
<title>{title}</title>
</Head>

{children}
</div>
)
}

最佳答案

退房 next-seo并将其安装在您的 next.js 应用程序中。

yarn add next-seo 
# or
npm install --save next-seo

它将神奇地为您处理页面标题和元描述。

import React from 'react';
import { NextSeo } from 'next-seo'; // then add the `NextSeo` at any `pages/` that you wish

export default () => (
<>
<NextSeo
title="About Us, or just any title that you wish"
description="Then with a short description here."
/>
<p>Simple Usage</p>
</>
);

我自己也实现了同样的策略 web app这里。

关于next.js - NextJS动态标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57126760/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com