Typo3

Articles about Typo3 CMS

Facebook Comments for tt_news extension released to TER :)

Facebook Comments Extension previewToday I've uploaded to the typo3 TER my first contribution to the community, the implementation of Facebook Comments Box for tt_news plugin.

The extension allows you to display a comment box and a list of comments under your news and visitors can login with Facebook Connect and post comments. These comments show up on their profiles. It's a neat feature to spread the reach of your content.

The video below explains more about what the Comments widget is and how can you get one.

I will come back with a more detailed post and examples about the extension. As a short summary, you get three markers that get inserted in the templates and then in typoscript you set up the facebook api key and you enable the comments in displayList, displayLatest or displaySingle section. The text "1 comment", "xx comments" is also translatable via typoscript. More is explained in the manual inside the extension.

Until the extension shows up in the TER you can download it from the Download page.

UPDATE: http://typo3.org/extensions/repository/view/ttnews_facebookcomments/current/

Split text into multiple lines with GIFBUILDER (graphical headers)

I'm working on a project and I needed to use graphical headers for content elements and tt_news. Everything is ok, except I need to split some long headers into multiple lines as otherwise the long generated image would break the layout.

Here' s the code that does the magic:

#######################################################
# News headers
#######################################################
plugin.tt_news {
    displayList {
    title_stdWrap.cObject = TEXT
    #title_stdWrap.cObject.wrap = <div class="divheader">|</div>
    title_stdWrap.cObject.current = 1
    title_stdWrap.cObject.split {
      token.char = 32
      cObjNum = 1
       1{
        10 = IMAGE
        10.alttext.cObject = TEXT
        10.alttext.cObject.field= title
        10.file = GIFBUILDER
        10.file {
                XY = 500,[10.h]+[20.h]+[30.h]+40
                10 = TEXT
                10.text.field = title
                10.text.listNum.splitChar=|
                10.text.listNum=0
                #10.niceText = 1
                10.fontColor = #000000
                10.fontFile = path/to/ttf/font
                10.fontSize = 35
                10.offset = 0,35
                20 < .10
                20.text.listNum=1
                20.offset = 0,35+[10.h]+6
                30 < .10
                30.text.listNum=2
                30.offset=0,35+[10.h]+[20.h]+12
                format = png
                backColor = #ffffff
          }
       }
    }
   }
    }
  }

For the content elements:

#######################################################
# Graphical headers
#######################################################
lib.stdheader.10.1 >
lib.stdheader.10.1 = IMAGE
lib.stdheader.10.1 {
 altText.current = 1 
 file = GIFBUILDER
 wrap = <h1> | </h1> 
 file {
                XY = 500,[10.h]+[20.h]+[30.h]+40
                10 = TEXT
                10.text.field = title
                10.text.listNum.splitChar=|
                10.text.listNum=0
                #10.niceText = 1
                10.fontColor = #000000
                10.fontFile = path/to/ttf/font
                10.fontSize = 35
                10.offset = 0,35
                20 < .10
                20.text.listNum=1
                20.offset = 0,35+[10.h]+6
                30 < .10
                30.text.listNum=2
                30.offset=0,35+[10.h]+[20.h]+12
                format = png
                backColor = #ffffff


 }
}

Change lib.stdheader.10.1 to 10.2, 10.3 for the other entries in the Layout drop-down. To change the labels in the drop-downs add this to the TSConfig field of the main page in the tree (Right Click > Page Properties > Options):

TCEFORM.tt_content.header_layout.altLabels {
    1 = Black 35
    2 = Black 18
    3 = Gray 14
    4 = Gray 14 background
} 

IE problem from the Kickstarter generated code

I've just ran into a problem with a backend module generated with the Kickstarter extension in Typo3 4.2.9.

There is a form tag created by default on line 104

// Draw the form
$this->doc->form = '<form action="" method="post" enctype="multipart/form-data">';

This caused the divs to be rendered inside the form instead the other way around. And IE couldn't scroll the content anymore. I've removed it and everything works now.

Finished Typo3 project - Waterstillar.com

I've finished working on a Typo3 project. It's online at www.waterstillar.com. I'll post more about this when I'm done working on the portfolio page.

A quick summary. It's built on Typo3 4.2.6, has 2 main templates, frontpage and a 2 column one. Most content is text and images, but also has two custom built modules. One is for the Library section, displays term definitions order by letters and the other is a gallery plugin with a jQuery 3D carousel.

The company owning the site, based in Denmark, sells Waterstillar products that help you clean the water you drink. Here's what the product does:

“A simple and effective solar distillation solution, primarily for domestic use. Can be placed on (or in) a roof and the drinking water will flow directly into the kitchen. A solar collector with a WaterStillar® unit integrated. 1 m2 will give app 20-25 litres pr day”.

Read more on Waterstillar website.

Waterstillar.com website

 

Typo3 - Real URL "... was not a keyword for a postVarSet as expected!"

I've just encountered a problem when trying to enable RealURL extension on a Typo3 website. I've installed the extension, links where generating ok, but I would get a "... was not a keyword for a postVarSet as expected!".

Four hours later, after countless configurations tried and modules and other stuff, I found the problem.