Question

这涉及MODX Evolution，Ditto和Bootstrap3 Carousel。

我的目标是在旋转木马中呈现单个DIV中的Ditto加载文章。我的代码只显示一个DIV中的所有三篇文章，所有DIV显示相同的（！）三篇文章（前三个）。我的猜测是问题出在我的HTML块中，但是如果我改变了代码，那么我就会失去对旋转木马的响应。我哪里错了？

这是一个带有三个独特DIV的旋转木马。共有12个DIV，以4轮（= 4 x 3）显示。
每个DIV必须显示一个唯一的加载文章，即一个资源ID。因此，每轮都有三篇独特的文章（共4轮）。
我的旋转木马没有JS或JQuery。这一切都是响应式Bootstrap3制作的。
模板的id = 2。文章资源类别的id = 9且其子元素的id = 20，直到id = 31（=共12篇文章）。

TEMPLATE（= id = 2）DITTO CALL：

[[Ditto? &parents=`9` &display=`12` &orderBy=`createdon DESC` &tpl=`articles`]]

HTML CHUNK articles（原始HTML代码 - ＆gt; 4项x 3 DIV）：

<div class="carousel-inner">
            <div class="item active">
                <div class="col-md-4 col-sm-6">
                    [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-xs">
                    [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-sm hidden-xs">
                   [+content+]
                </div>
            </div>

            <div class="item">
                <div class="col-md-4 col-sm-6">
                   [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-xs">
                   [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-sm hidden-xs">
                    [+content+]
                </div>
            </div>

            <div class="item">
                <div class="col-md-4 col-sm-6 hidden-xs">
                   [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-xs">
                   [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-xs">
                    [+content+]
                </div>
            </div>

            <div class="item">
                <div class="col-md-4 col-sm-6 hidden-xs">
                   [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-xs">
                   [+content+]
                </div>

                <div class="col-md-4 col-sm-6 hidden-xs">
                  [+content+]
                </div>
            </div>
        </div>

Answer 1

您想要做的是：

<div class="carousel-inner">

[[Ditto? &parents=`9` &display=`12` &orderBy=`createdon DESC` &tpl=`articles`]]

</div>

＆amp; tpl chunk：

<div class="item [+active+]">
   <div class="col-md-4 col-sm-6">
     [+content+]
   </div>

   <div class="col-md-4 col-sm-6 hidden-xs">
      [+content+]
    </div>

    <div class="col-md-4 col-sm-6 hidden-sm hidden-xs">
       [+content+]
   </div>
</div>

让ditto生成项目div。

您必须编写一个脚本来确定哪个块将是第一个＆amp;标记它的类＆＃34;活跃＆＃34;或者可能有一个ditto属性使用不同的块作为它的第一个tpl。

可能是这样的：

[[Ditto? 
   &parents=`9` 
   &display=`12` 
   &orderBy=`createdon DESC` 
   &tpl=`articles`
   &tplFirst=`articles-01`
]]

这是一个猜测 - 你必须检查ditto docs的实际语法和可用性。

Answer 2

我通过在carousel_articles块中为每个单独的div（每个匹配我的文章类别的不同父级）放置一个Ditto调用来解决它，并使用randomize参数。

MODX（Evo）Ditto和Carousel具有多个DIV，其中需要加载子资源ID

2 个答案: