DEPRECATION WARNING
This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.
EXT: Kiwi Slider¶
Author: | Paul Lunow |
---|---|
Created: | 2002-11-01T00:32:00 |
Changed by: | Matthias Haack |
Changed: | 2008-09-04T22:04:39 |
Classification: | kiwi_slider |
Description: | The keywords help with categorizing and tagging of the manuals. You can combine two or more keywords and add additional keywords yourself. Please use at least one keyword from both lists. If your manual is NOT in english, see next tab "language" ---- forEditors (use this for editors / german "Redakteure") forAdmins (use this for Administrators) forDevelopers (use this for Developers) forBeginners (manuals covering TYPO3 basics) forIntermediates (manuals going into more depth) forAdvanced (covering the most advanced TYPO3 topics) see more: http://wiki.typo3.org/doc_template#tags ---- |
Keywords: | jquery, slider, coda |
Email: | paul@kiwi-service.de |
Info 1: | |
Info 2: | |
Info 3: | |
Info 4: | |
empty: | |
language (EN, DE, FR, NL, DK, ES, DK, ... ): | |
EN |
EXT: Kiwi Slider - kiwi_slider
EXT: Kiwi Slider¶
extensionkey: kiwi_slider
keywords: jquery, slider, coda
language: EN
Copyright 2000-2008, , <paul@kiwi-service.de>
This document is published under the Open Content License
available from http://www.opencontent.org/opl.shtml
The content of this document is related to TYPO3
- a GNU/GPL CMS/Framework available from www.typo3.org
Table of Contents¶
EXT: Kiwi Slider 1
1 Introduction 3
1.1. What does it do? 3
1.2. Screenshots 3
2 Users manual 4
2.1. Installation 4
2.2. Create record 4
2.3. FAQ 4
3 Administration 5
3.1. FAQ 5
4 Configuration 6
4.1. FAQ 6
4.2. Reference 6
5 Known problems 7
6 To-Do list 8
7 ChangeLog 9
Introduction¶
What does it do?¶
The extension creates a coda slider using the jQuery JavaScript library. Inspired by http://jqueryfordesigners.com/demo/coda- slider.html
jQuery for Designers is a phantasic project by Remy Sharp .
Features:
Shows the content of any page
Allows selection of variable number of pages
Customization of layout by CSS and TypoScript
Screenshots¶
Default design of the slider
Pages and content
Backend view of the plugin
Users manual¶
WARNING !! The extension by default contains the jQuery library and the other JavaScript files that are vital for the functionality of the Slider. Therefore make sure that the jQuery library ore one of the other files have not yet been included in your TYPO3 project .
The included files are the followings (see: http://jqueryfordesigners.com/coda-slider-effect/ ):
scrollTo (jquery.scrollTo-1.3.3.js)
localScroll (localscroll-1.2.6.js)
serialScroll (serialScroll-1.2.1.js)
If you have for any reason already included one or more of theses files in your TYPO3 project, please deactivate the inclusion of this or these files (see chapter 4).
The JavaScript file, that initializes the slider effect ( codaslider.js) , is integrated in class.tx_kiwislider_pi1.php. If - for any reason - you want to use your own file, you can set the path to this file by TypoScript (see chapter 4).
Installation¶
- Install the extension with the extension manager.
- Update database.
Create record¶
- Create new record “General Plugin”.
- Under “Plugin” choose “Kiwi Slider”.
- Select the pages the content of which is to been shown. The plugin shows the page title as navigation title in the slider. Each element to be shown in the slider has to be created as one page (see chapter 1.2, screen 2). One or more of the records of this page are shown in the slider (see chapter 4).
FAQ¶
- Q.: I followed the instruction, but the slider does not work.
- A.: Make sure that jQuery library is not been included before (see WARNING above).
Configuration¶
- Width and height of the slider can be set by TypoScript. By default the size is defined by CSS .
- You can set the number of records of the chosen pages that are shown in the slider.
The speed of the slider effect can be set by TypoScript.
You can deactivate the inclusion of any of the 5 vital JavaScript files (This can be necessary if you have already included one or more files in your TYPO3 installation. See chapter 2).
- CSS rules are set by Typoscript (_CSS_DEFAULT_STYLE). In order to customize the layout of your slider, copy the CSS rules in your fileadmin folder and empty the default styles via TypoScript . Be careful in modifying the rules as some CSS rules are vital for the functionality of the slider.
- The left and right arrow can be modified by TypoScript. You can set the path to your own graphics. You can also hide the arrows.
FAQ¶
- Q.: I set the width of the slider, but nothing happened.
- A.: You have to set both, width and height in order to make it work.
Reference¶
plugin.tx_kiwislider_pi1
width¶
Property
width
Data type
int
Description
Set the width of the slider.
Example:
plugin.tx_kiwislider_pi1.width = 400
Default
not set
height¶
Property
height
Data type
int
Description
Set the height of the slider.
Example:
plugin.tx_kiwislider_pi1.height = 250
Default
not set
showRecords¶
Property
showRecords
Data type
int
Description
Set the number of page records to show in the slider.
If not set, the slider shows all.
Default
not set
duration¶
Property
duration
Data type
int
Description
Speed of the slider effect
Default
500
include.jQuery¶
Property
include.jQuery
Data type
boolean
Description
Includes the jQuery library
Example (to exclude jQuery):
plugin.tx_kiwislider_pi1.include.jQuery = 0
or:
plugin.tx_kiwislider_pi1.include.jQuery >
Default
1
include.scrollTo¶
Property
include.scrollTo
Data type
boolean
Description
Includes the scrollTo plugin
Default
1
Include.localScroll¶
Property
Include.localScroll
Data type
boolean
Description
Includes the localScroll plugin
Default
1
include.serialScroll¶
Property
include.serialScroll
Data type
boolean
Description
Includes the serialScroll plugin
Default
1
pathToCodasliderjs¶
Property
pathToCodasliderjs
Data type
resource
Description
The path to your own codaslider.js file in order to make any changes there.
Example:
plugin.tx_kiwislider_pi1.pathToCodasliderjs = fileadmin/js/codaslider.js
Default
_CSS_DEFAULT_STYLE¶
Property
_CSS_DEFAULT_STYLE
Data type
string
Description
CSS rules.
In order to use your own style empty the default styles:
_CSS_DEFAULT_STYLE >
Default
arrows.left¶
Property
arrows.left
Data type
resource
Description
Path to the file of the left arrow
Default
EXT:kiwi_slider/pi1/res/scroll_left.png
arrows.right¶
Property
arrows.right
Data type
resource
Description
Path to the file of the right arrow
Default
EXT:kiwi_slider/pi1/res/scroll_right.png
arrows.hide¶
Property
arrows.hide
Data type
boolean
Description
To hide the arrows:
Example:
plugin.tx_kiwislider_pi1.arrows.hide = 1
Default
not set
Known problems¶
None so far.
To-Do list¶
ChangeLog¶
- Version 1.1.0 More configuration via typoscript, nicer integration of JavaScriptfiles
- Version 1.0.1 some very small bugfixes
- Version 1.0.0 initial version
For more informations visit
http://www.interaktionsdesigner.de/2008/08/16/typo3-extension-kiwi- slider/ (de)
9