StartTypo33D-GraphicAustraliaProjectsPrivateBlog




Typo3 » Tutorials » Extensions » Add news to your page

Add news to your page

The news list

Pagestructure

Create one page for your newslist and a SysFolder for the news items and categories.

 

 

In the SysFolder the news items and categories will be created. You can create some news categories already now. To create them click with the left mouse button at the symbol from the SysFolder and choose 'New'. Then click at 'News' to create a news item or at 'News category' to create a news category.

 

Template

In the page (not the SysFolder) News create a new template and add the following in the 'Constants' field:

 

plugin.tt_news {
  file.templateFile = media/scripts/news_template.tmpl
  wrap1 = <font color="#999999"> | </font>
  wrap2 = <font color="#004263"> | </font>
  color1 = #999999
  color2 = #004263
  PIDitemDisplay = single_news_display_pid
}

 

The parameter 'file.templateFile' describes which HTML template should be used to display the news.

 

With 'wrap1' and 'wrap2' you can specify special wraps that can be used in the HTML template. In this case 'wrap1' is used for the light grey text and 'wrap2' is used for the titles of the news.

 

The parameters 'color1' and 'color2' define color values that can be used in the HTML template. In this case they are not used.

 

Set the parameter 'PIDitemDisplay' to the pid of the News page (not the SysFolder). You can also use another page to display a single news item, then you should change this value to that page pid.

 

In the 'Setup' field of the template put the following:

 

 

plugin.tt_news {
  limit = 5
  displayList {
    image.file.maxW = 100
    imageWrapIfAny (
      <table align="left" bgcolor="#AAAAAA" cellpadding="1"
             cellspacing="0" border="0">
      <tr><td>
      <table bgcolor="#EEEEEE" cellpadding="0"
             cellspacing="0" border="0">
      <tr><td> | </td></tr>
      </table>
      </td></tr>
      </table>
    )
  }
  displaySingle {
    image.file.maxW = 160
    imageWrapIfAny (
      <table align="left" bgcolor="#AAAAAA" cellpadding="1"
             cellspacing="0" border="0">
      <tr><td>
      <table bgcolor="#EEEEEE" cellpadding="0"
             cellspacing="0" border="0">
      <tr><td> | </td></tr>
      </table>
      </td></tr>
      </table>
    )
  }
}

 

The parameter 'limit' limits the number of news items on one page. If there are more news items you get 'prev' and 'next' buttons.

 

With the parameter 'image.file.maxW' you can specify the maximum width of the images for the news items. It can be used for both 'displayList' and 'displaySingle'.

 

The value of imageWrapIfAny will be wrapped around the image from the news item, if there is an image, otherwise nothing happens. It can also be used in 'displayList' and 'displaySingle'.

 

Now the HTML template to display the news should be uploaded. Save the following file with the name 'news_template.tmpl' in the directory 'media/scripts'.

 

news_template.tmpl

 

Please note, that the Internet Explorer changes the file-extension to .htm, if you save the file.

Pagecontent

Create in the page (not the SysFolder) 'News' a content-element like this one:

 

 

The entry 'News' in the 'Startingpoint' field is the SysFolder 'News'.

 

Now create some news items in the SysFolder 'News' and you are ready with the news list.

 

For a working example look here.