Wt gallery

Aus Wikizone
Wechseln zu: Navigation, Suche

Allgemein

Arbeitet standardmäßig mit mehreren Template Files (s.u.), müßte aber auch funktionieren wenn alles in einer Datei steht.

Basiert auf 3.3.1

Constants

plugin.wtgallery.main.path = fileadmin/bilder
plugin.wtgallery.list.rows = 5
plugin.wtgallery.list.columns = 4
plugin.wtgallery.list.limit = 80
plugin.wtgallery.category.rows = 3
plugin.wtgallery.category.columns = 3
plugin.wtgallery.category.previewpicture_order = newest
plugin.wtgallery.cooliris.title = BDP-Cooliris
plugin.wtgallery.single.pid_single = 82
plugin.wtgallery.single.width = 400
#plugin.wtgallery.single.height = 300

plugin.wtgallery.list.width = 100c
plugin.wtgallery.list.height = 100c
plugin.wtgallery.category.width = 126c
plugin.wtgallery.category.height = 100c
plugin.wtgallery.template.single = fileadmin/templates/wtgallery/single.html
plugin.wtgallery.template.list = fileadmin/templates/wtgallery/list.html
plugin.wtgallery.template.category = fileadmin/templates/wtgallery/category.html
plugin.wtgallery.cooliris.url = http://www.mydomain.org/
plugin.wtgallery.cooliris.width = 400
plugin.wtgallery.cooliris.height = 300
plugin.wtgallery.cooliris.limit = 100
plugin.wtgallery.cooliris.window_width = 460
plugin.wtgallery.cooliris.window_height = 400

Setup

plugin.tx_wtgallery_pi1.single.image.imageLinkWrap.bodyTag = <body style="background:#FFF;margin:0;padding:0;"> plugin.tx_wtgallery_pi1._LOCAL_LANG.de.wtgallery_ll_title_category = Kategorie plugin.tx_wtgallery_pi1._LOCAL_LANG.de.wtgallery_ll_startcategorylink = Zurück zur Übersicht

HTML-Template

category.html 

wt_gallery HTML Template for category view

--- Markers within loop ---
Imagetag (e.g. <img src="typo3temp/pic.jpg">):	###IMAGE###
Imagepath (e.g. typo3temp/pic.jpg):		###PICTURE###
Picture filename (e.g. pic.jpg):		###BASENAME###
Filename without extension (e.g. pic):		###FILENAME###
Extension(e.g.jpg):				###EXTENSION###
Relative path to this folder (e.g. fileadmin/folder/):###DIRNAME###
Timestamp of current picture:			###TSTAMP###
Name of folder:					###CURRENTFOLDER###
Text from txt files to any folder:		###TEXT###
Dynamic class (firstofrow, centerofrow, lastofrow):	###CLASS###
Subpart link to list view:			<!-- ###CATEGORYLINK### -->
	
--- Markers out of the loop ---
Insert category browser				###PAGEBROWSER###
    
GLOBAL MARKERS:
Displaying any value from pi1/locallang.xml:			###WTGALLERY_LL_YOURFIELD### (Could be filled via locallang.xml or typoscript - see manual for details)
Displaying any value from typoscript:					###WTGALLERY_TS_YOURFIELD### (Could be filled via typoscript - see manual for details)
	
		
<!-- ###WTGALLERY_CATEGORY### begin --> 
<div class="wtgallery_category_area">
   <!-- ###CONTENT### -->
      <!-- ###ITEM### -->
      <div class="wtgallery_categories ###CLASS###">
         <div class="wtgallery_category_pic">###IMAGE###</div>
            <!-- ###CATEGORYLINK### -->###TEXT###<!-- ###CATEGORYLINK### -->
         </div>
      <!-- ###ITEM### -->
   <!-- ###CONTENT### -->
   <div class="clear"></div>
	###PAGEBROWSER###
   </div>
<!-- ###WTGALLERY_CATEGORY### end -->

