NAVIGATION
[[Bilder spezial]]
Differences
This shows you the differences between two versions of the page.
|
deutsch:phpwcms-system:artikel:contentparts:bilder-spezial [2009/11/22 02:00] Knut Heermann (flip-flop) |
deutsch:phpwcms-system:artikel:contentparts:bilder-spezial [2018/06/03 18:08] (current) |
||
|---|---|---|---|
| Line 48: | Line 48: | ||
| \\ | \\ | ||
| - | **Die Ausgabe:** | + | ==== Die Ausgabe: ==== |
| {{:english:phpwcms-system:article:contentparts:images-special:image-special_fe01_1.gif|}} | {{:english:phpwcms-system:article:contentparts:images-special:image-special_fe01_1.gif|}} | ||
| - | <code html|h my_default.tmpl|h> | + | |
| + | ==== Template: ==== | ||
| + | |||
| + | **Ort:** template/inc_cntpart/imagespecial/my_default.tmpl | ||
| + | |||
| + | \\ | ||
| + | **Auszug zwischen:** | ||
| + | <file><!--IMAGES_ENTRY_START//--> .... <!--IMAGES_ENTRY_END//--></file> | ||
| + | |||
| + | <code html|h my_default.tmpl snippet|h> | ||
| + | <!--IMAGES_ENTRY_START//--> | ||
| <div style="float:left;" class="imageEntry" id="img{IMGID}"> | <div style="float:left;" class="imageEntry" id="img{IMGID}"> | ||
| {IMAGE} | {IMAGE} | ||
| Line 74: | Line 84: | ||
| </div> | </div> | ||
| </div> | </div> | ||
| + | <!--IMAGES_ENTRY_END//--> | ||
| </code> | </code> | ||
| + | |||
| + | \\ | ||
| + | |||
| + | |||
| + | **Das komplette Template:** | ||
| + | |||
| + | <code html|h my_default.tmpl|h> | ||
| + | <!--IMAGES_HEADER_START//--> | ||
| + | |||
| + | [TITLE]<h1>{TITLE}</h1>[/TITLE] | ||
| + | [SUBTITLE]<h2>{SUBTITLE}</h2>[/SUBTITLE] | ||
| + | [TEXT]{TEXT}[/TEXT] | ||
| + | |||
| + | <div class="images" id="images{ID}"> | ||
| + | <!--IMAGES_HEADER_END//--> | ||
| + | |||
| + | |||
| + | <!--IMAGES_ENTRY_START//--> | ||
| + | <div style="float:left;" class="imageEntry" id="img{IMGID}"> | ||
| + | {IMAGE} | ||
| + | <div style="color: red;"> | ||
| + | [CAPTION]<p><span class="cut_caption-c30">{CAPTION}</span></p>[/CAPTION][CAPTION_ELSE]<p>{IMGNAME}</p>[/CAPTION_ELSE] | ||
| + | </div> | ||
| + | <div style="width:{THUMB_WIDTH}px;"> | ||
| + | |||
| + | [INFOHTML] | ||
| + | <div style="color: blue;"> | ||
| + | <!-- pure HTML info text --> | ||
| + | {INFOHTML} | ||
| + | </div> | ||
| + | [/INFOHTML] | ||
| + | </div> | ||
| + | </div> | ||
| + | <!-- | ||
| + | Article-ID: {CURRENT_ARTICLEID} | ||
| + | Category-ID: {CURRENT_CATEGORYID} | ||
| + | Thumbnail image: {THUMB_NAME} | ||
| + | ID/Hash/Ext: {THUMB_ID}/{THUMB_HASH}/{THUMB_EXT} | ||
| + | relative: {THUMB_REL} | ||
| + | absolute: {THUMB_ABS} | ||
| + | height/width: {THUMB_HEIGHT}px/{THUMB_WIDTH}px | ||
| + | height/width max: {THUMB_HEIGHT_MAX}px/{THUMB_WIDTH_MAX}px | ||
| + | columns: {THUMB_COLUMNS} | ||
| + | |||
| + | If you are not sure wrap zoomed image: | ||
| + | [ZOOM] | ||
| + | Zoomed (big) image: {IMAGE_NAME} | ||
| + | ID/Hash/Ext: {IMAGE_ID}/{IMAGE_HASH}/{IMAGE_EXT} | ||
| + | relative: {IMAGE_REL} | ||
| + | absolute: {IMAGE_ABS} | ||
| + | height/width: {IMAGE_HEIGHT}px/{IMAGE_WIDTH}px | ||
| + | [/ZOOM] | ||
| + | |||
| + | Image URL: {IMAGE_URL}, Target: {IMAGE_TARGET} | ||
| + | |||
| + | [EFFECT_1]Yes Effect 1[/EFFECT_1] | ||
| + | [EFFECT_2]Yes Effect 2[/EFFECT_2] | ||
| + | [EFFECT_3]Yes Effect 3[/EFFECT_3] | ||
| + | |||
| + | //--> | ||
| + | <!--IMAGES_ENTRY_END//--> | ||
| + | |||
| + | |||
| + | <!--IMAGES_ENTRY_SPACER_START//--> | ||
| + | |||
| + | <!-- space between images {SPACE}px --> | ||
| + | |||
| + | <div style="float:left;"><img src="img/leer.gif" alt="" border="0" height="150" width="{SPACE}"></div> | ||
| + | |||
| + | <!--IMAGES_ENTRY_SPACER_END//--> | ||
| + | |||
| + | |||
| + | <!--IMAGES_ROW_SPACER_START//--> | ||
| + | |||
| + | <div style="clear:both;"><img src="img/leer.gif" alt="" border="0" height="{SPACE}" width="100"></div> | ||
| + | |||
| + | <!-- space between image rows {SPACE}px --> | ||
| + | |||
| + | <!--IMAGES_ROW_SPACER_END//--> | ||
| + | |||
| + | |||
| + | <!--IMAGES_FOOTER_START//--> | ||
| + | |||
| + | <div style="clear:both;"><!-- clear //--></div> | ||
| + | |||
| + | </div> | ||
| + | |||
| + | <!--IMAGES_FOOTER_END//--> | ||
| + | </code> | ||
| + | |||
| <note>**Dieser "abgeschnittene ..." Bildunterzeilentext //(caption)// ist eine spezielle Funktion.** \\ | <note>**Dieser "abgeschnittene ..." Bildunterzeilentext //(caption)// ist eine spezielle Funktion.** \\ | ||
| Line 141: | Line 242: | ||
| ~~UP~~ | ~~UP~~ | ||
| + | ===== {INFOTEXT} & LightBox: ===== | ||
| + | |||
| + | |||
| + | OG hat mit **{LIGHTBOX_CAPTION}** einen Tag eingeführt der auch gleichzeitig die Textübergaberegel für die LightBox beinhaltet, die lautet:\\ | ||
| + | **title="mein Text für die LightBox"**(Allerdings in einer speziellen Formatierung ([[http://de.selfhtml.org/html/referenz/zeichen.htm|HTML-Entities]])-> aus **<**br /**>** wird **<**br /**>**). | ||
| + | |||
| + | |||
| + | Also wenn z.B. der InfoText in die Lightbox soll, dann würde | ||
| + | |||
| + | [ZOOM]<a href="{IMAGE_ABS}" **{LIGHTBOX_CAPTION}**target="_blank"{LIGHTBOX}> | ||
| + | |||
| + | getauscht gegen | ||
| + | |||
| + | [ZOOM]<a href="{IMAGE_ABS}" ##title="{INFOTEXT}"## target="_blank"{LIGHTBOX}> | ||
| + | |||
| + | technisches: \\ | ||
| + | ---- | ||
| + | |||
| + | Die korrekte Form wäre (INFOTEXT geht nicht, daher INFOHTML): | ||
| + | |||
| + | [ZOOM]<a href="{IMAGE_ABS}" ##title="<p>[PHP] echo html_entities(nl2br('{INFOHTML}'));[/PHP]</p>"## target="_blank"{LIGHTBOX}> | ||
| + | |||
| + | ---- | ||
| + | |||
| + | Verwendet ruhig die erste Variante, sollte funktionieren. | ||
| + | |||
| + | <note important> | ||
| + | Bitte das nun hinzugekommene Leerzeichen zwischen ......**''title="{INFOTEXT}"## ##target="''**........ | ||
| + | beachten. | ||
| + | </note> | ||
| + | |||
| + | ~~UP~~ | ||
| ===== Spaltenanzahl und Bildabstand ===== | ===== Spaltenanzahl und Bildabstand ===== | ||
