Login / Status
developer.Resource
Home . Documentation . Document Library
Sponsors
hosted by punkt.deTYPO3 and Open Source Magazine

8.16. IMGTEXT:

This object is designed to align images and text. This is normally used to render text/picture records from the tt_content table.

The image(s) are placed in a table and the table is placed before, after or left/right relative to the text.

See code-examples.

Property:

Data type:

Description:

Default:

text

->CARRAY /stdWrap

Use this to import / generate the content, that should flow around the imageblock.

textPos

int /stdWrap

Textposition:

bit[0-2]: 000 = centre, 001 = right, 010 = left

bit[3-5]: 000 = over, 001 = under, 010 text

0 - Above: Centre

1 - Above: Right

2 - Above: Left

8 - Below: Centre

9 - Below: Right

10 - Below: Left

17 - In Text: Right

18 - In Text: Left

25 - In Text: Right (no wrap)

26 - In Text: Left (no wrap)

textMargin

pixels /stdWrap

margin between the image and the content

textMargin_outOfText

boolean

If set, the textMargin space will still be inserted even if the image is placed above or below the text.

This flag is only for a kind of backwards compatibility because this "feature" was recently considered a bug and thus corrected. So if anyone has depended on this way things are done, you can compensate with this flag.

imgList

list of imagefiles /stdWrap

list of images from ".imgPath"

Example:

This imports the list of images from tt_content's image-field

"imgList.field = image"

imgPath

path /stdWrap

Path to the images

Example:

"uploads/pics/"

imgMax

int /stdWrap

max number of images

imgStart

int /stdWrap

start with image-number ".imgStart"

imgObjNum

imgObjNum +optionSplit

Here you define, which IMAGE-cObjects from the array "1,2,3,4..." in this object that should render the images.

"current" is set to the image-filename.

Example:

"imgObjNum = 1 |*||*| 2":

This would render the first two images with "1. ..." and the last image with "2. ...", provided that the ".imgList" contains 3 images.

1,2,3,4

->IMAGE (cObject)

Rendering of the images

The register "IMAGE_NUM" is set with the number of image being rendered for each rendering of a image-object. Starting with zero.

The image-object should not be of type GIFBUILDER!

Important:

"file.import.current = 1" fetches the name of the images!

caption

->CARRAY /stdWrap

Caption

captionAlign

align /stdWrap

Caption alignment

default = ".textPos"

captionSplit

boolean

If this is set, the caption text is split by the character (or string) from ".token" , and every item is displayed under an image each in the image block.

.token = (string/stdWrap) Character to split the caption elements (default is chr(10))

.cObject = cObject, used to fetch the caption for the split

.stdWrap = stdWrap properties used to render the caption.

altText

titleText

string /stdWrap

Default altText/titleText if no alternatives are provided by the ->IMAGE cObjects

If no titltext is specified, it will use the alttext insteadIf no alttext is specified, it will use an empty alttext

longdescURL

string /stdWrap

Default longdescURL if no alternatives are provided by the ->IMAGE cObjects

"longdesc" attribute (URL pointing to document with extensive details about image).

border

boolean /stdWrap

If true, a border i generated around the images.

borderCol

HTML-color /stdWrap

Color of the border, if ".border" is set

black

borderThick

pixels /stdWrap

Width of the border around the pictures

1

cols

int /stdWrap

Columns

rows

int /stdWrap

Rows (higher priority thab "cols")

noRows

boolean /stdWrap

If set, the rows are not divided by a table-rows. Thus images are more nicely shown if the height differs a lot (normally the width is the same!)

noCols

boolean /stdWrap

If set, the columns are not made in the table. The images are all put in one row separated by a clear giffile to space them apart.

If noRows is set, noCols will be unset. They cannot be set simultaneously.

colSpace

int /stdWrap

space between columns

rowSpace

int /stdWrap

space between rows

spaceBelowAbove

int /stdWrap

Pixelsspace between content an images when position of image is above or belox text (but not in text)

tableStdWrap

->stdWrap

This passes the final <table> code for the image block to the stdWrap function.

maxW

int /stdWrap

max width of the image-table.

This will scale images not in the right size! Takes the number of columns into account!

NOTE: Works ONLY if IMAGE-obj is NOT GIFBUILDER

maxWInText

int /stdWrap

max width of the image-table, if the text is wrapped around the image-table (on the left or right side).

This will scale images not in the right size! Takes the number of columns into account!

NOTE: Works ONLY if IMAGE-obj is NOT GIFBUILDER

50% of maxW

equalH

int /stdWrap

If this value is greater than zero, it will secure that images in a row has the same height. The width will be calculated.

If the total width of the images raise above the "maxW"-value of the table the height for each image will be scaled down equally so that the images still have the same height but is within the limits of the totalWidth.

Please note that this value will override the properties "width", "maxH", "maxW", "minW", "minH" of the IMAGE-objects generating the images. Furthermore it will override the "noRows"-property and generate a table with no columns instead!

colRelations

string /stdWrap

This value defines the width-relations of the images in the columns of IMGTEXT. The syntax is "[int] : [int] : [int] : ..." for each column. If there are more imagecolumns than figures in this value, it's ignored. If the relation between two of these figures exceeds 10, this function is ignore.