wt_directory HTML Template for category_browser view

	Current page - from X to...:							###CURRENT_MIN###
    Current page - to X pictures:							###CURRENT_MAX###
    Overall pictures on all pages: 							###OVERALL###
    Insert HMENU (define via TS):							###PAGELINKS###
    Insert link to start category (define via TS):			###STARTCATEGORYLINK###
    
	GLOBAL MARKERS:
	Displaying any value from pi1/locallang.xml:			###WTGALLERY_LL_YOURFIELD### (Could be filled via locallang.xml or typoscript - see manual for details)
	Displaying any value from typoscript:					###WTGALLERY_TS_YOURFIELD### (Could be filled via typoscript - see manual for details)

<!-- ###WTGALLERY_CATEGORY_PAGEBROWSER### begin --> 
	<div class="wtgallery_category_pagebrowser_area">   
        <p>###CURRENT_MIN### ###WTGALLERY_LL_PAGEBROWSER_UPTO### ###CURRENT_MAX### ###WTGALLERY_LL_PAGEBROWSER_WITHIN### ###OVERALL###</p>
        <p>###PAGELINKS###</p>
        ###STARTCATEGORYLINK###
	</div>
<!-- ###WTGALLERY_CATEGORY_PAGEBROWSER### end -->

cooliris.html 

wt_gallery HTML Template for cooliris rss

	--- Markers within loop ---
	Picture resource (like typo3temp/picture.jpg)			###IMAGE###
	Picture filename (e.g. pic.jpg):						###BASENAME###
    Filename without extension (e.g. pic):					###FILENAME###
    Extension (e.g. jpg):									###EXTENSION###
    Relative path to this folder (e.g. fileadmin/folder/):	###DIRNAME###
    Timestamp of current picture:							###TSTAMP###
	Name of folder:											###CURRENTFOLDER###
    
    --- Markers out of loop ---
    ###TITLE###
    ###URL###
    ###DESCRIPTION###
    

	GLOBAL MARKERS:
	Displaying any value from pi1/locallang.xml:			###WTGALLERY_LL_YOURFIELD### (Could be filled via locallang.xml or typoscript - see manual for details)
	Displaying any value from typoscript:					###WTGALLERY_TS_YOURFIELD### (Could be filled via typoscript - see manual for details)
    
    
<!-- ###WTGALLERY_COOLIRIS_RSS### begin --> 
    <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
    <rss version="2.0" xmlns:media="http://search.yahoo.com/mrss" xmlns:atom="http://www.w3.org/2005/Atom">
        <channel>
                <title>wt_gallery</title>
                <link>http://testumgebung.einpraegsam.net/</link>
                <description>Description</description>
                
                <!-- ###CONTENT### --><!-- ###ITEM### -->
                    <item>
						<title>###FILENAME###</title>
            			<link>###IMAGE###</link>
                        <guid>###FILENAME###</guid>
                        <media:thumbnail url="###IMAGE###" />
                        <media:content url="###IMAGE###" type="image/jpeg" />
                    </item>
                <!-- ###ITEM### --><!-- ###CONTENT### -->
        
        </channel>
    </rss>
<!-- ###WTGALLERY_COOLIRIS_RSS### end -->

list.html 

wt_gallery HTML Template for list view

	--- Markers within loop ---
	Imagetag (e.g. <img src="typo3temp/pic.jpg">):			###IMAGE###
	Imagepath (e.g. typo3temp/pic.jpg):						###PICTURE###
	Picture filename (e.g. pic.jpg):						###BASENAME###
    Filename without extension (e.g. pic):					###FILENAME###
    Extension (e.g. jpg):									###EXTENSION###
    Relative path to this folder (e.g. fileadmin/folder/):	###DIRNAME###
    Timestamp of current picture:							###TSTAMP###
	Name of folder:											###CURRENTFOLDER###
    Image text (from EXIF or txt file):						###TEXT###
    Dynamic class (firstofrow, centerofrow, lastofrow):		###CLASS###
    Subpart for Single view link:							<!-- ###SINGLELINK### -->Image<!-- ###SINGLELINK### -->
    
    --- Markers out of the loop ---
    Inserts pagebrowser to Marker							###PAGEBROWSER###
    

	GLOBAL MARKERS:
	Displaying any value from pi1/locallang.xml:			###WTGALLERY_LL_YOURFIELD### (Could be filled via locallang.xml or typoscript - see manual for details)
	Displaying any value from typoscript:					###WTGALLERY_TS_YOURFIELD### (Could be filled via typoscript - see manual for details)
	
	
	
