[TYPO3-german] tx news fluid Ausgabe aufteilen

[usenet at schani.com]

Hallo Sonja,

ich hab es so gelöst:
So sieht das ganze aus:
http://pini.leicht.info/home/artikel/news/fruehling-geniessen/?tx_news_pi1%5Bcontroller%5D=News&tx_news_pi1%5Baction%5D=detail&cHash=c936b71b84e7041c114304978aaea5b8
Das mit den vielen Datein in Partial usw. ist ganz schön nervig.

2 Partial Dateien für die tx_news Detailansicht



Ich habe die zwei Bilder Rechts untereinander:

<f:if condition="{media}">
    <!-- media files -->
        <f:for each="{media}" as="mediaElement">
            <f:cycle values="{1: '1', 2: '2', 3: '3', 4: '4', 5: '5', 6:
'6', 7: '7', 8: '8', 9: '9', 10: '10'}" as="cycle">
            <f:if condition="{cycle} <= 2">
                <f:if condition="{mediaElement.type} == 0">
                    <f:render partial="Detail/MediaImage"
arguments="{mediaElement: mediaElement, settings:settings}" />
                </f:if>
             </f:if>
            </f:cycle>
        </f:for>
</f:if>

Dann noch unter dem Text den Rest der angelegten Bilder:

<f:if condition="{media}">
<!-- media files -->
<div class="container-fluid">
  <div class="row">
        <f:for each="{media}" as="mediaElement">
            <f:cycle values="{1: '1', 2: '2', 3: '3', 4: '4', 5: '5', 6:
'6', 7: '7', 8: '8', 9: '9', 10: '10'}" as="cycle">
                <f:if condition="{cycle} >= 3">
                 <div class="col-md-4">
                      <f:if condition="{mediaElement.type} == 0">
                        <f:render partial="Detail/MediaImageKlein"
arguments="{mediaElement: mediaElement, settings:settings}" />
                     </f:if>
                    </div>              
                </f:if>
            </f:cycle>
         </f:for>
  </div>
  <!--row-->
</div>
<!--container-->
</f:if>






Hier noch die ganze Detailseite in Templates

{namespace n=Tx_News_ViewHelpers}

<f:layout name="Detail.html" />

<!--
    =====================
        News/Detail.html
-->
<div class="container-fluid">
<f:section name="content">
    <f:if condition="{newsItem}">
        <f:then>
            <n:format.nothing>
                <f:if condition="{newsItem.alternativeTitle}">
                    <f:then>
                        <n:titleTag>
                           
<n:format.htmlentitiesDecode>{newsItem.alternativeTitle}</n:format.htmlentitiesDecode>
                        </n:titleTag>
                    </f:then>
                    <f:else>
                        <n:titleTag>
                           
<n:format.htmlentitiesDecode>{newsItem.title}</n:format.htmlentitiesDecode>
                        </n:titleTag>
                    </f:else>
                </f:if>
                <f:render partial="Detail/Opengraph"
arguments="{newsItem: newsItem, settings:settings}" />
            </n:format.nothing>
            <div class ="row">
            <div class="col-md-12">
            <!-- Header und Zubehör (Footer) -->
            <f:if condition="{newsItem.istopnews}">
                <div class="alert alert-danger text-center">+++
Topmeldung +++ Topmeldung +++ Topmeldung +++ Topmeldung +++ Topmeldung
+++</div>
            </f:if>
           
                    <div class="header">
                        <h1>{newsItem.title}</h1>
                    </div>
                    <div class="footer">
                        <p>
                            <!-- date -->
                            <small><span class="news-list-date">
                                <n:format.date
format="{f:translate(key:'dateFormat')}">{newsItem.datetime}</n:format.date>
                            </span>

                            <f:if condition="{newsItem.categories}">
                                <f:render partial="Category/Items"
arguments="{categories:newsItem.categories, settings:settings}" />
                            </f:if>

                            <f:if condition="{newsItem.author}">
                                <!-- author -->
                                <span class="news-list-author">
                                    <f:translate key="author"
