Twitter Bootstrap在自定义帖子类型中使用折叠

时间:2012-10-15 作者:stemie

我正在Wordpress中使用Bootstrap,我想实现collapse 特定自定义帖子类型的单页内容中的功能。

我知道我可以创建一个短代码,然而,对于成百上千的帖子来说,短代码并不理想。是否可以在自定义post类型(custom single.php)的\\u内容中包含collapse。因此,当用户输入时。H2及其下方的文本。p它将其用于折叠组。

所以在定制单曲中。php I将\\u内容包装在自定义div id中

 <div id="my-accordion"><?php the_content(); ?></div>
如何将H2和p与适当的div类关联以进行引导。这可能吗?

    <div class="accordion" id="accordion2">
        <div class="accordion-group">
          <div class="accordion-heading">
               <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
               Collapsible Group Item #1
               </a>
          </div>
          <div id="collapseOne" class="accordion-body collapse in">
              <div class="accordion-inner">
              Anim pariatur cliche...
          </div>
          </div>
      </div>

       <div class="accordion-heading">
           <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
           Collapsible Group Item #2
           </a>
       </div>
      <div id="collapseTwo" class="accordion-body collapse">
        <div class="accordion-inner">
         Anim pariatur cliche...
     </div>
   </div>
  </div>
</div>

2 个回复
最合适的回答,由SO网友:kaiser 整理而成

脚本

首先必须将脚本排队。我们有条件地仅为您的自定义帖子类型及其存档加载它。

// in your functions.php
function wpse69274_enqueue_tbs_collapse()
{
    if (
        ! is_post_type_archive()
        AND \'YOUR_POST_TYPE\' !== get_post_type()
    )
        return;

    wp_enqueue_script(
         \'tbs-collapse\'
        ,get_stylesheet_directory_url().\'path/to/your/collapse.js\';
        ,array( \'jquery\' )
        ,filemtime( get_stylesheet_directory().\'path/to/your/collapse.js\' )
        ,true
    );
}
add_action( \'wp_enqueue_scripts\', \'wpse69274_enqueue_tbs_collapse\' );
标记现在我们需要添加适当的标记。目标通过使用实际the_ID() 当前循环帖子的。

<div class="container">
<div class="accordion" id="accordion">
    <?php
    global $wp_query;
    if ( have_posts() ) 
    {
        while( have_posts )
        {
            the_post();
            ?>
            <div class="accordion-group">
                <div class="accordion-heading">
                    <h2><a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapse-<?php the_ID(); ?>">
                        <?php the_title(); ?>
                    </a></h2>
                </div>
                <div id="collapse-<?php the_ID(); ?>" class="accordion-body collapse in">
                    <div class="accordion-inner">
                        <?php
                        if ( is_singular()
                        {
                            the_content();
                        }
                        else
                        {
                            the_excerpt();
                        }
                        ?>
                    </div>
                </div>
            </div><!-- // .accordion-group -->
            <?php
        } // endwhile;
    } // endif;
    ?>
</div>
</div>

SO网友:Damien

From the Codex 您可以在元素之前和之后包装文章标题。所以我想你会删掉/更改你的帖子标题\'

<?php the_title(\'<h2 class="accordion-heading">\', \'</h2>\'); ?>  

结束

相关推荐

如何根据用户角色级别定位css、admin元素?

我正在使用插件“增强的功能管理器”和“Adminimize”。在这两者之间,我已经能够做很多我想做的事情。我仍然需要隐藏一些元素,并且能够使用css将它们作为目标。问题是这些元素在所有管理用户级别都是隐藏的。是否有某种内置功能可以区分管理中的不同角色级别?我认为最好的方法是根据登录时的角色级别向body标记中添加一个类——例如,如果登录角色级别为“author”,则为“author”类。如果这是最好的方法,我就不知道如何编写代码来实现这一点。我假设它是对函数的php添加。php???