It works only fully if all images are downscaled by their maxW-definition.

Example:

If 6 images are placed in three columns and their width's are high enough to be forcibly scaled, this value will scale the images in the to be eg. 100, 200 and 300  pixels from left to right

1 : 2 : 3

image_compression

int /stdWrap

Image Compression:

0= Default

1= Dont change! (removes all parameters for the image_object!!)

(adds gif-extension and color-reduction command)

10= GIF/256

11= GIF/128

12= GIF/64

13= GIF/32

14= GIF/16

15= GIF/8

(adds jpg-extension and quality command)

20= IM: -quality 100

21= IM: -quality 90 <=> Photoshop 60     (JPG/Very High)

22= IM: -quality 80    (JPG/High)

23= IM: -quality 70

24= IM: -quality 60 <=> Photoshop 30   (JPG/Medium)

25= IM: -quality 50

26= IM: -quality 40  (JPG/Low)

27= IM: -quality 30 <=> Photoshop 10

28= IM: -quality 20   (JPG/Very Low)

The default ImageMagick quality seems to be 75. This equals Photoshop quality 45. Images compressed with ImageMagick with the same visual quality as a Photoshop-compressed image seems to be largely 50% greater in size!!

NOTE: Works ONLY if IMAGE-obj is NOT GIFBUILDER

image_effects

int /stdWrap

Adds these commands to the parameteres for the scaling. This function has no effect if "image_compression" above is set to 1!!

1 => "-rotate 90",

2 => "-rotate 270",

3 => "-rotate 180",

10 => "-colorspace GRAY",

11 => "-sharpen 70",

20 => "-normalize",

23 => "-contrast",

25 => "-gamma 1.3",

26 => "-gamma 0.8"

NOTE: Works ONLY if IMAGE-obj is NOT GIFBUILDER

image_frames

Array

+ .key /stdWrap

Frames:

.key points to the frame used.

".image_frames.x" is imgResource-mask (".m")properties which will override to the [imgResource].m properties of the imageObjects. This is used to mask the images into a frame. See how it's done in the default configuration and IMGTEXT in the static_template-table.

Example:

1 {

  mask = media/uploads/darkroom1_mask.jpg

  bgImg = GIFBUILDER

  bgImg {

    XY = 100,100

    backColor = {$bgCol}

  }

  bottomImg = GIFBUILDER

  bottomImg {

    XY = 100,100

    backColor = black

  }

  bottomImg_mask = media/uploads/darkroom1_bottom.jpg

}

NOTE: This cancels the jpg-quality settings sent as ordinary ".params" to the imgResource. In addition the output of this operation will always be jpg or gif!

NOTE: Works ONLY if IMAGE-obj is NOT GIFBUILDER

netprintApplicationLink

boolean /+properties

Set true, if you would like to enable the netprint feature.

“Netprint” is a TYPO3 application which is still in development. 'Netprint' allows film development stores to offer online submission of Photos to a TYPO3 / Netprint server in-house from which the store offer enlargements of digital photos on eg Kodak Royal paper.

The application will be released under GNU/GPL sometime in 2002.

'Netprint' offers a feature to fetch images from peoples online fotoalbums. This property enables links from your site images to a Netprint server.

Properties:

.url = Url of the Netprint site page, eg. http://netprint.photo.com/?id=999&type=2

.thisUrl = Url of this site, eg. http://mysite.com/typo3site/ (default is calculated from HTTP_HOST)

.cObject = (cObject) The link content

.ATagParams = <A>-tag parameters /stdWrap

.outerStdWrap = (->stdWrap) stdWrap of the total linked cObject.

.before = (boolean) If the link code should be inserted before the image (default is after)

.linkOnlyPixelsAbove = (int) If set, only images with a total number of pixels greater than this number will be linked. This secures that small images will not be linked. Eg. if images above 640x480 is supposed to be linked, the limit should be approx. 300000

editIcons

string

(See stdWrap.editIcons)

noStretchAndMarginCells

boolean

If set (1), the cells used to add left and right margins plus stretch out the table will not be added. You will loose the ability to set margins for the object if entered “in text”. So it's not recommended, but it has been requested by some people for reasons.

stdWrap

->stdWrap

[tsref:(cObject).IMGTEXT]

Example:

tt_content.textpic.default {
  5 = IMGTEXT
  5 {  
    text < tt_content.text.default
    imgList.field = image
    textPos.field = imageorient
    imgPath = uploads/pics/
    imgObjNum = 1
    1 {
       file.import.current = 1
       file.width.field = imagewidth
       imageLinkWrap = 1
       imageLinkWrap {
         bodyTag = <BODY bgColor=black>
         wrap = <A href="javascript:close();"> | </A>
         width = 800m
         height = 600m
         JSwindow = 1
         JSwindow.newWindow = 1
         JSwindow.expand = 17,20
       }
    }
    maxW = 450
    maxWInText = 300
    cols.field = imagecols
    border.field = imageborder
    caption {
      1 = TEXT
      1.field = imagecaption
      1.wrap = <font size="1"> |</font>
      1.wrap2 = {$cBodyTextWrap}
    }
    borderThick = 2
    colSpace = 10
    rowSpace = 10
    textMargin = 10
  }
  30 = HTML
  30.value = <br>
}