在wordpress页面中嵌入Tradingview小部件

Question

我是一个非常初学者的Wordpress。我需要在Wordpress页面上添加一个tradingview小部件。代码如下。

​

<!-- TradingView Widget BEGIN -->
	<span id="tradingview-copyright"><a ref="nofollow noopener" target="_blank" href="http://www.tradingview.com" style="color: rgb(173, 174, 176); font-family: &quot;Trebuchet MS&quot;,Tahoma,Arial,sans-serif; font-size: 13px;">Forex Heat Map by <span style="color: #3BB3E4">TradingView</span></a></span>
	<script src="https://s3.tradingview.com/external-embedding/embed-widget-forex-heat-map.js">{
	  "currencies": [
	    "EUR",
	    "USD",
	    "JPY",
	    "GBP",
	    "INR"
	  ],
	  "width": "450",
	  "height": "500",
	  "locale": "en"
	}</script>
<!-- TradingView Widget END -->

​

脚本部分通常被Wordpress抑制。如果我可以直接在Wordpress页面上添加小部件，请告诉我。如果通过链接到function.php，如果可以这样做，那么示例代码将非常有用。我给出的代码在普通html中工作得很好。

Answer 1

如果只想将脚本插入页面，可以在ACF中使用插件或设置自定义字段，但最简单的方法是创建一个短代码，您可以将其添加到post编辑器中。

在functions.php中创建一个函数以显示脚本，然后使用add_shortcode定义要使用的短代码。例如：

/* function that just displays the script */
function insert_tradingview_heatmap_shortcode() { ?>
    <!-- TradingView Widget BEGIN -->
    <span id="tradingview-copyright"><a ref="nofollow noopener" target="_blank" href="http://www.tradingview.com" style="color: rgb(173, 174, 176); font-family: &quot;Trebuchet MS&quot;,Tahoma,Arial,sans-serif; font-size: 13px;">Forex Heat Map by <span style="color: #3BB3E4">TradingView</span></a></span>
    <script src="https://s3.tradingview.com/external-embedding/embed-widget-forex-heat-map.js">{
      "currencies": [
        "EUR",
        "USD",
        "JPY",
        "GBP",
        "INR"
      ],
      "width": "450",
      "height": "500",
      "locale": "en"
    }</script>
<!-- TradingView Widget END -->
<?php
}
/* create a shortcode called tradingview_heatmap that will run the function */
add_shortcode('tradingview_heatmap', 'insert_tradingview_heatmap_shortcode');

然后，要在post /页面中显示热图，只需在post编辑器中放置以下短代码：

[tradingview_heatmap]

更新：

它可能有助于获得一个非常简单的短代码首先工作，所以我们可以排除任何使用它。

将此添加到您的functions.php中：

/* function to display a test message */
function my_test_shortcode() { ?>
    <p>This is added by my test shortcode!</p>
<?php
}
add_shortcode('my_test_shortcode', 'my_test_shortcode');

在新的空帖子编辑器中键入以下内容，保存并在浏览器中查看文章：

[my_test_shortcode]

它应该打印“这是我的测试代码添加的！”作为帖子的文本。