title: Woocommerce add shortcode to front-end product page
body: <p>I have been learning on how to make a plugin for Wordpress.<br>
  Now I am stumbling upon a "problem".<br>
  Which is: I need to add my shortcode to the product page of <strong>Woocommerce</strong>.</p>
  
  <p>I have this function which makes my shortcode:</p>
  
  <pre><code>function ws_frontend_product_page_validate() {
  
      // no actual validation yet
      $output = ws_frontend_product_page();
      return $output;
  
  }
  add_shortcode('ws_frame', 'ws_frontend_product_page_validate');
  function ws_frontend_product_page() {
  
      ?&gt;
  
          &lt;iframe src="http://www.example.com/" style="width: 100%; height: 100%;" scrolling="no" frameBorder="0"&gt;&lt;/iframe&gt;
  
      &lt;?php
  
  }
  </code></pre>
  
  <p>So how can I add <code>[ws_frame]</code> to the Woocommerce product pages?<br>
  I haven't found any tutorials as of how I can implement this into Woocommerce product pages.<br>
  I have found it very difficult to find the tutorials that I need to develope a plugin for Woocommerce. <br>Any suggested tutorials would be very nice!</p>
  
  <p><strong>UPDATE</strong><br></p>
  
  <p>Now I have got an answer of Piyush Dhanotiya. I have yet to get the position right.</p>
  
  <p>If I use the code of Piyush Dhanotiya it shows up as this:</p>
  
  <p><a href="https://i.imgur.com/ceISAE3.png" rel="nofollow noreferrer"><img src="https://i.imgur.com/ceISAE3.png" alt="enter image description here"></a></p>
  
  <p>Yet, I want it here:</p>
  
  <p><a href="https://i.stack.imgur.com/q1kxa.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/q1kxa.png" alt="enter image description here"></a></p>