Board.jpg

Images mehrspaltig und "automatisch" zentriert

( wurde überarbeitet, R533 )

ContentPart: Bilder < div >

verwendetes Template: sample.tmpl

So sehen die Bilder mit dem Template sample.tmpl aus!

 

D520.jpg
D520Cockp.jpg
D520Germ2.jpg

D520steht-3.jpg
Grundplatte-3.jpg

ContentPart: Bilder < div >

verwendetes eigenes neues Template (4 Spalten)

D520.jpg

Bild 1

D520Cockp.jpg

Bild 2

D520Germ2.jpg

Bild 3

D520steht-3.jpg

Bild 4


Grundplatte-3.jpg

Bild 5

ContentPart: Bilder < div >

verwendetes eigenes neues Template (3 Spalten)

Und so mit dem veränderten Template.

 

D520.jpg

Bild 1

D520Cockp.jpg

Bild 2

D520Germ2.jpg

Bild 3


D520steht-3.jpg

Bild 4

Grundplatte-3.jpg

Bild 5

ContentPart: Bilder < div >

verwendetes eigenes neues Template (1 Spalten)

D520.jpg

Bild 1


D520Cockp.jpg

Bild 2


D520Germ2.jpg

Bild 3


D520steht-3.jpg

Bild 4


Grundplatte-3.jpg

Bild 5

Es gibt auch noch die Möglichkeit, das Template so zu gestalten, dass die Angabe der Spalten unrelevant ist und anhand der Bildbreite die Anordnung der Bilder sich auf das umgebende DIV focusziert.

Mit der Konfiguration oben im Template läßt sich das leicht einstellen:

col  = 1000

Das war's dann auch schon!

Das veränderte Template!

Dank pepe'S Hinweisen, Knobelei und meiner Nachbearbeitung R533

<!--IMAGE_SETTINGS_START//-->
; this is formatted like WIN.INI
; please, do not use comments for value lines
; settings will overwrite ContentPart settings
;
; "center_image" Werteauswahl:
; 0 = no center, 1 = horizontal/vertical, 2 = horizontal, 3 = vertical
center_image   = 0
;
;width          = 240
;height         = 180
;crop           = 1
;
;col            = 3
;space          = 10
;
;zoom           = 1
;lightbox       = 1
;nocaption      = 1
;
<!--IMAGE_SETTINGS_END//-->    
<!--IMAGES_HEADER_START//-->
<!-- CSS: 
        .images {     text-align: center;    }
        .imageEntry { display: inline-block; 
                      border: 1px solid #BBBBBB; 
                      padding: 5px;           
                      margin:3px 0 0 3px;       }
        .imageEntry p {margin-top: 3px;}
 -->
                      
    [TITLE]<h3>{TITLE}</h3>[/TITLE]
    [SUBTITLE]<h4>{SUBTITLE}</h4>[/SUBTITLE]
    [TEXT]{TEXT}[/TEXT]
    <div class="images"><!--
    <!--IMAGES_HEADER_END//-->

    <!--IMAGES_ENTRY_START//--> --><div class="imageEntry">
        {IMAGE}[CAPTION]
        <p>{CAPTION}</p>[/CAPTION]
    </div><!-- <!--IMAGES_ENTRY_END//-->

    <!--IMAGES_ENTRY_SPACER_START//--><!--IMAGES_ENTRY_SPACER_END//-->

    <!--IMAGES_ROW_SPACER_START//--> --><br /><!-- <!--IMAGES_ROW_SPACER_END//-->

    <!--IMAGES_FOOTER_START//-->
    --></div>
    <!--IMAGES_FOOTER_END//-->       
| zurück/back | Impressum | Sitemap | Kontakt | Datenschutz | © 2008 · Spielwiese · powered by PHPcms