如何使用Publii在Netlify上构建免费静态网站

[{"id":"33c1f26a-1a82-4cb7-bc03-fd7e599e29af","type":"publii-paragraph","content":"如何使用Netlify构建静态网站\n
Netlify是新一代站点和应用程序主机的一部分，旨在为开发人员提供一个存储文件、部署和开发应用程序或运行网站的地方，类似于AmazonS3和GitHub等其他知名解决方案。虽然这些服务一开始使用起来可能看起来很复杂，但一旦你设置好，你就可以让Publii处理一切。\n
那么如何设置呢？按照这个简单的分步指南！我们将带您完成创建空间并将Publii链接到它所需的一切。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"e0cadcc7-d5c7-4b59-be93-3038b1a2204b","type":"publii-paragraph","content":"在Netlify上创建网站\n
请按照以下步骤为您的网站创建一个区域。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"06f5e67b-bd06-4368-9313-c3c8b5b9ba33","type":"publii-paragraph","content":"1.转到Netlify主页并登录您的帐户，或者单击“注册”按钮进行注册（如果您尚未注册）。要开始使用，您只需提供用户名、密码和电子邮件地址;无需支付任何信息。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"d6d9c1a4-09a7-4ffa-9a3f-915a9454333e","type":"publii-paragraph","content":"2.登录后，您会看到“您的网站”屏幕，该屏幕应该是空的，因为我们还没有创建网站！","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"96b1741e-d6ac-4efc-b42e-f43522bbcfdc","type":"publii-image","content":{"image":"./media/posts/5/netlify-dashboard.webp","imageHeight":334,"imageWidth":1932,"alt":"Netlify仪表板","caption":"Netlify仪表板"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"f6623111-0612-4ffa-935f-98fd885244e2","type":"publii-paragraph","content":"3.要创建一个新站点，我们需要将包含空index.html文件的压缩文件夹拖放到“您的站点”部分的框中，Netlify将为我们设置它。您可以从官方CDN获取现成的文件;只需下载压缩文件夹并将其拖到盒子中（不要解压缩！)","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""},"link":{"url":"https://cdn.getpublii.com/others/index.html.zip","title":"","cssClass":"","noFollow":false,"targetBlank":true,"sponsored":false,"ugc":false,"download":false}}},{"id":"03b42d5d-9d41-420d-916b-c25f451623f8","type":"publii-image","content":{"image":"./media/posts/5/upload-site-to-netlify.webp","imageHeight":1590,"imageWidth":1932,"alt":"手动将站点上传到Netlify","caption":"手动将站点上传到Netlify"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"b26a843f-344c-4f95-8902-da04cbb77465","type":"publii-paragraph","content":"4.上传文件后，您将看到“部署”屏幕;Netlify会自动为您创建一个站点名称，您可以在顶部看到该名称。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"040f9478-6b71-4310-a2be-7173e62e035b","type":"publii-image","content":{"image":"./media/posts/5/netlify-website-settings.webp","imageHeight":820,"imageWidth":1932,"alt":"Netlify网站设置","caption":"Netlify网站设置"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"8872dbf1-577c-4a79-b3f1-27819295e19e","type":"publii-paragraph","content":"5.单击站点配置。请注意您网站的NetlifyURL，您可以在下一页的框框中看到该URL，格式为https://siteName.netlify.com;我们将需要它来进行Publii设置。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"b986dec0-1dfd-4522-a2a0-f3a4de34cd9c","type":"publii-image","content":{"image":"./media/posts/5/site-name-netlify.webp","imageHeight":615,"imageWidth":1932,"alt":"Netlify站点名称","caption":"Netlify站点名称"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"cf6e27b1-51d5-402f-8da9-364c7d88cd8a","type":"publii-paragraph","content":"6.现在进一步向下滚动页面到站点详细信息部分;记下站点ID，这将是一串字符和数字，如下面的示例所示，因为我们在配置Publii（站点ID选项）时也需要它。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"53c30a56-0921-453e-a7af-c780d82abf39","type":"publii-image","content":{"image":"./media/posts/5/netlify-site-id.webp","imageHeight":860,"imageWidth":1872,"alt":"Netlify站点ID","caption":"Netlify站点ID"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"56c54128-4f81-4813-ac32-b92dfb567511","type":"publii-paragraph","content":"7.现在我们将生成一个访问令牌，Publii可以使用它来访问我们的Netlify站点;这是一点安全预防措施。单击屏幕左下角的帐户名称选项。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"79a531ce-6bbc-4aed-8794-c62770c76468","type":"publii-image","content":{"image":"./media/posts/5/netlify-account-settings.webp","imageHeight":1451,"imageWidth":1932,"alt":"Netlify帐户设置","caption":"Netlify帐户设置"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"13c5c1a4-affd-45c5-8af5-e78710f8219a","type":"publii-paragraph","content":"8.在“配置文件”部分中，单击“应用程序”选项卡，然后在“OAuth”屏幕上，单击“新建访问令牌”按钮;这将带您进入令牌生成屏幕。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"54565be2-7cd4-48f9-af8d-b9004633c239","type":"publii-image","content":{"image":"./media/posts/5/netlify-applications.webp","imageHeight":1451,"imageWidth":1932,"alt":"Netlify应用程序","caption":"Netlify应用程序"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"c94d39ea-801d-4119-884d-09cbd846c27c","type":"publii-image","content":{"image":"./media/posts/5/netlify-new-token.webp","imageHeight":1451,"imageWidth":1932,"alt":"Netlify新令牌","caption":"Netlify新令牌"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"f42001a4-650b-4e77-994a-44bc36e40552","type":"publii-paragraph","content":"9.在令牌描述字段中，添加您选择的名称;这只是为了帮助您记住生成令牌的目的！接下来，单击“生成令牌”按钮。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"a7c1ac53-e308-4d43-a982-c2f10ba5390c","type":"publii-image","content":{"image":"./media/posts/5/netlify-generating-token.webp","imageHeight":1144,"imageWidth":1932,"alt":"生成个人访问令牌","caption":"生成个人访问令牌"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"4a092737-77b7-450a-8cd1-ea1adbc956b6","type":"publii-paragraph","content":"10.将创建令牌，你将看到“新创建令牌”消息。下面将是您的新令牌;请务必复制此令牌并将其存储在安全的地方，因为您以后将无法检索它！","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"815887ab-293e-4c83-8b57-256e571af96e","type":"publii-image","content":{"image":"./media/posts/5/netlify-personal-token.webp","imageHeight":1113,"imageWidth":1932,"alt":"Netlify个人令牌","caption":"Netlify个人令牌"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"fcff804f-9ce0-41bb-b823-4dc4c6fd4949","type":"publii-paragraph","content":"我们现在拥有了Netlify所需的一切，因此我们可以继续配置Publii以更新我们的网站。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"97745e2d-ce03-4498-9349-2b6764714774","type":"publii-paragraph","content":"11.为Netlify配置Publii\n
要在Publii中配置您的Netlify站点，请按照下列步骤作：","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"3d2644f3-8fad-4f88-a503-2944120ba032","type":"publii-paragraph","content":"①打开Publii应用程序并单击左侧边栏中的“服务器”选项以打开“服务器设置”屏幕。\n
②将域设置为我们在上一节（yourSitename.netlify.com）中看到的NetlifyURL;不要忘记从下拉列表中选择https://。\n
③将Netlify站点的APIID中的字符串输入到站点ID字段中。\n
④最后，在Netlify令牌字段中输入我们在上一节末尾创建的Netlify令牌，然后单击“保存设置”按钮以保存更改。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"ca4d0987-e832-4a1a-b369-1fc0cf7a9b3e","type":"publii-image","content":{"image":"./media/posts/5/netlify-static-website-configuration.webp","imageHeight":1040,"imageWidth":1920,"alt":"Netlify网站设置","caption":"Netlify网站设置"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"7c0e11ab-3a80-446f-9e35-43010604906a","type":"publii-paragraph","content":"Publii现已配置;如果需要，可以单击“测试连接”按钮以确保所有选项都已正确配置。如果是，您已准备好同步您的网站！","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"c86396f3-37cc-4241-9120-743ecb7fd962","type":"publii-paragraph","content":"以上教程来自于Publii官方文档，链接如下：\n
https://getpublii.com/docs/build-a-static-website-with-netlify.html\n
只要按照上述的步骤，一步一步来，就可以免费搭建一个托管在netlify上的静态博客了，配合一个六位纯数字XYZ后缀十年只需47元的域名，相信您可以持续您的创作了。 
","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""},"link":{"url":"https://getpublii.com/docs/build-a-static-website-with-netlify.html","title":"","cssClass":"","noFollow":false,"targetBlank":true,"sponsored":false,"ugc":false,"download":false}}},{"id":"f0946fcc-7d02-4e5c-a0e6-fb832d0b276d","type":"publii-paragraph","content":"如果您有自己的域名，我们可以将netlify上的项目免费绑定自己的域名，实现自己的顶级域名访问。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"93f53686-0feb-4414-9bea-615624f08bc5","type":"publii-paragraph","content":"1.登录netlify后台，一般默认左侧就会进入项目，没有的话就选择“project”，点击右边自己的项目名，进入项目。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"d815e75e-93de-4576-b514-bd6dba7c3d9b","type":"publii-image","content":{"image":"./media/posts/5/netlify-project.webp","imageHeight":937,"imageWidth":1920,"alt":"netlify项目","caption":"netlify项目"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"ee65d7cc-f38d-4e3c-bc17-22639d443213","type":"publii-paragraph","content":"2.进入项目后，选择左边的域管理“Domain management”，在右侧点击添加域别名“Add domain alias”,点击添加自己的域名即可。可以添加多个域名，一般我们添加abc.com这种顶级域名以及加www前缀的www.abc.com这种二级域名即可，按自己的喜好点击右边的选项设置哪个为主域名，在自己的域名服务商那里设置好相应dns，等待dns验证生效后就可以访问了。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"6a268103-31ce-48d6-8b6b-c6ebfb0d7541","type":"publii-image","content":{"image":"./media/posts/5/netlify-domain-management.webp","imageHeight":937,"imageWidth":1920,"alt":"netlify域名管理","caption":"netlify域名管理"},"config":{"imageAlign":"wide","link":{"url":"","noFollow":false,"targetBlank":false,"sponsored":false,"ugc":false},"advanced":{"cssClasses":"","id":""}}},{"id":"b39fe489-7de7-4b5b-bd85-4fc78872c6d4","type":"publii-paragraph","content":"需要注意的地方有两点：\n
①如果您的域名托管在cloudflare上，记得关闭代理，否则SSL/TLS证书可能会下载失败。\n
②如果您在netlify上绑定了自己的顶级域名，那么在Publii的服务器设置里，域名要填写自己的顶级域名。\n
③Publii有三种编辑器，分别是经典编辑器，块编辑器，markdown编辑器，您可以自由选择自己喜欢的编辑器，但要注意，如果一篇文章在建立的时候您选择了某个编辑器，后续再点击编辑的时候，编辑器不能再更改。但新建文章或者页面不受影响。一句话，某篇文章或者页面一旦选择了某个编辑器，就只能一直用这个编辑器编辑这篇文章或者页面。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}},{"id":"dee2c09a-3e43-4dda-ba31-cf10c6de3315","type":"publii-paragraph","content":"至此，拥有一个顶级域名的免费静态博客就搭建好了，以后只需要在本地负责写作，写完后点击同步网站，就可以了。","config":{"textAlign":"left","advanced":{"style":"","cssClasses":"","id":""}}}]