Typoscript使用stdWrap

Question

我有自定义要求使用TypoScript显示图像滑块。图像来自默认的tt_content图像内容元素。

我添加了以下TypoScript代码来实现此功能;

lib.homeslider = COA
lib.homeslider {
    10 = CONTENT
    10 {
        table = tt_content
        select {    
            where = colPos = 3
            andWhere = deleted = 0
            andWhere = hidden = 0
            orderBy = rand()
        }
        renderObj =  FILES
        renderObj {
            references {
                table = tt_content
                fieldName = image
            }
            renderObj = IMAGE
            renderObj {
                file.import.data = file:current:uid
                file.treatIdAsReference = 1
                stdWrap.typolink.parameter.data = file:current:link
                stdWrap.wrap = <div class="item active">|</div>|*|<div class="item">|</div>|*|<div class="item">|</div>
            }
        }
    }
    wrap = <div id="carousel-example-generic" data-ride="carousel" class="carousel slide carousel-fade"><div role="listbox" class="carousel-inner">|</div></div>
}

这显示了前端的图像。但我的要求是我想在第一个图像包装器中添加“活动”类。我已添加以下代码来实现此功能，但无法正常工作。

stdWrap.wrap = <div class="item active">|</div>|*|<div class="item">|</div>|*|<div class="item">|</div>

我需要生成的最终HTML输出是;

<div id="carousel-example-generic" data-ride="carousel" class="carousel slide carousel-fade">
   <div role="listbox" class="carousel-inner">
      <div class="item active"> 
            <a href="#">
                 <img src="images/temp/startbild1.jpg" alt="#">
            </a>
      </div>
      <div class="item">
           <a href="#">
                <img src="images/temp/startbild2.jpg" alt="#">
           </a>
      </div>
      <div class="item">
            <a href="#">
                 <img src="images/temp/startbild3.jpg" alt="#">
            </a>
      </div>
   </div>
</div>

如果有人知道解决方案，请帮助我。

Answer 1

您的原始TS很好。

假设您将图像放在同一个CE（内容元素）中，而不是在多个CE中。就这样：

为了便于阅读，我修改了以下行：

    stdWrap.wrap = <div class="item active">A|ENDA</div>|*|<div class="item">B|ENDB</div>|*|<div class="item">C|ENDC</div>

这给了我：

<div id="c1531" class="csc-default">
  <div id="carousel-example-generic" data-ride="carousel" class="carousel slide carousel-fade">
    <div role="listbox" class="carousel-inner">
      <div class="item active">A<img src="index.php?eID=dumpFile&amp;t=p&amp;p=1106&amp;token=a71bae9f5bfc837dce6b7974e6f63aca5cc656ae" width="165" height="158"   alt="" >ENDA</div>
      <div class="item">C<img src="index.php?eID=dumpFile&amp;t=p&amp;p=1107&amp;token=0dab49e1d8dac7c8cfd7a7910133cb2398c19030" width="420" height="132"   alt="" >ENDC</div>
    </div>
  </div>
</div>

编辑：尝试随机内容

lib.homeslider = COA
lib.homeslider {
    10 = CONTENT
    10 {
        table = tt_content
        select {    
            where = colPos = 3
            andWhere = deleted = 0
            andWhere = hidden = 0
        }
        renderObj =  FILES
        renderObj {
            maxItems = 2 #as many as you want
            sorting = rand #not working, maybe with EXT:lvrandfiles
            references {
                table = tt_content
                fieldName = image
            }            
            renderObj = IMAGE
            renderObj {
                file.import.data = file:current:uid
                file.treatIdAsReference = 1

                stdWrap.typolink.parameter.data = file:current:link
                stdWrap.wrap = <div class="item active">A|ENDA</div>|*|<div class="item">B|ENDB</div>|*|<div class="item">C|ENDC</div>
          }
        }
    }
    wrap = <div id="carousel-example-generic" data-ride="carousel" class="carousel slide carousel-fade"><div role="listbox" class="carousel-inner">|</div></div>
}

Answer 2

最后我得到了正确的剧本;

lib.homeslider = COA_INT
lib.homeslider {
    10 = CONTENT
    10 {
        table = tt_content
        select {    
            where = colPos = 3
            andWhere = deleted = 0
            andWhere = hidden = 0
            orderBy = rand()
        }
        renderObj =  FILES
        renderObj {
            references {
                table = tt_content
                fieldName = image
            }
            stdWrap.wrap = |###SPLITTER###
            renderObj = IMAGE
            renderObj {
                file.import.data = file:current:uid
                file.treatIdAsReference = 1
                altText.data = file:current:title
                stdWrap.typolink.parameter.data = file:current:link
            }
        }
        stdWrap.split {
            token = ###SPLITTER###
            cObjNum = 1 |*| 2 |*| 3 || 4
            1.current = 1
            1.wrap = <div class="item active">|</div>

            2.current = 1
            2.wrap = <div class="item">|</div>

            3.current = 1
            3.wrap = <div class="item">|</div>

            4.current = 1
        }
    }
    wrap = <div id="carousel-example-generic" data-ride="carousel" class="carousel slide carousel-fade"><div role="listbox" class="carousel-inner">|</div></div>
}