如何将博客组件添加到您的 Atlas 网站

您想要在您的众筹网站上拥有完整的博客功能吗？本教程将介绍一种将博客组件添加到 Atlas 网站的简单方法。

我们将使用Thrinacia 的合作伙伴Skhemata提供的组件。Skhemata 使向任何网站添加组件变得容易，并提供可通过 HTML 属性、CSS 等自定义的广泛功能。让我们开始吧。

步骤 1. Thrinacia 订阅

由于Thrinacia 与 Skhemata 合作，您可以通过订阅此处常见问题解答中概述的正确计划来访问这些组件。

如果您不想使用规模计划，您也可以尝试使用 Skhemata 定价页面上的计划，但是，Thrinacia 将提供 WordPress 托管作为规模计划的一部分，这对于该组件正常运行至关重要。如果您不想使用扩展计划，则需要为 WordPress 寻找一个主机。

如果您使用的是规模计划，您可以在准备好使用博客组件时联系 Thrinacia 支持，他们将为您提供对 WordPress 实例的访问权限。

Step 2. 复制widget代码

现在您有了一个 WordPress 实例，您可以将小部件代码添加到您的站点。Skhemata 组件可以以不同的方式使用。对于本教程，我们将通过小部件代码使用组件。实际源代码托管在 Skhemata CDN 上，因此您可以轻松复制和粘贴一小段小部件代码来引用它。

在将小部件代码添加到页面之前，最好先创建占位符文章，以便您可以在页面上看到组件的外观。为了进一步参考，这里有一个博客组件的例子。您可以看到这是组件的 Skhemata 文档，您还可以看到小部件代码有一个选项卡。这与需要粘贴到 Atlas 平台中的小部件代码不同。请使用下面提供的代码，因为它需要粘贴到 WYSIWYG 编辑器中。这样的编辑器可能有限制，因此需要为此定制小部件代码。

这是小部件代码的示例：

<div style="padding-top: 100px; padding-bottom: 100px;">
	<div class="ui page grid">
		<div class="column">
			<skhemata-blog api-wordpress='{"url": "your-url-here/wp-json/wp/v2"}' blog-post-path="post" posts-per-page="10">&nbsp;</skhemata-blog>
			<script>
				async function check()
				{
					const script = await
					import ('https://cdn.jsdelivr.net/npm/@skhemata/skhemata-blog@latest/build/index.js');
				}

				check();

			</script>
		</div>
	</div>
</div>

您可以将上述代码复制并粘贴到您平台上的页面中。将代码“ your-url-here ”中显示的 URL 替换为您的 wordpress 博客的 URL。你会注意到有一个/wp-json/wp/v2保持路径不变，不要删除它，如果你这样做，组件将无法工作。此路径引用 WordPress 后端。然后您可以保存页面并查看显示的组件。如果您还没有添加任何内容，它应该看起来像这样：

步骤 3. 自定义组件

您还可以进行进一步的自定义。其中之一是页面上显示的文章数量。这可以通过您粘贴的小部件代码进行自定义。您应该能够看到posts-per-page属性。根据上面的小部件代码，默认情况下它有 10 个，但您可以将其更改为您想要的任何数字。这被认为是 HTML 属性。这些属性也与 CSS 属性一起列在Skhemata 文档中。

要进行进一步的操作和定制，您需要通过定制代码来完成。请记住，小部件的源代码托管在 Skhemata CDN 上，因此您无权对其进行特别操作，但您可以添加自己的自定义 CSS、javascript 并使用提供的属性。

有关组件或自定义的任何问题，请联系 Thrinacia或加入 Thrinacia 的 Discord 聊天室。