<!-- ###WTGALLERY_LIST### begin --> 
    <div class="wtgallery_list_area">
        <!-- ###CONTENT### --><!-- ###ITEM### -->
            <div class="wtgallery_list ###CLASS###">
                ###IMAGE###
            </div>
        <!-- ###ITEM### --><!-- ###CONTENT### -->
        <div class="clear"></div>
        ###PAGEBROWSER###
    </div>
<!-- ###WTGALLERY_LIST### end -->





wt_gallery HTML Template for pagebrowser in listview

	Current page - from X to...:						###CURRENT_MIN###
    Current page - to X pictures:						###CURRENT_MAX###
    Overall pictures on all pages: 						###OVERALL###
    Insert HMENU:										###PAGELINKS###

	GLOBAL MARKERS:
	Displaying any value from pi1/locallang.xml:		###WTGALLERY_LL_YOURFIELD### (Could be filled via locallang.xml or typoscript - see manual for details)
	Displaying any value from typoscript:				###WTGALLERY_TS_YOURFIELD### (Could be filled via typoscript - see manual for details)
	
	
	
<!-- ###WTGALLERY_LIST_PAGEBROWSER### begin --> 
    <div class="wtgallery_list_pagebrowser_area">
        <p>###CURRENT_MIN### ###WTGALLERY_LL_PAGEBROWSER_UPTO### ###CURRENT_MAX### ###WTGALLERY_LL_PAGEBROWSER_WITHIN### ###OVERALL###</p>
        <p>###PAGELINKS###</p>
    </div>
<!-- ###WTGALLERY_LIST_PAGEBROWSER### end -->

single.html 

wt_directory HTML Template for single view

	Imagetag (e.g. <img src="typo3temp/pic.jpg">):		###IMAGE###
    Image text (from EXIF or txt file):					###TEXT###
    Picture (e.g. fileadmin/pics/pic.jpg):				###PICTURE###
    Filename (e.g. pic):								###FILENAME###
    Dirname (e.g. fileadmin/pics):						###DIRNAME###
    Basename (e.g. pic.jpg):							###BASENAME###
    Extension (e.g. jpg):								###EXTENSION###
    Timestamp of changedate:							###TSTAMP###
    Insert link to listview (define via TS):			###LISTVIEWLINK###
    Subpart for next link:								<!-- ###NEXT### -->Next<!-- ###NEXT### -->
    Subpart for previous link:							<!-- ###PREVIOUS### -->Previous<!-- ###PREVIOUS### -->
    

	GLOBAL MARKERS:
	Displaying any value from pi1/locallang.xml:		###WTGALLERY_LL_YOURFIELD### (Could be filled via locallang.xml or typoscript - see manual for details)
	Displaying any value from typoscript:				###WTGALLERY_TS_YOURFIELD### (Could be filled via typoscript - see manual for details)



<!-- ###WTGALLERY_SINGLE### begin -->
	<div class="wtgallery wtgallery_single wt_gallery_single_###FILENAME###">
		<!--<h2 class="wtgallery_single">###WTGALLERY_LL_TITLE_SINGLE###</h2>-->
        ###IMAGE###
        <div class="wtgallery_single_browser">
        	<div class="wtgallery_single_browser_previous">
            	<!-- ###PREVIOUS### -->###WTGALLERY_LL_PREVIOUS###<!-- ###PREVIOUS### -->
            </div>
            <div class="wtgallery_single_browser_next">
            	<!-- ###NEXT### -->###WTGALLERY_LL_NEXT###<!-- ###NEXT### -->
            </div>
        </div>
        ###TEXT###
        ###LISTVIEWLINK###
    </div>
