TemplaVoila

From TYPO3Wiki

Jump to: navigation, search
TemplaVoila (TV)
Translations info
An english page for every translation.
All pagenames in english.

  en       de   nl   fr  

<< Back to Extension manuals page

[edit]

This helping-page for TV is important, updated frequently by several people, so it's a HOT topic.

Contents

[edit] Error in output when using TS script in TV

--Tkw 7/11-2004


The DS structure is encoded in XML and must comply to XML rules. TypoScript (TS) is not XML therefore it is possible to make TS that invalidates the XML structure and generates XML errors in the output.

TemplaVoila ERROR: Couldn't find a Data Structure set for table/row "pages:15". Please select a Data Structure and Template Object first.

To get arround this problem use this construction in DS

<TypoScript><![CDATA[
...original typoscript...
]]></TypoScript>

The CDATA tag instructs the XML parser to consider the TypoScript as plain text.

Sometimes you won`t even get error messages. The following example just will be ignored:

<TypoScript>
10 = COA
10 {
  10 = TEXT
  10 {
    current = 1
    typolink.parameter.field = field_link_bigheadline
    required = 1
    wrap = <h3>|</h3>
  }
}
</TypoScript> 

Because the slash in </h3> will confuse the xml parser. So basically it`s a good idea to always use cdata around your TemplaVoila TypoScript sections:

<TypoScript><![CDATA[
10 = COA
10 {
  10 = TEXT
  10 {
    current = 1
    typolink.parameter.field = field_link_bigheadline
    required = 1
    wrap = <h3>|</h3>
  }
}]]>
</TypoScript> 

--sacha 12:57, 11 Nov 2004 (CET)

[edit] Adding alt and title tags to images and allow image linking and scaling via width - height fields

This can be easily achieved because you can access all fields defined in the DS with TypoScript. If you replace the image definition inside the DS after mapping an image field with the following code, you will be able to add a titletext, alttext, an image link and values for image-width and height and the image will be rendered accordingly.

            <field_image type="array">
                <tx_templavoila type="array">
                    <title>miniteaser image</title>
                    <sample_data type="array">
                        <numIndex index="0"></numIndex>
                    </sample_data>
                    <eType>image</eType>
                    <TypoScript><![CDATA[
                      10 = IMAGE
                      10.altText.field = field_alttext
                      10.titleText.field = field_titletext
                      10.file.import = uploads/tx_templavoila/
                      10.file.import.current = 1
                      10.file.import.listNum = 0
                      10.file.width.field = field_imagewidth
                      10.file.height.field = field_imageheight
                      10.stdWrap.typolink.parameter.field = field_link]]>
	            </TypoScript>
                </tx_templavoila>
                <TCEforms type="array">
                    <config type="array">
                        <type>group</type>
                        <internal_type>file</internal_type>
                        <allowed>gif,png,jpg,jpeg</allowed>
                        <max_size>1000</max_size>
                        <uploadfolder>uploads/tx_templavoila</uploadfolder>
                        <show_thumbs>1</show_thumbs>
                        <size>1</size>
                        <maxitems>1</maxitems>
                        <minitems>0</minitems>
                    </config>
                    <label>miniteaser image</label>
                </TCEforms>
            </field_image>

            <field_alttext type="array">
                <tx_templavoila type="array">
                    <title>alt</title>
                    <sample_data type="array">
                        <numIndex index="0"></numIndex>
                    </sample_data>
                    <eType>input</eType>
                    <proc type="array">
                        <HSC type="integer">1</HSC>
                    </proc>
                </tx_templavoila>
                <TCEforms type="array">
                    <config type="array">
                        <type>input</type>
                        <size>20</size>
                        <checkbox>0</checkbox>
                        <default>0</default>
                    </config>
                    <label>Alternativ Text</label>
                </TCEforms>
            </field_alttext>
            
            <field_titletext type="array">
                <tx_templavoila type="array">
                    <title>title</title>
                    <sample_data type="array">
                        <numIndex index="0"></numIndex>
                    </sample_data>
                    <eType>input</eType>
                    <proc type="array">
                        <HSC type="integer">1</HSC>
                    </proc>
                </tx_templavoila>
                <TCEforms type="array">
                    <config type="array">
                        <type>input</type>
                        <size>20</size>
                        <checkbox>0</checkbox>
                        <default>0</default>
                    </config>
                    <label>Titel Text</label>
                </TCEforms>
            </field_titletext>

            <field_link type="array">
                <type>attr</type>
                <tx_templavoila type="array">
                    <title>linktext</title>
                    <sample_data type="array">
                        <numIndex index="0"></numIndex>
                    </sample_data>
                    <eType>link</eType>
                    <TypoScript><![CDATA[
                      10 = TEXT
                      10.typolink.typolink.parameter.field = field_link]]>
                    </TypoScript>
                    <proc type="array">
                        <HSC type="integer">1</HSC>
                    </proc>
                </tx_templavoila>
                <TCEforms type="array">
                    <config type="array">
                        <type>input</type>
                        <size>15</size>
                        <max>256</max>
                        <checkbox></checkbox>
                        <eval>trim</eval>
                        <wizards type="array">
                            <_PADDING type="integer">2</_PADDING>
                            <link type="array">
                                <type>popup</type>
                                <title>Link</title>
                                <icon>link_popup.gif</icon>
                                <script>browse_links.php?mode=wizard</script>
                                <JSopenParams>height=300,width=500,status=0,menubar=0,scrollbars=1</JSopenParams>
                            </link>
                        </wizards>
                    </config>
                    <label>image link</label>
                </TCEforms>
            </field_link>
            <field_imageheight type="array">
                <tx_templavoila type="array">
                    <title>height</title>
                    <sample_data type="array">
                        <numIndex index="0"></numIndex>
                    </sample_data>
                    <eType>input</eType>
                    <proc type="array">
                        <HSC type="integer">1</HSC>
                    </proc>
                </tx_templavoila>
                <TCEforms type="array">
                    <config type="array">
                        <type>input</type>
                        <size>4</size>
                        <eval>int</eval>
                        <checkbox>0</checkbox>
                        <range type="array">
                          <upper>400</upper>
                          <lower>0</lower>
                        </range>
                        <default>0</default>
                    </config>
                    <label>height</label>
                </TCEforms>
            </field_imageheight>
            <field_imagewidth type="array">
                <tx_templavoila type="array">
                    <title>width</title>
                    <sample_data type="array">
                        <numIndex index="0"></numIndex>
                    </sample_data>
                    <eType>input</eType>
                    <proc type="array">
                        <HSC type="integer">1</HSC>
                    </proc>
                </tx_templavoila>
                <TCEforms type="array">
                    <config type="array">
                        <type>input</type>
                        <size>4</size>
                        <eval>int</eval>
                        <checkbox>0</checkbox>
                        <range type="array">
                          <upper>300</upper>
                          <lower>0</lower>
                        </range>
                        <default>0</default>
                    </config>
                    <label>width</label>
                </TCEforms>
            </field_imagewidth>

--sacha 13:47, 4 Nov 2004 (CET)

[edit] Using Gifbuilder with other TV fields as parameters

--Tkw 23:53, 15 Oct 2004 (CEST)

The following example works for me (is tested) it shows how to use gifbuilder inside an TV image element with two plain input elements and a link element as parameters. create the following TV fields

field_img1_title
  maping type=[not mapped]
  editing type=Plain input field
 field_img1_subtitle
  maping type=[not mapped]
  editing type=Plain input field
 
 field_img1_link
  maping type=[not mapped]
  editing type=link field
 field_img1_image
   maping type=element
   editing type=image field
   map it to the HTML template

After creating the fields above save the TV template. Edit the DS and goto the field_img1_image <typoscript> tag and replace the contents with the code snippet below.

Things to notify:

It is only the image element that is mapped in the HTML template. The other elements are used in gifbuilder as parameters.

Because of the scope the TV fields are not visible inside the gifbuilder, because stdwrap does not have any knowledge about TV.

remember the <!CDATA ... stuf, or the xml is not valid, it is the "<" that is the problem.


 <TypoScript><![CDATA[
 #getting the value of a TV field.
 temp.imgtitle=TEXT
 temp.imgtitle.field=field_img1_title
 
 #getting the value of a TV field.
 temp.imgsubtitle=TEXT
 temp.imgsubtitle.field=field_img1_subtitle
 
 20 = IMAGE
 #make the link clickable
 20.stdWrap.typolink.parameter.field = field_img1_link
 
 20.file = GIFBUILDER
 20.file {
   XY = 184,121
 
   10 = IMAGE
   10.file.import= uploads/tx_templavoila/
   10.file.import.current = 1
   10.file.import.listNum=0
   10.file.width= 184
   10.offset=10,10
 
   20 = TEXT
   #transfer the values of the TV field
   20.text < temp.imgtitle
   20.offset = 10,100
   20.niceText = 1
   20.align=left
   20.fontSize= 14
   20.fontFile = t3lib/fonts/verdana.ttf
   20.fontColor = black
 
   30 = TEXT
   #transfer the values of the TV field
   30.text < temp.imgsubtitle
   30.offset = 10,115
   30.niceText = 1
   30.align=left
   30.fontSize= 10
   30.fontFile = t3lib/fonts/verdana.ttf
   30.fontColor = black
 }
 ]]>
 </TypoScript>
Here is the resulting image generated by the script about


[edit] FrontEnd Admin Panel with Templavoila

--Joerg Delker 19:54, 15 Aug 2005 (CET)

To enable the Admin Panel in Templavoila Webs use the following TS in your admin's TSconfig:

admPanel {
  hide = 0
  options.overridePageModule = web_txtemplavoilaM1
}

[edit] Information from the mailing list archives

Here are a few things taken from the mailing list archives... k-fish

[edit] Is templavoila stable, ready for use in a production environment?

Whether you can use TV for content items at the moment will have to depend partly on how much you need working RTE and multilanguage capabilities though. (I don't know if these things will be affected or not by the upcoming release of Typo3 3.7)


OK that's an easy one, don't use templavoilla yet. It is a promising technique, but it is just not finished. But you should try it once to see what it is. So use HTML or TS based templated in production environments for now.

Somewhat contrasting, see http://typo3.org/documentation/mailing-lists/english-main-list-archive/thread/63979/ for the full thread this is from.

The thread at http://typo3.org/documentation/mailing-lists/english-main-list-archive/thread/60710/ has some reassuring statements about multi language support from Robert Lemke.

Update 25 may 2006 I think with typo3 V4 and the latest version of Templavoila 1.0.1 stable we can say that Templavoila is ready to make stable website with it. My own site and other site I do are all templavoila based and sao far no complains from my customers. I work with TV since version 0.3.0 December 2004 on a big website without problems, accept some anoyances dusint mapping. But FE site generation is superb (XHTML_TRANS). My conclusion is, sure go ahead and use TV!

[edit] Using (lastupdate|randomimage|...) extension with TemplaVoila

This is not too different, if you consider one simple trick. If you create the DS and TO, you will need to insert fields with editing type Typoscript Object Path. This will give you a reference to lib.whatever in the resulting DS.

Now you can prepare the extension output just as if you were doing a traditional TS template, and the assign that to the lib.whatever object. Here is an example from a thread about the Random Image extension:

#Constants
random_path = fileadmin/path/to/images/

#Setup
temp.randomImg = USER_INT
temp.randomImg {
 userFunc = tx_ccrandomimage_pi1->main
 path = {$random_path}
 fileExt = jpg,jpeg,gif,png
 renderObj = COA
 renderObj {
 10 = IMAGE
 10.file = ###FILE_1###
 }
}
lib.topphoto < temp.randomImg

See http://typo3.org/documentation/mailing-lists/english-main-list-archive/thread/64630/ for the thread.

This might help to overcome the problem of custom TS getting deleted by editing a DS: If all you need in the DS is lib.whatever, because the actual custom TS is elsewhere...

What is yet unclear, is whether this works the other way around as well: Accessing TS from the template record's setup field from inside your DS... Some info might be hidden here: Explanation about TypoScript in http://typo3.org/documentation/document-library/templavoila/Introduction-5db5ec2252/

[edit] TemplaVoila GIFBUILDER fontcolor from selectorbox?

I want to have the fontcolor of a gifbuilder object rendering one field come from another unmapped selector box field. What is the typoscript to do this?

I have tried:

10.fontColor = field_colorChoice
10.fontColor.field = field_colorChoice
10.fontColor.data = field:field_labelcolor

and various attempts to set the value with LOAD_REGISTER and read it as a constant, but I haven't succeeded.

I know the templavoila field is working properly, because I can render it with a TEXT object


Christian Jul Jensen answered on this:

10.fontColor.field = field_colorChoice

This should work _if_ within the the TVDS.

The scope of the TV fields are kind of tricky, the fields are not available from within your normal TStemplate, actually they are only available from the same level (ie. you can not access fields within a section from a field outside of the section) within the TVDS.

I consider this a designproblem in the TVext. I planned to do some brainstorming on how it could be done better, after making a bigger project with TV where I found it annoying, but forgot about it again. I'll see if I can get that done, and let Kasper and Robert know about it.


It's definitely not working, though 10.text.field = field_colorChoice is working, so it seems the field is in scope. It is on the same level...and the typoscript is all inside the TVDS. My goal with this website is actually to do the whole thing with templaVoila & no programming, but by now the html guy is ready to kill me :)

I noticed that in TSRef it does not say that fontColor is a standard wrap, but in the source code it seems to be run through standard wrap.


Again Christian: I think you need to do something like this (UNTESTED!)

10 = TEXT
10.field = field_fontColor

20 = IMAGE
...
20.10 = TEXT
20.10.fontcolor < 10

I think I used a trick like this and made it work, but I can't find it right now.


But this didn't work as well (see http://typo3.org/documentation/mailing-lists/english-main-list-archive/thread/63593/ for the thread).

[edit] Error when editing page header I

I see this error when I edit my page header (in the Content field).

Data Structure ERROR: No source value in fieldname "tx_templavoila_ds"

What would be the course and how can I resolve it?

This also happens if a page is created first and then TemplaVoila is installed.


It seems there is some dev/debug code in TemplaVoila that omits this fake error. It goes away when you assign the sysFolder containing the TO/DS records to the field "General Record Storage page" in the root page Page header.

[edit] Error when editing page header II

This problem also occurred in my new Typo3 installation:

  • New Typo3 v3.7.0 installation
  • Imported and installed TemplaVoila v0.3.0
  • Attempt to create a new page

In this case it was a little bit more serious, since you also got an PHP error and could not create a new page at all. There was an additional error message:

Errors:
2: SQL error: 'Unknown column 'tx_templavoila_ds' in 'field list
(pages:NEW40d1e44005282)

The problem was that I had forgotten to give ALTER privileges to my database user! So, if you get error messages like "supplied argument is not a valid MySQL result resource" check out your database:

  1. Go to the Install tool (the Install module)
  2. Choose "2: Database Analyser"
  3. Click on the "COMPARE" link after "Update required tables"
  4. If you see that some SQL commands with checkboxes by them go ahead and run them.
  5. If the same SQL commands keep appearing, check the permissions of your database user (e.g. in phpmyadmin outside of Typo3, database mysql, table db or user, field alter_priv - should be set to Y).

More information about this problem can be found in the mailing lists:

[edit] Reusing content elements automatically

This is not strictly TV, but as TV offers a function to reference objects I include this here. The mentioned function is not really suited for placing elements from one page on all pages.


I dropped a few posts last weeks in search for a solution for repeating content elements like footer text in TemplaVoila. I also noticed that I was not the only one questioning for that, and that there were no direct answers. Well, this is a solution. It works, but has a thing to be carefull about: like all modifications you make to a DS (DataStructure), the lines are replaced by the defaults when you save the DS later on.


I do this instead:

5 = CONTENT
5 {
 table = tt_content
 select.orderBy = sorting
 select.pidInList=40
}
10= RECORDS
10.source.current=1
10.tables = tt_content
15 = CONTENT
15 {
 table = tt_content
 select.orderBy = sorting
 select.pidInList=41
}

This way I'm still able to insert content elements on pr page basis. And then this i 'wrapped' in two pages with repeated content elements.

[edit] Adding custom code to page header

I've been working on a site that uses some IE conditional comments () for CSS stylesheet inclusion. When mapping the header fields from the template in TemplaVoila, I cannot select these to be put in the generated header. Is there a way to do this with TV or other templating methods without resorting to other advanced (custom PHP perhaps) methods?


You can still use the Typoscript headerData:

page.headerData.10 = TEXT
page.headerData.10.value = <!--[if...] [endif]-->

If you use the above page.headerData the resulting conditional CSS links are always included before any CSS stylesheets that are mapped as header elements in TV. This can be disastrous for your CSS layout. (IMPORTANT NOTE: This has been changed since TV v1.3.7! Since that version TV includes its headers as the FIRST members of page.headerData, which makes the following solution obsolete in most cases!)

So you will probably want to include all of your CSS files using page.headerData. This again may lead to the problem that you need to switch CSS files depending on differing TemplateObjects – which is easy in TV, but not that simple using TS...

Here's how to do it:

  • Save the following PHP function to /fileadmin/scripts/ts_user_functions.php
<?php
/*
  user_getActiveTO()

  Return the UID of the Template Object that is active for the current page.
  This TO can either be a record of the current page itself or inherited from 
  a parent page (db table 'page', fields 'tx_templavoila_to' and 'tx_templavoila_next_to').
*/
function user_getActiveTO($content, $conf){
  $to_uid = 0;
  $page_uid = intval($GLOBALS['TSFE']->id);
  $page_is_cur = true;
  
  while($page_uid && !$to_uid){
    $query = $GLOBALS['TYPO3_DB']->SELECTquery(
            'pid, tx_templavoila_to, tx_templavoila_next_to',
            'pages',
            'uid='.$page_uid,
            "",
            "");
    $res = $GLOBALS['TYPO3_DB']->sql(TYPO3_db,$query);
    $row = $GLOBALS['TYPO3_DB']->sql_fetch_assoc($res);
    $to_uid = intval( $page_is_cur ?  $row['tx_templavoila_to'] : 
                                      ( $row['tx_templavoila_next_to'] ?  $row['tx_templavoila_next_to'] : $row['tx_templavoila_to'] ) 
              );
    $page_uid = intval($row['pid']);
    $page_is_cur = false;
  }
  return $to_uid;
}
?>
  • Then add this to your TSsetup (adapt/add css stylesheet names and TO UIDs):
includeLibs.myUserFunctions = fileadmin/scripts/ts_user_functions.php

lib.headerCSS_TO_2col = TEXT
lib.headerCSS_TO_2col.value (
  <link href="/fileadmin/templates/css/central_2col.css" rel="stylesheet" type="text/css" >
)
lib.headerCSS_TO_3col = TEXT
lib.headerCSS_TO_3col.value (
  <link href="/fileadmin/templates/css/central_3col.css" rel="stylesheet" type="text/css" >
)

page.headerData.10 = CASE
page.headerData.10 {
  key.postUserFunc = user_getActiveTO
  # ATTENTION!:  TEMPLATE OBJECT UIDs (1,2,...) IN THIS CASE ARRAY MUST MATCH EXISTING TOs (see List module -> Storage Folder to get the TO UIDs)
  1 < lib.headerCSS_TO_2col
  2 < lib.headerCSS_TO_3col
  default < lib.headerCSS_TO_2col
}

page.headerData.20 = TEXT
page.headerData.20.value = <!--[if...] [endif]-->
  • Enjoy! :) --Jyps 11:30, 7 August 2008 (CEST)

[edit] Hardcoded links getting relative path prefix

I have started to use templavoila and encountered this problem. In static part of html template I have a few hardcoded links (index.php?id=11) which all get prefixed with /fileadmin/template/main.

Solution :

In order to have hardcoded links in your page templates, you must follow those 2 rules :

1 / the path to the file should be absolute, thus defined from the website root and not be relative to the page template location.

2 / a leading '/' must appear at the begining of the path.

If those 2 rules are fullfilled, Typo3 will not modify your link.

A typical hardcoded link would look like :

<img src="/fileadmin/templates/site1/img/logo.gif" />



[edit] Click-to-enlarge in Flexible Content Element

A lengthy discussion with a good end is at http://typo3.org/documentation/mailing-lists/english-main-list-archive/thread/48451/


Here is how I obtain enlarge image in Flexible contents, There is some code you have to add in typoscript for the image:



                              <field_image type="array">
                                <tx_templavoila type="array">
                                    <title>Image to enlarge</title>
                                    <sample_data type="array">
                                        <numIndex index="0"></numIndex>
                                    </sample_data>
                                    <eType>image</eType>
                                    <TypoScript><![CDATA[
	10 = IMAGE
	10.file.import = uploads/tx_templavoila/
	10.file.import.current = 1
	10.file.import.listNum = 0
	10.file.maxW = 85

###################################
### BEGIN code to enlarge image ###
###################################
10.imageLinkWrap = 1
10.imageLinkWrap {
  bodyTag = <body style="background-color:#fff;">
  wrap = <a__NOSPAM href="javascript:close();"> | </a>
  width = 800m
  height = 600m
  effects=
  JSwindow = 1
  JSwindow {
    newWindow = 0
    expand = 17,20
    }

  enable = 1
  typolink.parameter.field=image_link
  typolink.extTarget = _blank
}
#################################
### END code to enlarge image ###
#################################

                         ]]></TypoScript>
                                </tx_templavoila>
                                <TCEforms type="array">
                                    <config type="array">
                                        <type>group</type>
                                        <internal_type>file</internal_type>
                                        <allowed>gif,png,jpg,jpeg</allowed>
                                        <max_size>1000</max_size>
                                        <uploadfolder>uploads/tx_templavoila</uploadfolder>
                                        <show_thumbs>1</show_thumbs>
                                        <size>1</size>
                                        <maxitems>1</maxitems>
                                        <minitems>0</minitems>
                                    </config>
                                    <label>Image to enlarge</label>
                                </TCEforms>
                            </field_image>

[edit] Enabling RTE in FCEs

This is documented here: http://typo3.org/documentation/document-library/doc_core_api/columns_fieldnam-10/

Basically you just have to map a field of the type "Text area for bodytext" and save the TO/DS. Then switch to the list module and edit the created DS.

Find the lines:

<HSC type="integer">1</HSC>

and

<label>My Textfield</label>

and change them to:

<HSC type="integer">0</HSC>

and 

<label>Miniteaser Text</label>
<defaultExtras>richtext[*]:rte_transform[mode=css]</defaultExtras>

This will enable all possible buttons in the RTE. Of course you could also enable only certain buttons :

<defaultExtras>richtext[cut|copy|paste|formatblock|bold|italic|underline|left|center|right|orderedlist|unorderedlist|outdent|indent|link|image|line|chMode]:rte_transform[mode=css]</defaultExtras>

--sacha 11:44, 30 Oct 2004 (CEST)

[edit] Enabling RTE in FCEs (additional comment)

Jan-Erik Revsbech on dev@ This one works for me. But you need this additional line in you TS template:

 lib.tt_content < tt_content
 <field_text type="array">
   <tx_templavoila type="array">
     <title>Tekst</title>
     <description>Map to the text</description>
     <sample_data type="array">
       <numIndex index="0">Det her er den tekst der skal stå og som A11 selv skal skrive.</numIndex>
     </sample_data>
     <eType>input</eType>
     <proc type="array">
      <HSC type="integer">0</HSC>
     </proc>
     <TypoScript>
     <![CDATA[
     20 < lib.tt_content.text.20
     20  {
       field >
       current = 1
     }
     ]]>
     </TypoScript>
   </tx_templavoila>
   <TCEforms type="array">
     <config type="array">
       <type>text</type>
       <cols>48</cols>
       <rows>5</rows>
     </config>
     <label>Tekst</label>
     <defaultExtras>richtext[*]:rte_transform[mode=ts_css]</defaultExtras>
   </TCEforms>
 </field_text>

[edit] Enabling RTE in FCEs (further additional comment)

Ralf Rings suggested an alternate solution in this mailing list thread that requires no extra TS in the main TS template of the site. Modify your data structure as follows (take special note of the <typoscript> and <defaultExtras> elements):

<field_body type="array">
  <tx_templavoila type="array">
    <title>Body</title>
    <eType>text</eType>
    <TypoScript>
      <![CDATA[
        10 = TEXT
        10.current = 1
        10.parseFunc = < lib.parseFunc_RTE
      ]]>
    </TypoScript>
    <proc type="array">
      <HSC type="integer">0</HSC>
    </proc>
  </tx_templavoila>

  <TCEforms type="array">
    <config type="array">
      <type>text</type>
      <cols>48</cols>
      <rows>5</rows>
    </config>
    <label>Body</label>
    <defaultExtras>richtext[*]:rte_transform[flag=rte_enabled|mode=ts_css]</defaultExtras>
  </TCEforms>
</field_body>

[edit] Creating a print-version with TV

http://typo3.org/documentation/mailing-lists/english-main-list-archive/thread/110096139/ Matthew : This link is broken, any idea what it was called so I can update it?

Maybe this one: http://www.l-base.de/TYPO3-forum.97+M55ecc1109b2.0.html

[edit] Plaintext newsletter with DirectMailer and TV

First you should already know how to create a HTML newsletter using TV. This is almost self-explanatory if you know how to set up a traditional Newsletter using MTB. You just have to replace the page.xx TS for MTB with the call to the TV main method.

But to get plaintext newsletters work with TV is a little bit tricky. But here is a guide how you get this done. Mainly what we do is to use the print-version of a TV page as plaintext page created by using the static template lib.alt_plaintext. But see youreself:

First edit your TS-template for the newsletter. You will most probably have something there like:

page = PAGE
page.typeNum = 0
page.10 = USER
page.10.userFunc = tx_templavoila_pi1->main_page

First include the "plugin.alt.plaintext (99)" Static template into your TS template. You do this in the field "Include static:"

Then add the following TS code above the "page = PAGE" line

[globalVar = GP:print > 0]
  tt_content < lib.alt_plaintext.renderObj
[end]

This will instruct T3 to use the plaintext rendering object when the print version is requested. Now also add the followin TS code below the page.10.userFunc line (below the last "page." line)

 [globalVar = GP:print > 0]
   config.disableAllHeaderCode = 1
 [end]

This instructs T3 to disable the generation of the HTML <head> and <body> section. Now all you have to do is to make a print version of a HTML file. But this HTML file is somewhat special as it just contains the really required tags and the rest is just plaintext. Such a HTML template will look like the follwing:

<html>
<head>
  <title>Test</title>
</head>
<body>
<div id="content">CONTENT</div>

----------------------------------------------------------
Should you want to unsubscribe or change your subscription
use the following link:
http://www.mysite.com/index.php?id=UID_OF_NEWSLETTER_PAGE&cmd=edit&aC=###SYS_AUTHCODE###&rU=###USER_uid###
</body>
</html>

Replace the "www.mysite.com" URL with the URL of your site, probably add the correct path to the T3 installation and change the "UID_OF_NEWSLETTER_PAGE" to the correct value of the page where the newsletter plugin is located. Then save this file with an .html ending to the fileadmin and map it with TV. .html is required for TV for recognizing it as mappable file.

Create a single field "field_content" and assign it to contain Content Elements. Then map the root-element to the <body> tag. But always map it INNER so you don't get the body tag in the resulting plaintext newsletter. Then map the "field_content" field to the "<div id="content">CONTENT</div>" but this time outer so we this time replace the whole <div> tag. Again this will result in not having any HTML in the output.

IF you did everything correctly you will be able to view this page and add a &print=1 variable to the URL and you will get a plaintext only version of page. As the content-type is still text/html there are no line breaks but this doesn't hurt because the content-type is set explicitly in the plaintext mails.

Now the last thing you will have to do is to go to the Direct-Mailer configuration and instruct the mailer to fetch the plaintext version of the page not by appending "&type=99" but by "&print=1" to the URL.

Now you should at least be able to fetch a newsletter page and send it to yourself and you will receive it in plaintext and HTML when you have modules_sys_dmail_html enabled (HTML version of newsletter enabled). But notice that some mailclients make it hard to view the plaintext message included if there is a HTML part. And if you have the HTML mode of your tt_address entry disabled then you will receive a text-only version of the mail.

One thing you will notice is that the links in the plaintext messages don't work. They get redirected to some strange example.com URL. You can fix this by adding the following TS to your TS template:

plugin.alt.plaintext {
  siteUrl = http://www.mysite.com/PATH/TO/TYPO3/
}

but I have to say that I don't know wheter to put it in Constants or Setup so I always put it in both :)

It also seems as there are some problems with line endings getting eaten up by some mail clients when the message is sent in BASE64. But possibly that has to do with encoding conversions on the tested mailservers.

If you don't want those <!--TYPO3SEARCH_begin--> in your plaintext newsletter (which you probably really don't want...) you have to edit your Templavoila XML-Data structure of your newsletter template (the HTML-version!). For every ContentElement-type section you find something like this:

10= RECORDS
10.source.current=1
10.tables = tt_content
10.wrap = <!--TYPO3SEARCH_begin--> | <!--TYPO3SEARCH_end-->

change the last line to look like this:

10.wrap =

[edit] TemplaVoila! FCEs can`t be rendered in plain-text version

Please note that FCEs can`t be rendered with a plain text newsletter set up like described above. See also: http://bugs.typo3.org/view.php?id=1912 Matthew -- seems to be resolved see the bug tracker for status.

Until this is solved, you can download the extension svo_tvplaintext and create your plain-text version like this:

[globalVar = GP:print > 0]
page >
page = PAGE
page {
  typeNum = 0  
  config {
    disableAllHeaderCode = 1
  }
  20 = COA
  20 {
    10 = USER
    10.userFunc = tx_templavoila_pi1->main_page
    stdWrap.postUserFunc = tx_svotvplaintext_pi1->user_cleanup
  }
}
[end]

--sacha 22:49, 28 Nov 2005 (CET)

[edit] 2 level FCEs

It is possible to make a multi-level (only two levels shown in this example) <ul><li> list using Flexible Content Elements (FCE's) which are made available with TV. To start of you need an HTML template file in your fileadmin directory. It should contain a section like this:

<ul>
  <li>Item 1</li>
  <li>
    <span>Item 2</span>
    <ul>
      <li>Item 2.1</li>
      <li>Item 2.2</li>
    </ul>
  </li>
  <li></li>
  <li>Item 3</li>
</ul>

When TV is set up correctly (it is when you have a page using TV up and running) you can continue by going to the "File > Filelist" module and clicking on the icon of the file containing the above HTML code and invoke the TV mapper.

You then create a structure like the following:

Showing the DS Structure of a 2-level FCE (could be also nested divs)

You map it like following to the HTML Template:

HTML templated mapped as 2 level FCE

You can see if the different elements are mapped INNER or OUTTER in the upper image. Please keep that exactly and only change it if you know what you are doing !!!

Note the span element around the text in the <li> containing the second <ul> level. It is necessary because you can't map an text block (exactly after HTML DTD: #CDATA block) (only OUTTER would be a valid choice as with an image). So this "invisible" span is required (check that no styles are applied to that <span>)

Afterwards you will get an Flexible Content Element like the following:

Editing the resulting FCE in the BE

Please note that the second level isn't really distingushable from the first level. I will add this as feature request to the bugtracker. But this is not related directly to TV as Flexforms are a feature of TYPO3.


Bernhard Kraft 22:00, 29 Sep 2005 (CET) [www.think-open.at]

[edit] Up/down buttons do not work

The up/down buttons in Web->List mode has no effect in TemplaVoila as they use the "sorting" field, which is not supported under TV. Instead you change the order of the Content-Elements(CE) when you use List-View by clicking the "Edit-Page Header" (Pencil) icon on the very top of the list page. At the bottom of the Page-Header you find the Flexform containing all directly editable properties and also the Content-Areas implemented as select boxes. There you can change the order using the up and down buttons. You can use the "directory-with-arrow" icon to add a new CE as you do when selecting elements for an "insert-records" CE. You can also use the black "+" icon to add more than one CE.

Update (27.11.05): Up/down buttons work in TemplaVoila 1.0

[edit] How to get template changes to show

I made a few changes to my template in fileadmin/templates/template.htm and I cannot get the new changes to reflect when I view source of a page again. I tried clearing front-end cache, the cache in typo3conf/ (the 2 places on the admin panel) and I tried uploading the file more than once. What do I do to get the template changes to show?

You have to save your DS/TO again because an already parsed version of the HTML template get's stored in the TO record so it is easier and faster to generate the required pages.

  1. Go to Web>List module.
  2. Go to the sysfolder which contains your DS/TO (which you configured as General Storage Page - GRSP).
  3. Click on the icon of the TO (and only the TO - you shall not click the icon of the DS ... and not those of a possible OT ... or an SD  :) citing Monty Python) Choose "TemplaVoila" from the Context Menu.
  4. Make sure the checkbox "select HTML Header parts" is not checked and that your current mapping get's shown without any errors (that can have happened if you changed major parts of you HTML template). If there are mis-mapped elements you can correct them in this view. You can-not add new fields.
  5. Click the "Save" button at the bottom of the page.
  6. Now check "Select HTML header parts" and verify that checkmarks near header parts are not lost.
  7. Click "Save" if you modify any checkmarks
  8. Click "Clear FE cache"

If you skip step 5, your mapping can be lost completely. Never skip it even if you did not make any changes to the mapping!

[edit] TemplaVoila localization

[edit] How to change icon for default language

Put this in the Page TS config of root page:

mod.SHARED {
 defaultLanguageLabel = Deutsch
 defaultLanguageFlag = de.gif
}

[edit] TemplaVoila working with multiple languages

  • Install the extensions:
    • static_info_tables
    • static_info_tables_uksorting
    • sr_static_info (This extension is now merged into the base extension Static Info Tables 2.0.0 (extension key: static_info_tables))
    • ts_language_XX
  • Create the alternative languages needed (do not create the default language here):
    • ROOT -> new -> Languages
  • Create an "Alternative Page Language" for all the pages you want to translate, this is where you will translate the titles of your pages:
    • Contextual menu -> New -> Alternative Page Language
    • or
    • Page -> Language -> Make new translation of this

[edit] 2 ways to translate.

[edit] By having a different content element for each language (using the Localization tab on the green TV Page)

  • THIS is DEPRECATED with TYPO3 3.8.0 !!!

All works OK without this on 3.8.0 with TV 0.4.0


  • Edit your TV xml file for your TEMPLATE, replace:
<T3DataStructure>
    <ROOT type="array">

by:

<T3DataStructure>
<meta type="array">
<langChildren type="integer">1</langChildren>
<langDisable type="integer">0</langDisable>
</meta>
    <ROOT type="array"> 
  • Then edit your page header, a selectorbox should appear after the "Content:" line, with CTRL key click on all your languages. You should now see a choice in the Localization tab of the TV page.
  • You can make automatically a copy of all your content for translation in the classical page module / section language -> Copy default content elements [x]

[edit] By having the different languages in the same content element (works only with flexible content)

  • Edit your TV xml file for your FLEXIBLE CONTENTS elements, replace:
<T3DataStructure>
    <ROOT type="array">

by:

<T3DataStructure>
<meta type="array">
<langChildren type="integer">1</langChildren>
<langDisable type="integer">0</langDisable>
</meta>
    <ROOT type="array"> 


  • Then edit your content element, a selectorbox should appear after the "Content:" line, with CTRL key click on all your languages. Save and you should now be able to write the translation in the same content for all your languages.
  • If you are having trouble viewing the content elements you add when you switch between different languages, try changing the above to
<langChildren type="integer">0</langChildren>
  • If you want to keep the same language through the navigation of your website, you need to add this to your template TS setup (replace fr,en and fr_FR,english by the languages you need):
# defining the default language
config.sys_language_uid = 0
config.language = fr
config.locale_all = fr_FR
#config.htmlTag_langKey = fr

# Setting up the language variable "L" to be passed along with links
config.linkVars = L(0-2)

# Fench language, sys_language.uid = 0
[globalVar = GP:L = 0]
config.sys_language_uid = 0
config.language = fr
config.locale_all = fr_FR
#config.htmlTag_langKey = fr
[global]

# English language, sys_language.uid = 1
[globalVar = GP:L = 1]
config.sys_language_uid = 1
config.language = en
config.locale_all = english
#config.htmlTag_langKey = en
[global]

# Third language, sys_language.uid = 2
[globalVar = GP:L = 2]
config.sys_language_uid = 2
config.language = xx
config.locale_all = xx_XX
#config.htmlTag_langKey = xx
[global]

This code will add the parameter &L= to all your TS link in your website.


Clear all cache, take a big dictionnary, 2 liters of coffee and translate ;-)

Screenshots to come.


Adrien Laurent 06:57, 24 Mar 2005 (CET) [www.adrienlaurent.net]

[edit] Using the same content elements in any language, if not defined

--Christian Guse 18:23, 21 Jan 2005 (CET)

  • If you would like to use e.g. Images of your Template in any language if the user does not define new ones in the other language, replace this in your TV xml file for your TEMPLATE:
<ROOT type="array">
   <tx_templavoila type="array">
         <title>ROOT</title>
         <description>Select ...</description>
   </tx_templavoila>

by:

<ROOT type="array">
    <tx_templavoila type="array">
         <title>ROOT</title>
         <description>Select ...</description>
         <langOverlayMode>ifBlank</langOverlayMode>
     </tx_templavoila>

For more options see: http://typo3.org/documentation/document-library/templavoila/Introduction-5db5ec2252/

[edit] Links to other resources

  1. Marlies TemplaVoila cheat-sheet: http://www.mcuniverse.com/TemplaVoila-Cheat-Sheet.1379.0.html
  2. Futuristic Template Building: http://typo3.org/documentation/document-library/doc_tut_ftb1/
  3. Robert Lemke's TemplaVoila resources page: http://robertlemke.de/en/resources/extensions/templavoila.html
  4. Video-driven Tutorials for beginners (german) : http://www.fi-ausbilden.de/blog/2007/07/11/typo3-dynamisierung-mit-templavoila-teil-1/
  5. German Tutorial: http://www.alnovi.de/nc/developer/wiki/typo3/templavoila/
  6. Creating of FCE's (german): http://www.alnovi.de/nc/developer/wiki/typo3/templavoila/keyword/Flexible%20Content%20Element/
  7. TV and typoscript (german): http://www.alnovi.de/nc/developer/wiki/typo3/templavoila/keyword/TemplaVoila%20TS/
Personal tools