arguments="{0:newsItem.author}"></f:translate>
                                </span></small>
                            </f:if>
                        </p>
                    </div>
            </div>
            </div> <!-- end row-->
            <div class="row">
            <div class="col-md-8">
            <!--  Hauptbereich - Teaser - Main Text - Links - Facebook -
usw..-->
                   
                    <!-- teaser -->
                    <f:if condition="{newsItem.teaser}">
                       
                        <div class="teaser-text">
                        <blockquote>
                           
<strong><f:format.html>{newsItem.teaser}</f:format.html></strong>
                            </blockquote>
                        </div>
                    </f:if>
                   
                    <!-- Bodytext -->
                    <div class="news-text-wrap">
                        <f:format.html>{newsItem.bodytext}</f:format.html>
                    </div>
           
                    <!-- BACK LINK -->
                    <f:if condition="{settings.backPid}">
                    <p>
                    <div class="news-backlink-wrap text-right">
                        <f:link.page pageUid="{settings.backPid}">
                           
                            <button type="button" class="btn btn-primary
hidden-xs"><f:translate key="back-link" /></button>
                            <button type="button" class="btn btn-primary
btn-lg visible-xs"><f:translate key="back-link" /></button>
                           
                        </f:link.page>
                    </div>
                    </p>
                    </f:if>
           
                    <f:render partial="Detail/VideoContainerUnten"
arguments="{media: newsItem.media, settings:settings}" />
                    <f:render partial="Detail/BildContainerUnten"
arguments="{media: newsItem.media, settings:settings}" />
                   
                   
                    <!-- News TAGs -->
                    <f:if condition="{newsItem.tags}">
                        <div class="panel panel-default">
                        <div class="panel-heading">Schlagworte</div>
                        <div class="panel-body">
                                   
                                    <!-- Tags -->
                                    
                                    <f:for each="{newsItem.tags}" as="tag">
                                        <span class="label
label-success">{tag.title}</span>
                                    </f:for>
                                   
                        </div>
                        </div>
                    </f:if>

           
            <!-- related things -->
           
           

                <f:if condition="{newsItem.allRelatedSorted}">
                <div class="news-related news-related-news">
                <div class="panel panel-default">
                     
                    <div class="panel-heading"><f:translate
key="related-news" /></div>
                    <!-- Related news records -->
                    <div class="panel-body">

                        <ul>
                            <f:for each="{newsItem.allRelatedSorted}"
as="related">
                                <li>
                                    <span
class="news-related-news-date"><n:format.date
format="{f:translate(key:'dateFormat')}">{related.datetime}</n:format.date></span>
                                    <n:link newsItem="{related}"
settings="{settings}">
                                        {related.title}
                                    </n:link>
                                </li>

                            </f:for>
                        </ul>
                    </div>
                    </div>
                    </div> <!-- Panel Ende -->
                </f:if>

                <f:if condition="{newsItem.relatedFiles}">
                    <!-- Related files -->
                    <div class="news-related news-related-files">
                        <div class="panel panel-default">
                            <div class="panel-heading"><f:translate
key="related-files" /></div>
                            <div class="panel-body">
                            <ul>
                                <f:for each="{newsItem.relatedFiles}"
as="relatedFile">
                                    <li>
                                        <span
class="news-related-files-link">
                                            <n:format.fileDownload
file="uploads/tx_news/{relatedFile.file}"
configuration="{settings.relatedFiles.download}">
                                                <f:if
condition="{relatedFile.title}">
                                                    <f:then>
                                                        {relatedFile.title}
                                                    </f:then>
                                                    <f:else>
                                                        {relatedFile.file}
                                                    </f:else>
                                                </f:if>
                                            </n:format.fileDownload>
                                        </span>
                                        <span
class="news-related-files-size">
                                            <n:format.fileSize
file="uploads/tx_news/{relatedFile.file}"
format="{settings.relatedFiles.fileSizeLabels}" />
                                        </span>
                                    </li>
                                </f:for>
                            </ul>
                        </div>
                        </div> <!-- Panel Ende -->
                    </div>
                </f:if>

                <f:if condition="{newsItem.relatedLinks}">
                <div class="panel panel-default">
                    <div class="panel-heading"><f:translate
key="related-links" /></div>
                      <div class="panel-body">
                    <!-- Related links -->
                    <div class="news-related news-related-links">
                       
                           
                       
                        <ul>
                            <f:for each="{newsItem.relatedLinks}"
as="relatedLink">
                                <li>
                                    <f:link.page
pageUid="{relatedLink.uri}" title="{relatedLink.title}"
target="{n:targetLink(link:relatedLink.uri)}">{f:if(condition:
relatedLink.title, then: relatedLink.title, else:
relatedLink.uri)}</f:link.page>
                                    <f:if
condition="{relatedLink.description}"><span>{relatedLink.description}</span></f:if>
                                </li>
                            </f:for>
                        </ul>
                    </div>
                    </div>
                   </div> <!-- Panel Ende -->
                </f:if>
               
        <div class="panel panel-default">
                    <div class="panel-heading">Komentare eingeben</div>
        <div class="panel-body">
                    <div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/de_DE/all.js#xfbml=1&appId=xxxxxxx";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
           
        <div class="fb-comments" data-href="http://pini.leicht.info"
data-width="415" data-numposts="10" data-colorscheme="light"></div>   
            </div>
            </div>
       

        <div class="panel panel-default">
             <div class="panel-heading">Empfehlen Sie die Seite weiter</div>
 
            <f:if condition="{settings.detail.showSocialShareButtons}">
                <div class="panel-body">
                    <div class="facebook">
                        <div class="like">
                           
<n:social.facebook.like></n:social.facebook.like>
                        </div>
                </div> 
              <!-- <div class="panel-body">  
                        <div class="share">
                          
<n:social.facebook.share>Share</n:social.facebook.share>
                        </div>
                </div>-->
                <div class="panel-body">
                        <div class="twitter">
                            <n:social.twitter>Twitter</n:social.twitter>
                        </div>
                    </div>
                </div>
            </f:if>
        </div>
           

            </div> <!-- Hauptbereich ENDE -->
           
   
            <div class="col-md-4">
                <!-- Bilder Rechts einbinden -->
                <f:render partial="Detail/BildContainerRechts"
arguments="{media: newsItem.media, settings:settings}" />
               

            </div>
            </div> <!--row end-->
 
        </f:then>
        <f:else>

        </f:else>
    </f:if>
</f:section>

</div>
</div>



Am 27.03.2014 19:07, schrieb Sonja Dithmers:
> Hallo,
> bei mir steht auch gerade dieses Thema an. Ich möchte auch
> unterschiedliche Bilder an unterschiedlichen Plätzen in der
> Detailansicht anzeigen lassen. Folgendes habe ich im Template stehen,
> an der Stelle wo ein Bild hin soll:
>
> <f:if condition="{newsItem.media}">
>                 <f:for each="{newsItem.media}" as="mediaElement"
> iteration="mediaIterator">
>             <f:render partial="Detail/MediaImageLarge"
> arguments="{media: newsItem.media, settings:settings,
> mediaIterator:mediaIterator}" />
>                     </f:for>
>                 </f:if>
>
> Und das im Partial (welches MediaImageLarge heißt):
>
> <f:if condition="{mediaIterator.cycle} == 1">
>     <!-- media files -->
>         <f:then>
>                 <f:image
>                     class="img-news"                    
> src="uploads/{mediaElement.image}"                    
> title="{mediaElement.title}"                     alt="{mediaElement.alt}"
>                 />
>         </f:then>
> </f:if>
>
> Dabei kommt allerdings folgende Fehlermeldung raus:
>
> Supplied file object type TYPO3\CMS\Core\Resource\Folder must be File
> or FileReference.
> Referenziert habe ich den Ordner doch im f:image. Ist das nicht
> richtig, oder interpretiere ich die Fehlermeldung falsch?
>