.. You may want to use the usual include line. Uncomment and adjust the path. .. include:: ../Includes.txt ========================= EXT: Photogallery express ========================= :Author: Kasper Skårhøj :Created: 2002-11-01T00:32:00 :Changed: 2007-04-17T11:55:59 :Author: Patrick Kapar :Email: info@patie.nl :Info 3: :Info 4: .. _EXT-DAM-photo-gallery: EXT : DAM photo gallery ======================= Extension Key: **eco\_gal** Copyright 2006, Fabien Udriot, 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.com .. _Table-of-Contents: Table of Contents ----------------- **EXT : DAM photo gallery 1** **Introduction 1** What does it do? 1 **Screenshots 2** 1) The image player : 2 2) the galleries with cross fade transition 2 3) player is displayed with transparency 2 **User manual 3** **Administration 3** Step 1 : installation 3 Step 2 : create images selections in the DAM 4 Step 3 : frontend display 5 **Known problems 6** **To-Do list 7** **Changelog 7** .. _Introduction: Introduction ------------ .. _What-does-it-do: What does it do? ^^^^^^^^^^^^^^^^ This is a simple and fast Image gallery that uses Ajax technology with DAM integration. One image is better than a thousand words... see a demonstration of this gallery in the real world : `http://essayeca.ch/fr/galerie.html `_ Terms of references for this gallery are : - make this gallery simple to use and maintain in the backend (add new pictures – image automatically resized etc...) - make this gallery nice and easy to use for the enduser in the frontend .. _Screenshots: Screenshots ----------- .. _1-The-image-player: 1) The image player : ^^^^^^^^^^^^^^^^^^^^^ |img-1| .. _2-the-galleries-with-cross-fade-transition: 2) the galleries with cross fade transition ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ |img-2| .. _3-player-is-displayed-with-transparency: 3) player is displayed with transparency ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ |img-3| .. _User-manual: User manual ----------- This extension is quite intuitive to use (at least it should be...). If you encounter any problems on the frontend, just let me know by email. There are two possible layouts : DAM gallery : the user sees the gallery (little thumbnails with transition). Then he clicks on a picture and the gets the image player. DAM player : the user access the pictures wright away. .. _Administration: Administration -------------- This little step by step tutorial assumes that you have a certain knowledge in typo3 administration. You should be familiar with terms like content element, sysfolder, backend, frontend, etc... If this is not the case, please, read the typo3 documentation first. .. _Step-1-installation: Step 1 : installation ^^^^^^^^^^^^^^^^^^^^^ This extension has dependencies. You should install the following things on your server : - `jquery `_ - `xtemplate `_ - `dam `_ :If you have no idea what is this extension, please read some documentation at `http://typo3lab.colorcube.de/dam.html `_ . Be careful ! DAM will change the way you manage your files in the backend. This new module will bring a lot of new (and great) features in the backend, but are not quite finished... So you may encounter bugs. **IMPORTANT !** If you install the DAM for the first time on a running Typo3 Site, I encourage you to read `this page `_ on the wiki. Feel free to complete the infos...) - php 5 or greater (will not work on php 4) .. _Step-2-create-images-selections-in-the-DAM: Step 2 : create images selections in the DAM ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ **Important to understand !** The DAM extension allows you to make selections in your medias library. In other words you are able to select medias according different criterias and save those selections for later use. The stored selections are used in eco\_gal to generate the albums. This is a very flexible to build a set of images. This set is going to feed albums in the image gallery. Follow the screenshots : |img-4| |img-5| You retrieve the selections in the module Web > list > Media |img-6| .. _Step-3-frontend-display: Step 3 : frontend display ^^^^^^^^^^^^^^^^^^^^^^^^^ Now it's time to handle the frontend display for the end user... You should create a new content element on a page of your website. In module Web > List > on the top of a page, you will have a "new content" icon : |img-7| Select as follow "Click here for wizard !" : |img-8| You get a list with different content elements. Probably at the end of the list, you will find DAM Gallery and DAM Player. |img-9| What is the difference between DAM gallery and DAM player ? With DAM player, the gallery is displayed directly in a player. (more direct). With DAM gallery, the gallery are display as little sideshow on a page. The best way is to try them to understand... |img-10| Define the albums, you wish to see on the frontend. If you have chosen DAM gallery, you can set a few preferences. I think the options are enough clear... |img-11| For the player now : |img-12| .. _Known-problems: Known problems -------------- Post in the feed-back section on typo3.org/extensions/ ... .. _To-Do-list: To-Do list ---------- Post in the feed-back section on typo3.org/extensions/ ... - Add other languages support... (language supported : English – French) - Add a end picture at the end of the gallery. - Make the arrow a bit nicer .. _Changelog: Changelog --------- - 0.1: first release - 0.2 : Add some features (gallery width configurable, multilanguage better support) - 07 : main release : DAM extension support – new ajax coding with jquery. |img-13| EXT: Photogallery express - 7 .. ######CUTTER_MARK_IMAGES###### .. |img-1| image:: img-1.png .. :align: left .. :border: 0 .. :height: 507 .. :id: graphics1 .. :name: graphics1 .. :width: 530 .. |img-2| image:: img-2.png .. :align: left .. :border: 0 .. :height: 125 .. :id: graphics2 .. :name: graphics2 .. :width: 543 .. |img-3| image:: img-3.jpeg .. :align: left .. :border: 0 .. :height: 484 .. :id: graphics11 .. :name: graphics11 .. :width: 620 .. |img-4| image:: img-4.png .. :align: left .. :border: 0 .. :height: 480 .. :id: graphics3 .. :name: graphics3 .. :width: 669 .. |img-5| image:: img-5.png .. :align: left .. :border: 0 .. :height: 295 .. :id: graphics4 .. :name: graphics4 .. :width: 347 .. |img-6| image:: img-6.png .. :align: left .. :border: 0 .. :height: 108 .. :id: graphics5 .. :name: graphics5 .. :width: 525 .. |img-7| image:: img-7.png .. :align: left .. :border: 0 .. :height: 100 .. :id: graphics6 .. :name: graphics6 .. :width: 358 .. |img-8| image:: img-8.png .. :align: left .. :border: 0 .. :height: 134 .. :id: graphics7 .. :name: graphics7 .. :width: 208 .. |img-9| image:: img-9.png .. :align: left .. :border: 0 .. :height: 73 .. :id: graphics8 .. :name: graphics8 .. :width: 474 .. |img-10| image:: img-10.png .. :align: left .. :border: 0 .. :height: 255 .. :id: graphics12 .. :name: graphics12 .. :width: 373 .. |img-11| image:: img-11.png .. :align: left .. :border: 0 .. :height: 196 .. :id: graphics9 .. :name: graphics9 .. :width: 312 .. |img-12| image:: img-12.png .. :align: left .. :border: 0 .. :height: 264 .. :id: graphics10 .. :name: graphics10 .. :width: 356 .. |img-13| image:: img-13.png .. :align: left .. :border: 0 .. :height: 32 .. :id: Graphic1 .. :name: Graphic1 .. :width: 102