Question

我创建了包含<div>和<ul>等HTML元素的Wordpress页面，例如

<div id="main" class="large-12 medium-12 columns clearfix" role="main">
  <h2 class="press-list-header">Articles</h2>
    <ul class="press-list">

    </ul>
</div>

我想在这些HTML元素中放置短代码，如下所示：

<div id="main" class="large-12 medium-12 columns clearfix" role="main">
  <h2 class="press-list-header">Articles</h2>
    <ul class="press-list">
[picture image="http://example.com/image1.jpg" thumbnail="http://example.com/image1-thumbnail.jpg"]
[picture image="http://example.com/image2.jpg" thumbnail="http://example.com/image2-thumbnail.jpg"]
[picture image="http://example.com/image3.jpg" thumbnail="http://example.com/image3-thumbnail.jpg"]
    </ul>
</div>

当我这样做时，短代码只会在渲染页面上显示为常规文本。如果我只是将短代码放在HTML元素之外，那么它们就可以正常地将预期内容呈现在页面上。

如何让我的短代码将其内容包装在HTML元素中？

更新

我应该更具描述性。我希望我的客户能够轻松地在TinyMCE编辑器中输入简短的代码来获取页面和帖子。我不希望他们不得不处理php或html代码。他们无法访问那些.php模板文件，因为他们不是开发人员。我已经得到了短代码，只用于帖子而不是页面。我相信这样做的原因是我使用了一个名为custom-page.php的模板用于我的所有页面，如下所示：

<?php /* Template Name: Custom */ ?>
<?php get_header(); ?>

  <div id="content">        
    <div id="inner-content" class="row clearfix">

      <?php the_post(); global $post; echo $post->post_content; ?>

    </div> <!-- end #inner-content -->
  </div> <!-- end #content -->

<?php get_footer(); ?>

我已经确定问题在于

行

<?php the_post(); global $post; echo $post->post_content; ?>

由于某种原因，它只是渲染短代码文本。它不允许短代码运行并呈现预期的内容。如何重写此行以使短代码正确执行？

Answer 1

您正在寻找do_shortcode()：

<?php echo do_shortcode("[shortcode]"); ?>

因此，在您的模板中，它将如此：

<div id="main" class="large-12 medium-12 columns clearfix" role="main">
  <h2 class="press-list-header">Articles</h2>
    <ul class="press-list">
<?php echo do_shortcode("[picture image=\"http://example.com/image1.jpg\" thumbnail=\"http://example.com/image1-thumbnail.jpg\"]"); ?>
<?php echo do_shortcode("[picture image=\"http://example.com/image2.jpg\" thumbnail=\"http://example.com/image2-thumbnail.jpg\"]"); ?>
<?php echo do_shortcode("[picture image=\"http://example.com/image3.jpg\" thumbnail=\"http://example.com/image3-thumbnail.jpg\"]"); ?>
    </ul>
</div>

添加到更新，do_shortcode功能仍然是可行的方法：

<?php the_post(); global $post; echo do_shortcode($post->post_content); ?>

Answer 2

你需要这样做

<?php 
echo do_shortcode("[picture image='http://example.com/image1.jpg' thumbnail='http://example.com/image1-thumbnail.jpg']"); 
?>

Answer 3

 <?php echo do_shortcode('<div id="main" class="large-12 medium-12 columns clearfix"   role="main">
 <h2 class="press-list-header">Articles</h2>
 <ul class="press-list">
 [picture image="http://example.com/image1.jpg" thumbnail="http://example.com/image1-thumbnail.jpg"]
 [picture image="http://example.com/image2.jpg" thumbnail="http://example.com/image2-thumbnail.jpg"]
 [picture image="http://example.com/image3.jpg" thumbnail="http://example.com/image3-thumbnail.jpg"]
 </ul>
</div>');

Wordpress短代码在用HTML包装时不起作用

更新

3 个答案: