fluid for designers
DESCRIPTION
In this talk, we're explaining the benefits of Fluid for designers. The shown personas are models and have nothing to do with the depicted work context.TRANSCRIPT
Inspiring people toshareFluid for Designers
Fluid for DesignersBerit Jensen <[email protected]>
Bastian Waidelich <[email protected]>Sebastian Kurfürst <[email protected]>
Inspiring people toshareFluid for Designers
What is a Template Engine?
DataDataData Template
Template Engine
DataDataRendered Data
Inspiring people toshareFluid for Designers
Marker vs. Fluid
Inspiring people toshareFluid for Designers
News: Display category title
{article.category.title}
###NEWS_CATEGORY###
Inspiring people toshareFluid for Designers
News: Display category title
{article.category.title}
###NEWS_CATEGORY###
###CATWRAP_B###
###TEXT_CAT_LATEST###
###CATWRAP_E###
Inspiring people toshareFluid for Designers
News: Display category title
###NEWS_CATEGORY###
###CATWRAP_B###
###TEXT_CAT_LATEST###
###CATWRAP_E###
<p><f:translate key=“categoryLabel“ /> {article.category.title}</p>
Inspiring people toshareFluid for Designers
Inspiring people toshareFluid for Designers
News: Display list
###TEMPLATE_LATEST###
###TEMPLATE_LIST###
###TEMPLATE_LIST2###
Inspiring people toshareFluid for Designers
News: Display list
<f:for each="{articles}" as="article" iteration="iteration"><h2>{article.title}</h2><f:if condition="{iteration.cycle} == 1">
<f:image src="{article.image}" maxWidth="500" /></f:if>
</f:for>
Inspiring people toshareFluid for Designers
Inspiring people toshareFluid for Designers
What markers are available?
NEWS_UID - ID number (uid) of the news itemNEWS_TITLE - News item title
NEWS_AUTHOR - name of authorNEWS_EMAIL - email of author
NEWS_DATE - dateNEWS_TIME - time
NEWS_AGE - age of news item in minutes, hours, days or yearsNEWS_SUBHEADER - subheader, if empty main content is inserted here in LIST and LATEST
NEWS_CONTENT - main contentNEWS_LINKS - news links
NEWS_CATEGORY - news item categoryNEWS_CATEGORY_IMAGE - news item category image
NEWS_RELATED - links to related newsNEWS_IMAGE - news item images
NEWS_CATEGORY_ROOTLINE - category rootline
PAGE_UID - Page id of the parent page (pid)PAGE_TITLE - Title of the parent page of the news item
PAGE_AUTHOR - Page author, if anyPAGE_AUTHOR_EMAIL - Page author email, if any
<em>News Language Markers (see pi/locallang.php):</em>LATEST_HEADER - header for the LATEST element
GOTOARCHIVE - link to archive page in latest templateARCHIVE_HEADER - same for AMENU
MORE - more ;-)TEXT_CAT - text output before categories and category images in LIST view (eg: 'categories:')
TEXT_CAT_LATEST - the same in a shorter form for the LATEST element (eg: 'cat:')BACK_TO_LIST - link back to list-view in single-view template
ARCHIVE_EMPTY_MSG - no items in archiveSEARCH_EMPTY_MSG - message for empty search results
TEXT_NEWS_AGE - text inserted before the age of the news item
!?!?
The shown personas are models and have nothing to do with the depicted work context.
Inspiring people toshareFluid for Designers
... three weeks later ...
Inspiring people toshareFluid for Designers
A Marker is missing!
Wait a second, I'll create something.
The shown personas are models and have nothing to do with the depicted work context.
Inspiring people toshareFluid for Designers
http://center.gordonswine.com /stuff/contentmgr/files/fce82a1b415a4b47138a8b5e58b74dc2/images/33_smoking_cosmos_on_the_bar.jpg
Inspiring people toshareFluid for Designers
I need this marker...
Wait, it's a lot easier now!
:-)
Articletitledatecontentimagecategory
Categorytitleimage
The shown personas are models and have nothing to do with the depicted work context.
UML is scary!
Inspiring people toshareFluid for Designers
Articletitledatecontentimagecategory
Categorytitleimage
{article.title}
{article.category.title}
UML is not scary!
Sneak Preview
Inspiring people toshareFluid for Designers
Inspiring people toshareFluid for Designers
?????????????
inspiring people to share.