TYPO3-Testaccount
Testen Sie die aktuellste TYPO3-Version kostenlos und unverbindlich für einen Monat!

Jetzt testen!

Schulungen

Title & Subtitle in pmklightbox ausgeben?


Autor Nachricht
Verfasst am: 09. 06. 2009 [17:25]
rheingau360
Themenersteller
Dabei seit: 07.12.2006
Beiträge: 134
Hallo zusammen,

ich benutze tt_products 2.7.1 auf TYPO3 4.2.6 und habe zur Vergrößerung meiner Listen-Images die pmklightbox-Extension installiert.

Im Setup meines tt_products Extensiontemplates habe ich nun folgendes eingetragen, um die Lightbox zu aktivieren (klappt auch 1a):

TYPOSCRIPT
plugin.tt_products {
 
image {
imageLinkWrap {
typolink {
 
parameter.cObject = IMG_RESOURCE
parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
ATagParams = rel="lightbox"
ATagParams.override = rel="lightbox[sb{field:uid}]"
ATagParams.override.if.isTrue = {$plugin.pmkslimbox.imgtext.navigable}
ATagParams.insertData = 1
 
}
}
}
 
listImage {
imageLinkWrap {
typolink {
parameter.cObject = IMG_RESOURCE
parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
ATagParams = rel="lightbox"
ATagParams.override = rel="lightbox[sb{field:uid}]"
ATagParams.override.if.isTrue = {$plugin.pmkslimbox.imgtext.navigable}
ATagParams.insertData = 1
 
}
}
}
 
basketImage {
imageLinkWrap {
typolink {
parameter.cObject = IMG_RESOURCE
parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
ATagParams = rel="lightbox"
ATagParams.override = rel="lightbox[sb{field:uid}]"
ATagParams.override.if.isTrue = {$plugin.pmkslimbox.imgtext.navigable}
ATagParams.insertData = 1
 
}
}
}
}


Wie muss ich den Code erweitern, dass mir in der Lighbox der Titel und der Subtitel des Produktes angezeigt werden?

Lieben Dank schon einmal für jede Antwort !!!

LG, Kai
ProfilICQ
Verfasst am: 09. 06. 2009 [18:20]
rheingau360
Themenersteller
Dabei seit: 07.12.2006
Beiträge: 134
ich bin jetzt schon einen kleinen Schritt weiter. Ich habe jetzt bewirkt, dass mir der Page-Titel als Bildunterschrift angezeigt wird. Da ich die Bilder aber aus einer Listenansicht aufgehen lasse, benötige ich natürlich den Produkt-Titel. Vielleicht kann mir jemand verraten, wie ich den Namen dieses Feldes ausgeben lassen kann (?).

Für die Ausgabe des Page-Titels sieht das Setup jetzt wie folgt aus:

TYPOSCRIPT
plugin.tt_products {
    # Slinbox für Bilder
 
image {
 
imageLinkWrap {
typolink {
 
parameter.cObject = IMG_RESOURCE
parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
  ATagParams = rel="lightbox" 
    ATagParams.override = rel="lightbox[sb{field:uid}]" title="{page:title}"
    ATagParams.override.if.isTrue = 1 
    ATagParams.insertData = 1 
 
 
 }
 }
 }
 
listImage {
imageLinkWrap {
typolink {
parameter.cObject = IMG_RESOURCE
parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
  ATagParams = rel="lightbox" 
    ATagParams.override = rel="lightbox[sb{field:uid}]" title="{page:title}"
    ATagParams.override.if.isTrue = 1 
    ATagParams.insertData = 1 
}
}
}
 
basketImage {
imageLinkWrap {
typolink {
parameter.cObject = IMG_RESOURCE
parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
  ATagParams = rel="lightbox" 
    ATagParams.override = rel="lightbox[sb{field:uid}]" title="{page:title}"
    ATagParams.override.if.isTrue = 1 
    ATagParams.insertData = 1 
}
}
}
}
ProfilICQ
Verfasst am: 14. 03. 2010 [20:56]
typo33
Dabei seit: 23.12.2008
Beiträge: 5
Hallo,

