Typo3

Language menu seperator for sr_languagemenu

The code below is used to get a language menu seperator for sr_languagemenu as shown in the picture below:

capture10-17-2008-4.41.21 PM

CODE:

10  < plugin.tx_srlanguagemenu_pi1
10 {
    links.stdWrap.split {
        token = {$plugin.tx_srlanguagemenu_pi1.token}
        wrap =  |   |*|  <span class="SPC2"> &nbsp;&#124;&nbsp; | </span> |*|    <span class="SPC3"> &nbsp;&#124;&nbsp; | </span>  
    }
}

In the above code &#124; is the HTML Character Code for pipe character ( | )

The SPAN tag, and SPAN Classes are optional and solely meant for code readability!!!

How to set ATagParams for menu items (except for some pages)

This code may be useful when you may wish to have some extra parameter to all anchor tags in menu items, the code even shows how you can avoid these parameters for some selected pages.

The code below creates this link:

<a rel=”moodalbox” href=”pagelink” >page title</a>

For pages with uid 10, 23 the link will be generated as follows:

<a href=”pagelink” >page title</a>

To get this kind of menu write the following typoscript in the Setup section:

lib.atl_lefttop = COA
lib.atl_lefttop.10 = HMENU
# Level 1
lib.atl_lefttop.10 {
stdWrap.ifEmpty.wrap = &nbsp;
1 = TMENU
1 {
wrap = <ul>|</ul>
expAll = 1
NO.wrapItemAndSub = <li>|</li>

NO.ATagParams.cObject = TEXT
NO.ATagParams.cObject {
value = rel=moodalbox
/*
moodalbox should not be applied for the uid specified here
*/
if {
value = 10,23
isInList.field = uid
negate = 1
}
}

ACT < NO
ACT.wrapItemAndSub = <li class=”act”>|</li>

CUR < NO
CUR.wrapItemAndSub = <li class=”cur”>|</li>
}

}

# level 2 3 and 4 use same settings as sown above
2< .1
3< .2
4< .3
}

Menu with separate Image for Each Page using optionSplit

Typoscript to have custom image menus with different image for each page using optionSplit

I was just curious on how to get a separate image as menu item for each page. Then I found that we can use the optionSplit funtion to do this.

The example shows how to do this.

# Page Menu – a 3rd level menu

lib.pagemenu = COA
lib.pagemenu.10 = HMENU
lib.pagemenu.10.entryLevel = 3

# Level 3

lib.pagemenu.10 {
    stdWrap.ifEmpty.wrap = &nbsp;
    1 = TMENU
    1 {
        wrap = <div class=”numbers”>|</div>
        expAll = 1
        NO.allWrap.dataWrap = <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”1.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”2.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”3.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”4.gif”></a>
        NO.doNotShowLink = 1

        ACT < NO

        CUR = 1
        CUR.allWrap.dataWrap = <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”1-mo.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”2-mo.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”3-mo.gif”></a> || <a rel=”moodalbox” href=”index.php?id={field:uid}”><img src=”4-mo.gif”></a>
        CUR.doNotShowLink = 1
    }
}

Random Quotes ( jm_quote )

Here I have given some tips on how to use jm_quote.

You may find this extension at: http://typo3.org/extensions/

1. Install the extension

2. Create a sysFolder (ex: Random Quotes)
Let us consider the uid of this sysFolder is 60

3. Create a few records with your quotes.

4. Now you need to inform the jm_quote plugin the uid of the above sysFolder.

This needs to be done in the Typoscript setup as shown below:

plugin.tx_jmquote_pi1 {
    #Sysfolder Page-ID, where the quotes are located.
    pid_list = 60
}

5. Now it is time to get the random quotes on your page.

This can be easily done by assigning the plugin output to the required TypoScript object:

lib.my_header < plugin.tx_jmquote_pi1

That’s all. Now you should see the quotes on the pages. (Make sure to clear FE Cache)

How to include multiple CSS and JS files using Typoscript

You may include multiple CSS files using the following code:

page.includeCSS {

file1 = fileadmin/templates/project1/css/file1.css
file2 = fileadmin/templates/project1/css/file2.css
file3 = fileadmin/templates/project1/css/file3.css

}

Use this code to include Javascript files:

page.includeJS {

file1 = fileadmin/templates/project1/js/file1.js
file2 = fileadmin/templates/project1/js/file2.js
file3 = fileadmin/templates/project1/js/file3.js

}

Consider you wish to have a CSS specifically for IE 6 and below:

[version= < 7][browser = msie]
page.includeCSS.file4 = fileadmin/templates/prj1/css/ie6fix.css
[global]