通过上面思维导图可以大体了解pc+手机模版的代码设置的内容和目的。
本文重点介绍做seo pc+手机模版的代码设置：
1、pc网站每个页面头部文件填写3行代码。
2、手机网站每个页面头部文件填写2行代码。
举个例子：
pc端：https://cnj8.com/，手机端：https://cht.cnj8.com/，pc端和手机端是两套模板。
第一步：针对pc端需要写三行代码，写在头部文件即可。
<meta name="applicable-device" content="pc">
<meta name="mobile-agent" content="format=html5;url=https://cht.cnj8.com/">
<link rel="alternate" media="only screen and(max-width:640px" href="https://cht.cnj8.com/ ">
第二步：针对手机端需要写两行代码，写在头部文件即可
<meta name="applicable-device" content="mobile">
<link rel="canonical" href="https://cnj8.com/ ">
第三步：打开百度资源管理平台，进行适配
网址：https://ziyuan.baidu.com/mobiletools/index
将自己网站同一链接的pc端和手机端链接进行提交适配。
延伸阅读
link rel="alternate" 是html中的一个属性，它用于定义一个与当前文档相关的备用表示。这通常用于为不同的用户代理提供不同的内容版本，例如为屏幕阅读器用户提供文本版的内容，而为常规浏览器用户提供html版的内容。
具体来说，link rel="alternate" 属性有以下用途：
提供替代格式：例如，如果你有一个html页面和一个纯文本版本，你可以使用此属性链接到纯文本版本。这样，搜索引擎爬虫可以轻松地找到和索引纯文本版本的内容。
多种语言或格式：你可以使用此属性来提供同一内容的多个语言版本或格式。例如，你可以为英语、西班牙语和法语提供不同版本的同一篇文章。
无障碍性：对于那些使用屏幕阅读器的用户，他们可能更喜欢文本版本而不是html版本。通过提供文本版本的链接，你可以使你的内容对这类用户更加友好。
示例：
<head> <link rel="alternate" hreflang="en" href="https://cnj8。
com/en" /> <link rel="alternate" hreflang="es" href="https://cnj8。
com/es" /> </head>
在上面的示例中，我们为英文和西班牙文的版本提供了链接。hreflang 属性用于指定链接内容的语言。
请注意，虽然 link rel="alternate" 有其用途，但它不是强制性的。搜索引擎通常会考虑 link rel="canonical" 链接（指示内容的权威版本）而不是 link rel="alternate" 链接。不过，提供 link rel="alternate" 链接仍然是一个好习惯，因为它可以帮助搜索引擎更好地理解你的内容并提供更好的搜索结果。