自定义插件短代码中的HTML显示在WordPress的“编辑页面”屏幕上

Question

我一直在研究我的第一个WordPress插件，它在很大程度上起作用。但是，当我激活插件时，编辑页面屏幕会全部搞砸。我附上了截图。

现在我想我理解为什么，但我不确定如何解决它。我已将插件设置为价格报价表单，如果用户将短代码放在文本编辑器中，它将显示在该页面上。但是，短代码的所有内容也会显示在“编辑页面”屏幕上，就像我上面分享的照片一样。

这是一段显示问题的代码片段。我当然强调了这一点，但这给了我同样的结果。 “Hello World”和Lorem Ipsum仍然出现在编辑页面屏幕上，如截图中所示。

<?php     
 function price_quote_display () {
  ?>
    <h1>Hello World</h1>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus laoreet sit amet felis nec molestie. Ut porttitor neque nec metus feugiat tincidunt.  
      </p>
  <?php
}

//function calls html from shortcode
function register_shortcode(){
  add_shortcode('price-quote','price_quote_display');
}

//sets up and calls function that contains shortcode
add_action('init', 'register_shortcode');

?>

知道为什么priceQuoteDisplay中的HTML出现在编辑页面屏幕上吗？谢谢你的帮助。

Answer 1

所以我找到了答案。我无法解释为什么会这样，但这个解决方案对我有用。通过使用ob_start()和ob_get_clean()，我消除了我的问题。这是我更新后的样子：

<?php     
 function price_quote_display () {
  ?>
    <h1>Hello World</h1>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus laoreet sit amet felis nec molestie. Ut porttitor neque nec metus feugiat tincidunt.  
      </p>
  <?php
}

function form_shortcode() {
  ob_start();
  send_mail();
  price_quote_display();

  return ob_get_clean();
}

  //creates shortcode
  add_shortcode('price-quote','form_shortcode');

?>

Answer 2

试着这样做

<?php     
 function price_quote_display () {
    $xyz = '<h1>Hello World</h1>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus laoreet sit amet felis nec molestie. Ut porttitor neque nec metus feugiat tincidunt.  
      </p>';
    return $xyz;
}

function form_shortcode() {
  send_mail();
  price_quote_display();
}
add_shortcode('price-quote','form_shortcode');

?>