<!-- ###WTGALLERY_SINGLE### end -->

CSS

Zusätzliches CSS für wt_gallery (rest kommt aus der Extension wt_gallery.css 

/*gallery*/
div.tx-wtgallery-pi1 {
	padding: 0px;
	background-color: #FFF;
margin: 0 0 1em 0;
}

div.tx-wtgallery-pi1 ul{
padding: 0 0 0 0px !important;
margin: 0;
}
div.tx-wtgallery-pi1 li{
display: inline;
padding-right:0.5em;
margin: 0;
}
div.tx-wtgallery-pi1 p{
margin:0;
padding: 0 0 0 0px;}

div.tx-wtgallery-pi1 a{
margin: 0;
padding: 0;
}
/*categories*/
div.wtgallery_categories{
background: #cae5b7;
border: 1px solid #6fa24a;
text-align:center;
margin: 0 5px 10px 5px;
padding: 0;
width: 150px;
height: 155px;
}

div.wtgallery_category_pic{
padding:8px 0 2px 0;
}
div.wtgallery_category_pic img{
border: 1px solid #6fa24a !important;
}
div.wtgallery_category_folder,
div.wt_gallery_category_inner_text{
font-size: 11px;
}

div.wt_gallery_category_inner_text{
margin: 0 4px;
}

/*list*/
div.wtgallery_list {
	padding: 1px;
	margin: 7px;
	background-color: #FFF;
}
div.wtgallery_list_area{
/*background: pink;*/
}

div.wtgallery_list_area .list_row{
padding-left:9px;
}

div.wtgallery_list a img {
	padding: 1px;
/*	filter: alpha(opacity=66);
	-moz-opacity: 0.66;
	opacity: 0.66;*/
	border: 1px solid #6fa24a !important;
}
div.wtgallery_list_current a img {
	border: 1px solid #6fa24a !important;
}
div.wtgallery_list a:hover img {
/*	filter: alpha(opacity=100);
	-moz-opacity: 1.00;
	opacity: 1.00;*/
        background: #cae5b7;
}

/*single*/
div.wt_gallery_single_inner_pic {
	margin: 10px;
	padding: 1px;
}
div.wt_gallery_single_inner_pic a img {
	border: 1px solid #6fa24a !important;
}

div.wtgallery_single{
width: 496px;
margin: 0 0 0 12px;
}
div.wtgallery_single img{
padding: 1px;
}

div.wt_gallery_single_inner_title {
	font-weight: bold;
	margin-top: 5px;
}
div.wt_gallery_single_inner_comments {

}
div.wtgallery_single_browser{
text-align: center;
margin: auto;
}
div.wtgallery_single_browser_previous{
display: inline;
margin: 0 0.5em;
}
div.wtgallery_single_browser_next{
display: inline;
margin: 0 0.5em;
}


Singleansicht mit Perfect Light Box

Folgender Schnipsel eignet sich um eine Listenseite mit Imagelightbox anzuschauen: 

# WT Gallery PerfectLightbox für Listenansicht
plugin.tx_wtgallery_pi1 {
  list {
    image = IMAGE
    image {
      imageLinkWrap.typolink {
        parameter.cObject = IMG_RESOURCE
        parameter.cObject.file.import.field = picture
        parameter.cObject.file.maxW = 600
        parameter.cObject.file.maxH = 600
        ATagParams = rel="lightbox[galerie]"
      }
    }

Natürlich muß die Lightbox installiert sein für das Beispiel hier wurde perfectlightbox benutzt.

Abgerufen von „https://wiki.stephanschlegel.de/index.php?title=Wt_gallery&oldid=18779“