Atlas中如何添加推荐组件

FAQ 组件示例
您想在众筹网站上使用常见问题解答功能吗？本教程将介绍一种将 FAQ 组件添加到 Atlas 平台的简单方法。

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

步骤 1. Thrinacia 订阅​

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

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

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

步骤 2. 安装 Ultimate FAQ 插件​

该组件需要使用终极 FAQ 插件。你可以在这里下载这个插件：https ://en-ca.wordpress.org/plugins/ultimate-faqs/

在您的 WordPress 实例上下载后，请务必激活它。激活后，您可以使用 FAQ 插件创建新的 FAQ。为此，将鼠标悬停在 WordPress 仪表板中的常见问题解答上，然后单击“添加新”。这将允许您添加新的常见问题解答。它很像一篇博客文章，但当您决定在一个页面上查看所有内容时，它的显示方式会有很大不同。

步骤 3. 复制并粘贴小部件代码​

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

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

这是小部件代码的示例：

<div class="ui page grid">
<div class="column">
<skhemata-faq faq-title="My FAQ" api-wordpress="{&quot;url&quot;: &quot;https://my-wordpress-site.com/wp-json/wp/v2&quot;}" faq-page-path="demo" faq-post-path="post" posts-per-page="10"></skhemata-faq>
<script>
async function check()
{
const script = await
import ('https://cdn.jsdelivr.net/npm/@skhemata/skhemata-faq@latest/build/index.js');
}

check();

</script>
</div>
</div>
复制以上代码并将其粘贴到您平台上的页面中。确保您在源代码模式下查看页面，否则它会将原始 HTML 粘贴为段落。

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

FAQ 组件示例

步骤 4. 自定义组件​

您可以查看Skhemata 文档中列出的属性 以及 CSS 属性。

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

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

博客组件示例
您想要在您的众筹网站上拥有完整的博客功能吗？本教程将介绍一种将博客组件添加到 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 聊天室。

新的 v1 用户界面功能和修复
我们对 v1 参考应用程序或 UI（Core 和 Reach 主题）进行了一些修改，这将结束我们在 v1 UI 上的工作，并允许我们进入下一阶段的发布。今后这些 UI 不会有重大变化。只有安全和其他关键修复程序才会应用于它们以获得长期支持。

我们的新工作现在正转向新的众筹功能、基础设施、Web 组件、电子商务、API Evolution 工作和其他使用 PWA 方法构建的参考应用程序。新的修改引入了对 v1 UI 和现有 REST API 所做的更改。它们记录在下面。
1.简化了创建/快速结帐的内联流程。当使用这些内联模式时，结帐现在变得完全原子化，这意味着在交易完全成功之前不会创建用户记录。任何错误（卡被拒绝等）都会让用户停留在他们开始时使用预填充数据的同一页面，这样他们就可以以更简单、更清晰的方式重新尝试他们的交易。

2. 保存 Stripe 令牌时，现在默认启用 Stripe信用卡令牌化。没有办法将其关闭，除非您直接与 API 交互。这使得开始新网站变得更加容易。

3.直接交易功能已简化到现在只能启用或禁用的程度。Direct Transaction 上不再有 Stripe Connect 按钮，系统将直接使用门户 Stripe 令牌。这导致界面更加简单和干净。

4. Froala 编辑器 CORS 问题已经解决，现在允许从托管在单独域上的 wordpress 插件正确上传文件。
5.调整或清理了结帐流程的各种消息，以更好地反映新的工作流程。此外，各种额外的验证也被添加到贡献工作流程中。

6.强制重新注册切换已被删除并弃用，因为此模式现在仅适用于快速结帐。当使用 Express Checkout 模式时，它始终处于打开状态。

我们的更改也发布在此处的 GIT 存储库上： https: //github.com/Thrinacia并且在订阅 Thrinacia Atlas 计划时也可以从您现有的代码库访问。请注意，已完全自定义 Web UI 和应用程序的客户将不会收到这些更新。如果需要，此类更新/功能需要向后移植或手动集成到此类代码中。