SEO

配置

打开根目录下的 config.js 文件，添加 appName、appDescription 和 domainName 的值。这些值将用作默认的 SEO 标签。

config.js
const config = {
  appName:        "OneDay.Build",
  appDescription: "OneDay.Build 为个人开发者或初创公司提供了一套基本功能包，用于构建 SaaS 平台。NextJS 样板工程包含构建 SaaS、AI 工具或其他 Web 应用的所有必要组件。",
  domainName:     "OneDay.Build",
  contactEmail:   "bassnova@gmail.com",
  ogImage: "https://OneDay.Build/images/og.png",
	links: {
		twitter: "https://twitter.com/bassnova",
		instagram: "https://instagram.com/OneDayBuild",
	},
}

如何使用

此功能用于为网页生成一组 SEO 相关的元数据标签。这些标签可以在页面的头部（<head>）中使用，以提高页面在搜索引擎中的可见性和排名。

这些是你可以添加到页面的所有 SEO 标签。

它已经添加在根目录的 layout.js 中，所以你不必将它添加到每个页面。

要在不覆盖所有标签的情况下向页面添加自定义 SEO 标签，请执行以下操作：

import { getSEOTags } from "@/libs/seo";
...

export const metadata = getSEOTags({
title: "Dashboard | oneday.Build",
canonicalUrlRelative: "/dashbaord",
});

export default async function Dashboard() {
...

此函数返回一个包含所有这些 SEO 相关信息的对象。这些信息基于提供的参数和来自 @/config 的默认配置。

我建议为每个页面设置规范 URL（export const metadata = getSEOTags({canonicalUrlRelative: "/"});）

Schema 标签

来自 /libs/seo.js 的 renderSchemaTags() 函数用于向网页添加结构化数据。它是一个 JSON-LD 格式的脚本，告诉搜索引擎页面内容的详细信息。结构化数据帮助搜索引擎更好地理解页面内容，并可能产生富结果，这些结果在搜索结果中更突出显示，可以提高点击率。

打开组件查看更多文档。这里是一个示例：

import { renderSchemaTags } from "@/libs/seo";

export default function Page() {
return (
<>
{renderSchemaTags( )}

  <main className="flex min-h-screen flex-col items-center justify-center text-center gap-12 p-8">
    <h1 className="text-3xl font-extrabold">快速发布</h1>
...
  </main>
</>
);
}

在这个函数中，<script> 标签的 dangerouslySetInnerHTML 属性用于插入 JSON-LD 数据。这个 JSON 包含以下信息：

@context 和 @type：定义数据的上下文和类型，在本例中是 SoftwareApplication。
name：应用程序的名称。
description：应用程序的描述。
image：应用程序的图标或图片。
url：应用程序的 URL。
author：应用程序的作者信息。
datePublished：发布日期。
applicationCategory：应用程序的类别。
aggregateRating：应用程序的综合评分，包括评分值和评分数量。
offers：应用程序的报价信息，包括价格和货币。

这些信息应根据实际应用程序或网页内容进行自定义。

信息

Google 富结果的结构化数据。了解更多
在这里找到你的类型（SoftwareApp、Book 等）。
使用这个工具检查数据结构是否正确。

SEO

配置

Meta

如何使用

Schema 标签

网站地图

SEO

配置​

Meta​

如何使用​

Schema 标签​

网站地图​

配置

Meta

如何使用

Schema 标签

网站地图