hast Du schon eine Lösung?
Profil
Verfasst am: 15. 03. 2010 [08:33]
rheingau360
Themenersteller
Dabei seit: 07.12.2006
Beiträge: 134
Hi,

ich habe es auch nicht geschafft, den Titel ausgeben zu lassen, ABER es funktionieren ein paar andere Felder. Es ist schon ein Weilchen her und ich müsste mich genauer damit beschäftigen. Bei einem kurzen Blick ins Backend von meinem damaligen Kunden sehe ich aher, dass der Text, der bei uns in der Lightbox erscheint im Produktdatensatz-Feld "Bemerkungen" (Marker ###NOTE###) steht.

Da es sich um einen Bilder-Shop handelt, bei dem ich dieses Feld sonst nicht brauche, war diese Lösung für mich okay.

Hier noch mein TS Setup. Da kannst du es sehen.

TYPOSCRIPT
page.1230 = COA
page.1230 {
	10 = USER
	10.userFunc = user_slimbox->addJS
	10.jsfile.dataWrap = {$plugin.pmkslimbox.mootoolsJS}
 
	20 = USER
	20.userFunc = user_slimbox->addJS
	20.jsfile.dataWrap = {$plugin.pmkslimbox.slimboxJS}
 
	30 = USER
	30.userFunc = user_slimbox->addJS
	30.jsdata.cObject = COA
	30.jsdata.cObject {  
		1 = TEXT
		1.value = Slimbox.scanPage = function() {var links = $$("a&quot<img src="typo3conf/ext/mm_forum//res/smilies/icon_wink.gif" alt="icon_wink.gif" />.filter(function(el) {return el.rel && el.rel.test(/^lightbox/i);});
		2 = TEXT
		2.value = $$(links).slimbox({resizeDuration: {$plugin.pmkslimbox.resizeDuration}, resizeTransition: Fx.Transitions.{$plugin.pmkslimbox.resizeTransition}, opacity: {$plugin.pmkslimbox.opacity}, opacityDuration: {$plugin.pmkslimbox.opacityDuration}, loop: {$plugin.pmkslimbox.loop}, initialWidth: {$plugin.pmkslimbox.initialWidth}, initialHeight: {$plugin.pmkslimbox.initialHeight}, animateCaption: {$plugin.pmkslimbox.animateCaption}, showCounter: {$plugin.pmkslimbox.showCounter},
		3 = TEXT
		3.value = counterText: '{LLL:EXT:pmkslimbox/locallang.xml:counterText}', psScriptPath: '{path:EXT:pmkslimbox/savefile.php}'
		3.insertData = 1
		4 = TEXT
		4.value = }, null, function(el) {return (this == el) || ((this.rel.length > <img src="typo3conf/ext/mm_forum//res/smilies/icon_cool.gif" alt="icon_cool.gif" /> && (this.rel == el.rel));});};window.addEvent("domready", Slimbox.scanPage);
	}
}
page.headerData.1230 = TEXT
page.headerData.1230.dataWrap (
	<link rel="stylesheet" href="{path:{$plugin.pmkslimbox.slimboxCSS}}" type="text/css" media="screen" />
)
 
tt_content.image.20.1 {
 
	titleText.field = {$plugin.pmkslimbox.imgtext.captionField}
	titleText.htmlSpecialChars = 1
 
	# Removing the default "imageLinkWrap" TS code, and add new one to enable Lightbox effect.
	imageLinkWrap >
	imageLinkWrap = 1
	imageLinkWrap {
 
		# Enable linkwrapping if either click-enlarge is selected or a link is defined.
		enable.field = image_zoom
		enable.ifEmpty.typolink.parameter.field = image_link
		enable.ifEmpty.typolink.parameter.listNum.stdWrap.data = register : IMAGE_NUM_CURRENT
		enable.ifEmpty.typolink.returnLast = url
 
		# Add new typolink wrapping code
		typolink {
			target = {$styles.content.links.target}
			extTarget = {$styles.content.links.extTarget}
 
			# This returns a link, pointing to the path + name of the original image.
			# or to the path + name of the resized lightbox image (if maxH or maxW is reached.)
			parameter.cObject = IMG_RESOURCE
			parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
			parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
			parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
			# Except if the linkfield is not empty
			parameter.override.field = image_link
			parameter.override.listNum.stdWrap.data = register : IMAGE_NUM_CURRENT
			parameter.override.if.isTrue.field = image_link
 
			# Add the "rel" attribute needed to activate the lightbox effect.
			ATagParams = rel="lightbox"
			ATagParams.override = rel="lightbox[sb{field:uid}]"
			ATagParams.override.if.isTrue = {$plugin.pmkslimbox.imgtext.navigable}
			ATagParams.insertData = 1
			ATagParams.if.isTrue.field = image_zoom
 
		}
	}
}
 
 
temp.imageLinkWrap {
	enable = 1
 
	# Add new typolink wrapping code
	typolink {
		# Set the title of the A tag, which is used as caption inside the Lightbox
		title.field = {$plugin.pmkslimbox.tt_news.captionField}
		title.split.token.char = 10
		title.split.returnKey.data = register : IMAGE_NUM_CURRENT
		title.htmlSpecialChars = 1
		#title.if.isTrue = {$plugin.pmkslimbox.tt_news.enableSplit}
 
		# This returns a link, pointing to the path + name of the original image.
		# or to the path + name of the resized lightbox image (if maxH or maxW is reached.)
		parameter.cObject = IMG_RESOURCE
		parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
		parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
		parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
 
		# Add the "rel" attribute needed to activate the lightbox effect.
		ATagParams = rel="lightbox"
		ATagParams.override = rel="lightbox[sb{field:uid}]"
		ATagParams.override.if.isTrue = {$plugin.pmkslimbox.tt_news.navigable}
		ATagParams.insertData = 1
	}
}
 
 
 
 
###############
 
plugin.tt_products.image {
    imageLinkWrap = 1
    imageLinkWrap {
         enable = 1
         typolink {
	parameter.cObject = IMG_RESOURCE
         parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
         parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
         parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
         ATagParams.data = field:note
         ATagParams.dataWrap = rel="lightbox[sb{field:uid}]" title="{field:note}|"
         }
    }
}
 
#Listview
plugin.tt_products.listImage {
   imageLinkWrap = 1
   imageLinkWrap {
         enable = 1
         typolink {
         parameter.cObject = IMG_RESOURCE
         parameter.cObject.file.import.data = TSFE:lastImageInfo|origFile
         parameter.cObject.file.maxW = {$plugin.pmkslimbox.slimBoxMaxW}
         parameter.cObject.file.maxH = {$plugin.pmkslimbox.slimBoxMaxH}
         ATagParams.data = field:note
         ATagParams.dataWrap = rel="lightbox[sb{field:uid}]" title="{field:note}|"
         }
   }
}
 
 
############
 
 
 
 
 
 
 
 
 
 
[globalVar = LIT:1 = {$plugin.pmkslimbox.tt_news.enableSplit}]
# include the php script
includeLibs.imageMarkerFunc = EXT:pmkslimbox/tt_news_imageMarkerFunc.php
plugin.tt_news.imageMarkerFunc = user_imageMarkerFunc
[GLOBAL]
 
[globalVar = LIT:1 = {$plugin.pmkslimbox.tt_news.displaySingle.slimBoxEnable}]
# Change "imageLinkWrap" for the "displaySingle" object of tt_news
plugin.tt_news.displaySingle.image.imageLinkWrap >
plugin.tt_news.displaySingle.image.imageLinkWrap < temp.imageLinkWrap
[GLOBAL]
 
[globalVar = LIT:1 = {$plugin.pmkslimbox.tt_news.displayLatest.slimBoxEnable}]
# Change "imageLinkWrap" for the "displayLatest" object of tt_news
plugin.tt_news.displayLatest.image.imageLinkWrap >
plugin.tt_news.displayLatest.image.imageLinkWrap < temp.imageLinkWrap
[GLOBAL]
 
[globalVar = LIT:1 = {$plugin.pmkslimbox.tt_news.displayList.slimBoxEnable}]
# Change "imageLinkWrap" for the "displayList" object of tt_news
plugin.tt_news.displayList.image.imageLinkWrap >
plugin.tt_news.displayList.image.imageLinkWrap < temp.imageLinkWrap
[GLOBAL]


Constants:
TYPOSCRIPT
plugin.pmkslimbox {
 
	# cat=pmkslimbox/enable/e1; type=boolean; label= SlimBox mode (tt_content): If set, click-enlarged groups of images will be navigable. (Next/Previous buttons ar shown)
	imgtext.navigable = 0
 
	# cat=pmkslimbox/enable/e2; type=boolean; label= SlimBox mode (tt_news): If set, click-enlarged groups of images in tt_news will be navigable. (Next/Previous buttons ar shown)
	tt_news.navigable = 0
 
	tt_products.navigable = 0
 
	# cat=pmkslimbox/enable/e3; type=boolean; label= Caption Animation: Set it to false to disable the caption animation.
	animateCaption = 1
 
	# cat=pmkslimbox/enable/e4; type=boolean; label= Display Print Button: If set, a Print button is displayed in the caption box.
	enablePrintButton = 0
 
	# cat=pmkslimbox/enable/e5; type=boolean; label= Display Save Button: If set, a Save button is displayed in the caption box.
	enableSaveButton = 0
 
	# cat=pmkslimbox/enable/e6; type=boolean; label= Show Counter: Set it to false to disable "Page 1 of 3" text..
	showCounter = 0
 
	# cat=pmkslimbox/enable/e7; type=boolean; label= Enable Splitting in tt_news: If true, then a small userfunction is included for tt_news. This enables splitting of the caption value by setting the register value "IMAGE_NUM_CURRENT" to the current item number. NOTE. If you are using "dam_ttnews" this option should be turned off!
	tt_news.enableSplit = 1
 
	# cat=pmkslimbox/enable/e8; type=boolean; label= Enable SlimBox in displaySingle : If set, LightBox effect will be available in tt_news SingleView when you click on an image.
	tt_news.displaySingle.slimBoxEnable = 1
 
	# cat=pmkslimbox/enable/e9; type=boolean; label= Enable SlimBox in displayLatest : If set, LightBox effect will be available in tt_news LatestView when you click on an image.
	tt_news.displayLatest.slimBoxEnable = 0
 
	# cat=pmkslimbox/enable/ea; type=boolean; label= Enable SlimBox in displayList : If set, LightBox effect will be available in tt_news ListView when you click on an image.
	tt_news.displayList.slimBoxEnable = 0
 
	# cat=pmkslimbox/enable/ec; type=boolean; label= Enable loop : if true, allows to navigate between the first and last images of a Slimbox gallery, when there is more than one image to display.
	loop = 0
 
	# cat=pmkslimbox/dims/d1; type=int+; label= Starting Width: The initial width of the box, in pixels.
	initialWidth = 250
 
	# cat=pmkslimbox/dims/d2; type=int+; label= Starting Height: The initial height of the box, in pixels.
	initialHeight = 250
 
	# cat=pmkslimbox/dims/d3; type=int+; label= SlimBox Max Image Width: Defines the maxwidth of the image shown in the Lightbox.
	slimBoxMaxW = 500
 
	# cat=pmkslimbox/dims/d4; type=int+; label= SlimBox Max Image Height: Defines the maxheight of the image shown in the Lightbox.
	slimBoxMaxH = 500
 
	# cat=pmkslimbox/file/f1; type=file[css]; label= CSS File: CSS file for Slimbox. See EXT:pmkslimbox/res/styles/slimbox_ex.css for an example.
	slimboxCSS = EXT:pmkslimbox/res/styles/slimbox.css
 
	# cat=pmkslimbox/file/f2; type=file[js]; label= Mootools Javascript Library: You only need to change this if you are using Mootools, and need some functions not in the included in the one used as default. (A full version of Mootools v1.2.1 is lotated at EXT:pmkslimbox/res/scripts/mootools-1.2.1_uncompressed.js)
	mootoolsJS = EXT:pmkslimbox/res/scripts/mootools-1.2.1.js
 
	# cat=pmkslimbox/file/f3; type=file[js]; label= Slimbox Javascript Library: You will only need to change this, if you want to use a different version of the slimbox script.
	slimboxJS = EXT:pmkslimbox/res/scripts/slimbox.js
 
	# cat=pmkslimbox//o1; type=int+; label= Resizing Duration: The duration of the resize animation for width and height, in milliseconds.
	resizeDuration = 400
 
	# cat=pmkslimbox//o2; type=options[linear,Quad.easeIn,Quad.easeOut,Quad.easeInOut,Cubic.easeIn,Cubic.easeOut,Cubic.easeInOut,Quart.easeIn,Quart.easeOut,Quart.easeInOut,Quint.easeIn,Quint.easeOut,Quint.easeInOut,Sine.easeIn,Sine.easeOut,Sine.easeInOut,Expo.easeIn,Expo.easeOut,Expo.easeInOut,Circ.easeIn,Circ.easeOut,Circ.easeInOut,Elastic.easeIn,Elastic.easeOut,Elastic.easeInOut,Back.easeIn,Back.easeOut,Back.easeInOut,Bounce.easeIn,Bounce.easeOut,Bounce.easeInOut]; label= SlimBox Transition: The transition you want to use for the resize animation. You can choose amongst lots of cool transitions that are part of the optional "Transitions" module of mootools, like "Fx.Transitions.Elastic.Out". Many transitions require a longer execution time to look good, so you should adjust the resizeDuration option above as well.
	resizeTransition = Sine.easeInOut
 
	# cat=pmkslimbox//o3; type=options[0.0,0.1,0.2,0.3,0.4,0.5,0.6,0.7,0.8,0.9,1.0]; label= Background Opacity Level:
	opacity = 0.8
 
	# cat=pmkslimbox//o4; type=int+; label= Background Opacity Duration: The duration of the opacity fading animation for the background, in milliseconds.
	opacityDuration = 500
 
	# cat=pmkslimbox//o6; type=options[titleText,altText,imagecaption]; label= tt_content Caption Field: tt_content field to use as caption inside the Lightbox.
	imgtext.captionField = titleText
 
	# cat=pmkslimbox//o7; type=options[imagetitletext,imagealttext,imagecaption]; label= tt_news Caption Field: tt_news field to use as caption inside the Lightbox.
	tt_news.captionField = imagetitletext
 
 
}


Viele Grüße,
Kai
ProfilICQ
Verfasst am: 20. 04. 2010 [10:37]
Nicklas
Dabei seit: 26.03.2004
Beiträge: 426
Hi zusammen!

Ist schon etwas älter das Thema, aber meine Frage passt eigentlich, deswegen versuche ich es mal hier:

Ich hab tt_products zusammen mit der pmkslimbox am laufen und es klappt auch alles. Für mich wäre es genial, wenn ich neben den Buttons "Speichern" und "Drucken" auch einen Button "Bestellen" haben könnte, der dann auf die Singleview des Produkts verweist wo man noch ein paar kleinigkeiten anpassen kann und dann in den warenkorb packen kann.

Glaubt ihr das ist möglich?

Viele Grüße

Nicklas
ProfilICQ