Mrz 15

Bei der Seite für das Geschäft meiner Familie, die ich gerade entwickle, wollte ich eine Lightbox verwenden. Die erste Extension die ich fand war kj_imagelightbox2, welche eigentlich genau das macht was ich wollte. Allerdings mit einigen Einschränkungen. Zum einen wollte ich gerne die auf MooTools basierende Slimbox verwenden, ergo auch MooTools und zum anderen verwende ich auf der Seite auch tt_news, was standardmäßig nicht unterstützt wird. Da man diese kleinen Mankos relativ einfach beheben kann und dadurch die Extension noch ein wenig flexibler wird, möchte hier meine Lösung posten. Also zum Punkt 1: MooTools und Slimbox. Da ich auch die queo_speedup verwende um die Performance etwas zu erhöhen, binde ich diese Files natürlich mit page.includeJS bzw page.includeCSS ein, soweit kein Problem. Da ich nun allerdings das statische Template der Extension nicht mehr brauche bzw. nicht mehr haben will, muss ich ein Stück des Typoscript-Codes, nämlich das Stück was die Links modifiziert, in mein Template übernehmen:

# Including library for imagelightbox
includeLibs.tx_kjimagelightbox2 = EXT:kj_imagelightbox2/lib/class.tx_kjimagelightbox2.php

tt_content.image.20.1 {

	# Image caption in lightbox
	titleText.override {
		field = {$plugin.tx_kjimagelightbox2.captionField}
		htmlSpecialChars = 1
		if.isTrue.field = tx_kjimagelightbox2_activate
	}

	imageLinkWrap {
		typolink {
            parameter {
                listNum.stdWrap.if.isTrue.field = image_link

                # Overriding ONLY when imagezoom AND lightbox are activated AND no link is set
                override {
                    cObject = IMG_RESOURCE
                    cObject.file {
                        import.data = TSFE:lastImageInfo|origFile
                        maxW = 800
                        maxH = 600
                    }
                    if.isTrue.field = image_zoom
                    if.isTrue.field = tx_kjimagelightbox2_activate
                    if.isFalse.field = image_link
                }
          	}
           userFunc = tx_kjimagelightbox2->main
           wrap = |
        }
    }
}

Die einzige Änderung war in meinem Fall die Ersetzung der width und height-Konstanten durch konkrete Werte, ansonsten entspricht dieser Code genau dem, der auch im static Template der Extension beiliegt. Nun also zum Punkt Nummer 2: tt_news. Nach einer kurzen Recherche im Netz stieß ich auf die perfect-Lightbox-Extension im TER, woher ich mir diesen Code gemoppst habe:

temp.imageLinkWrap = 1
temp.imageLinkWrap {
    enable = 1
    typolink {

        ### Note the names of the fields! They are different from the ones tt_content uses! (except imagecaption)
        title.field = imagecaption // imagealttext // imagetitletext
        title.split.token.char = 10
        ### This works only with the imageMarkerFunc!
        title.split.returnKey.data = register : IMAGE_NUM_CURRENT
        title.htmlSpecialChars = 1

        parameter.cObject = IMG_RESOURCE
        parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
        parameter.cObject.file.maxW = 800
        parameter.cObject.file.maxH = 600        

        ATagParams = rel="lightbox[lb{field:uid}]"
        ATagParams.insertData = 1
    }
}

plugin.tt_news.displayLatest.image.imageLinkWrap >
plugin.tt_news.displayLatest.image.imageLinkWrap < temp.imageLinkWrap

Auch hier habe ich lediglich die Konstanten für die Bildgröße durch Zahlenwerte ersetzt. Wenn man es ganz ordentlich macht, dann kann man natürlich noch eigene Konstanten verwenden um nur eine Stelle für Änderungen zu haben.

Jedenfalls sieht man auf der Seite, dass die Änderungen genau das gweünschte Verhalten erzeugen, womit ich vollkommen zufrieden bin. DANKE, liebe Extension-Entwickler!

Einen Kommentar schreiben