Bigcommerce 结账页面编辑

Question

我在 bigcommerce 中使用 Vault 主题，想要编辑结账页面，因为我想重命名 a 按钮。我浏览了所有文件，但没有进行 html 检查，我在结账页面中发现了一个标签 {{{ checkout.checkout_content }}} ，该标签正在渲染包含按钮的部分。没有包含标签 html 的文件。 此内容在 Inspect 元素中呈现，但是当我查看页面源时，该内容不存在。

我尝试使用 JS/JQ 更改按钮的名称，但它不起作用，因为标签部分不会出现在源文件中，但不知何故它出现在检查元素中。

现在如何编辑按钮名称？

Answer 1

结帐内容使用 React.js 渲染。编辑模板的唯一方法是构建自定义结账。这可能有点矫枉过正了。要简单地编辑按钮的文本，您有几种选择。但是，最简单的方法是将翻译密钥添加到 en.json lang 文件中，并将值更改为所需的文本。

在主题文件中，导航到 en.json。找到该文件的末尾，并在最后一个右大括号之前添加optimized_checkout键以及您需要的任何值。例如，如果我想将“Continue with PayPal”按钮文本更改为“Continue”，我会将 en.json 的最后两行替换为以下内容：

    },
    "optimized_checkout": {
        "payment": {
            "paypal_continue_action": "Continue"
        }
    }
}

有关如何执行此操作的更多信息，请参见：https://developer.bigcommerce.com/stencil-docs/localization/multi-language-checkout

这里是要使用的优化结账键的参考：https://github.com/bigcommerce/checkout-js/blob/master/packages/locale/src/translations/en.json

编辑 24 年 6 月 13 日： en.json 文件已移动