dongtan7201
2017-09-13 19:32
浏览 174

在wordpress页面中嵌入Tradingview小部件

I am an extremely beginner of Wordpress. I need to add a tradingview widget on my Wordpress page. Code as below.

<!-- 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 -->

The script part is usually suppressed by Wordpress. Please let me know if I can directly add widgets on Wordpress page. If by hooking in function.php if it could be done a sample code would be very useful. My given code works fine in plain html.

</div>

图片转代码服务由CSDN问答提供 功能建议

我是Wordpress的初学者。 我需要在我的Wordpress页面上添加一个交易视图小部件。 代码如下。

 &lt;! -  TradingView  Widget BEGIN  - &gt; 
 
&lt; span id =“tradingview-copyright”&gt;&lt; a ref =“nofollow noopener”target =“_ blank”href =“http://www.tradingview.com”style  =“color:rgb(173,174,176); font-family:&amp; quot; Trebuchet MS&amp; quot;,Tahoma,Arial,sans-serif; font-size:13px;”&gt; Forex Heat Map by&lt;  span style =“color:#3BB3E4”&gt; TradingView&lt; / span&gt;&lt; / a&gt;&lt; / span&gt; 
 
&lt; script src =“https://s3.tradingview.com/external-embedding/  embed-widget-forex-heat-map.js“&gt; {
 
”currency“:[
 
”EUR“,
 
”USD“,
 
”JPY“,
 
  
“GBP”,
 
“INR”
 
],
 
“宽度”:“450”,
 
“高度”:“500”,
 
“”区域设置“  :“en”
 
}&lt; / script&gt; 
 
&lt;! -  TradingView Widget END  - &gt;   
 
  
 
  
 
 
 
 

scr ipt部分通常被Wordpress压制。 如果我可以直接在Wordpress页面上添加小部件,请告诉我。 如果通过挂钩function.php,如果可以的话,示例代码将非常有用。 我给出的代码在普通的html中运行良好。

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • dtv55860 2017-09-14 04:01
    已采纳

    If you just want to insert that script into a page, you could use a plugin or set up a custom field in ACF, but the easiest way is to create a shortcode that you can add into the post editor.

    Create a function in functions.php to display the script, and then use add_shortcode to define the shortcode to use. e.g.:

    /* 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');
    

    Then to display the heat map in a post/page, your just need to put the following shortcode into the post editor:

    [tradingview_heatmap]
    

    UPDATE:

    It might help to get a very simple shortcode to work first, so we can rule out anything with it.

    Add this to your 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');
    

    Type the following into the post editor for a new, empty post, save it and view the post in your browser:

    [my_test_shortcode]
    

    It should print "This is added by my test shortcode!" as the post text.

    打赏 评论

相关推荐 更多相似问题