DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

Browser Tutorial tt_news Sample (en)

Author:Kasper Skårhøj
Created:2002-11-01T00:32:00
Changed by:dirk
Changed:2015-04-10T00:42:06
Classification:browser_tut_tt_news_en
Description:Publish your own data with the Browser – TYPO3 without PHP. This tutorial presents a ready-to-use example with the tt_news extension. Adapt it to your needs! You are welcome to take any other extension too.
Keywords:browser, TYPO3 without PHP, templating, sample, tt_news
Author:Dirk Wildt, Die Netzmacher
Email:http://wildt.at.die-netzmacher.de
Website:http://die-netzmacher.de
Language:en

img-1 img-2 Browser Tutorial tt_news Sample (en) (extkey: browser_tut_tt_news_en) img-3

Browser Tutorial tt_news Sample (en)

Browser – TYPO3 without PHP

Publish your own data with the Browser – TYPO3 without PHP. This tutorial presents a ready-to-use example with the tt_news extension. Adapt it to your needs! You are welcome to take any other extension too.

img-4

Version: 7.0.7, 2015-04-09

Extension Key: browser_tut_tt_news_en

Language: en

Keywords: browser, TYPO3 without PHP, templating, sample, tt_news

Copyright 2010-2015, Dirk Wildt, Die Netzmacher, <http://wildt.at.die- netzmacher.de>

This document is published under the Open Content License available from http://www.opencontent.org/opl.shtml

The content of this document is related to TYPO3 - a GNU/GPL CMS/Framework available from www.typo3.org

Introduction

What does it do?

  • The Browser Tutorial tt_news Sample (en) is a Quick Start tutorial for the Browser – TYPO3 without PHP.
  • It presents, how to publish any own data with the Browser – TYPO3 without PHP.
  • The example with tt_news is ready-to-use.
  • It should be easy to adapt it to your own needs.

What do you need?

  • A little experience in TypoScript.
  • The extension tt_news and some news records.

Further Information

This tutorial in PDF format

You find this tutorial as a PDF file at

Browser Manual

Manual: The Browser has it's own manual (with the reference of course).

Quick Installation

Extension Manager

Open the extension manager, download the extension Browser (extkey: browser) and install it.

If you haven't installed the extension tt_news, please install it too.

Tutorial

What do you need?

This is a trial with tt_news. You need:

  • an installed tt_news and
  • some tt_news records

Add Page, Browser Plugin and Template

Frame39

Add a page to your page tree.Call it "Browser Sample II".

Add the Browser plugin to the page.Call it "[Browser Sample II]".Set the header type to: [hidden].Configure the other properties later (see below).

Add an extension template to your page.Call it in the format "type _name-of-your-page_uid-of-yourTypoScript-template".Here: "+page_browsersample2_1023"

Configuring

Template

Configure the extension template. Here: +page_browsersample2_1023

[Includes]

Add in the tab [Includes] into the field "Include static (from extensions):" the three templates:

  • Browser [1] Basis (browser)
  • Browser [1] + pageBrowser Wrap v4.9 (browser) :sup:`0 <#sdfootnote1sym>`_
  • Browser [3] + Sample for tt_news (browser)
Browser Plugin / Flexform
[Behaviour]

Browser plugin tab [Behaviour]

Field "Record Storage Page": the folder wirh your news. Here: "News (tt_news)"

Recursive: [Infinite]

Frame39

[Plugin] > [List View]

Browser plugin tab [List View]

Title: Browser Sample II

Frame39

Result in the Frontend

Frame39 Frame39

The result depends on the corporate design of your website.

Change some properties in the Flexform of the Plugin

We like to change some stuff in the frontend. We like to disable

  • the index browser
  • the page browser and
  • the search form
Tab [List Views]
  • Navigation: Disable
    • [ ] Index Browser
    • [ ] Page Browser
  • Select box "Search": [configured]
  • Check box "Search: Form": Disable "Display the form"
Result in the Frontend

Frame39 Frame39

TypoScript

File structure

Configuration/TypoScript/samples/tt_news

tt_news

├── constants.txt

├── list

│ ├── filter.ts

│ ├── htmlSnippets.ts

│ ├── setup.ts

│ ├── sql.ts

│ └── tableFields.ts

├── locallang.ts

├── setup.txt

└── single

├── setup.ts

├── sql.ts

└── tableFields.ts

List View

General

Configuration/TypoScript/samples/tt_news/list/setup.ts

plugin.tx_browser_pi1 {

views {

list {

1000 = tt_news: Sample

1000 {

// [String] Name of the view. It will displayed in the plugin/flexform

name = tt_news: Sample

// [String] Alias for showUid.

showUid = {$plugin.tx_browser_pi1.navigation.showUid}

}

}

}

}

All values are configured by the Constant Editor, which are beginning with "{$plugin. tx_browser_pi1. ..."

See the configuration of the showUid at

Constant Editor > Category: [BROWSER - NAVIGATION (3)]

File: Configuration/TypoScript/samples/tt_news/constants.txt

SQL

Configuration/TypoScript/samples/tt_news/list/sql.ts

plugin.tx_browser_pi1 {

views {

list {

1000 {

// [String] Select clause (don't confuse it with the SQL select)

select (

tt_news.title,

tt_news_cat.title,

tt_news.datetime,

tt_news.ext_url,

tt_news.image,

tt_news.imagealttext,

tt_news.imagetitletext,

tt_news.page,

tt_news.short,

tt_news.type

)

// Order of the records

orderBy (

tt_news.datetime DESC, tt_news_cat.title, tt_news.title

)

// Don't link any field automatically with the link to the single view

csvLinkToSingleView = dummy

functions {

clean_up {

// Don't display fields as columns in the table

csvTableFields (

distance,

tt_news.ext_url,

tt_news.page,

tt_news.type,

tt_news_cat.title

)

}

}

}

}

}

}

Filter

Configuration/TypoScript/samples/tt_news/list/filter.ts

plugin.tx_browser_pi1 {

views {

list {

1000 {

filter {

tt_news {

datetime < plugin.tx_browser_pi1.displayList.master_templates.category_menu

datetime {

first_item {

cObject {

20 {

data >

value = Year

lang {

de = Jahr

en = Year

}

}

}

}

wrap = <span class="category_menu">|</span>

order.field = uid

area < plugin.tx_browser_pi1.displayList.master_templates.areas.sam ple_period

}

}

tt_news_cat {

title < plugin.tx_browser_pi1.displayList.master_templates.selectbox

title {

first_item {

cObject {

20 {

data >

value = Category

lang {

de = Kategorie

en = Category

}

}

}

}

wrap = <div class="selectbox">|</div>

}

}

}

}

}

}

}

TableFields

Configuration/TypoScript/samples/tt_news/list/tableFields.ts

plugin.tx_browser_pi1 {

views {

list {

1000 {

tt_news {

datetime = TEXT

datetime {

field = tt_news.datetime

strftime {

cObject = TEXT

cObject {

value = %m/%d/%y

lang.de = %d.%m.%y

}

}

}

image < plugin.tx_browser_pi1.displayList.master_templates.tableFie lds.image.0

title < plugin.tx_browser_pi1.displayList.master_templates.tableFie lds.header.0

}

}

}

}

}

image and title are configured by the Constant Editor.

image and title get the properties 0, 1, 2. That enables to set a link depending on the type of a news.

See the configuration at the

Constant Editor > Categories

[BROWSER - TEMPLATES - LIST - HEADER 0* (4)]

  • [BROWSER - TEMPLATES - LIST - IMAGE 0* (9)]
  • [BROWSER - TEMPLATES - LIST - URL 0* (9)]

File: Configuration/TypoScript/samples/tt_news/constants.txt

HTML snippets

Configuration/TypoScript/samples/tt_news/list/htmlSnippets.ts

plugin.tx_browser_pi1 {

views {

list {

1000 {

htmlSnippets =

htmlSnippets {

marker {

filter = TEXT

filter {

value (

<div class="filter">

###TT_NEWS_CAT.TITLE###

###TT_NEWS.DATETIME###

</div>

)

}

}

}

}

}

}

}

Single View

General

Configuration/TypoScript/samples/tt_news/single/setup.ts

plugin.tx_browser_pi1 {

views {

single {

1000 = tt_news: Sample

}

}

}

SQL

Configuration/TypoScript/samples/tt_news/single/sql.ts

plugin.tx_browser_pi1 {

views {

single {

1000 = tt_news: Sample

1000 {

// [String] Select clause (don't confuse it with the SQL select)

select (

tt_news.title,

tt_news.short,

tt_news.datetime,

tt_news.bodytext,

tt_news.image,

tt_news.imagecaption,

tt_news.imagealttext,

tt_news.imagetitletext

)

functions {

clean_up {

// Don't display fields as columns in the table

csvTableFields (

tt_news.datetime,

tt_news.imagecaption,

tt_news.imagealttext,

tt_news.imagetitletext

)

}

}

}

}

}

}

TableFields

Configuration/TypoScript/samples/tt_news/single/tableFields.ts

plugin.tx_browser_pi1 {

views {

single {

1000 {

tt_news {

// tt_news.datetime - tt_news.bodytext

bodytext = COA

bodytext {

// tt_news.datetime

10 = TEXT

10 {

field = tt_news.datetime

strftime {

cObject = TEXT

cObject {

value = %m/%d/%y

lang.de = %d.%m.%y

}

}

}

// devider: –

20 = TEXT

20 {

value = –

noTrimWrap = | | |

}

// tt_news.bodytext

30 = TEXT

30 {

field = tt_news.bodytext

}

stdWrap {

parseFunc < lib.parseFunc_RTE

}

}

image < plugin.tx_browser_pi1.displaySingle.master_templates.tableF ields.image.0

}

}

}

}

}

image is configured by the Constant Editor.

See the configuration at the

Constant Editor > Categories [BROWSER - TEMPLATES - LIST - IMAGE 0* (9)]

File: Configuration/TypoScript/samples/tt_news/constants.txt

Helpful suggestions

((generated))

Forum

If you have helpful suggestions, feel free to publish any question, bug or code snippet on

http://typo3-browser-forum.de/

Posts are welcome in English and German.

New Features and Bug Reports

You are welcome to post any question, bug or code snippet on TYPO3 forge.Here you find feature announcements and bug reports.See

http://forge.typo3.org/projects/show/extension-browser

Change Log

7.0.7 Feature * #i0155: link management: tt_news types 0, 1, and 2 are respected Improvement Proper Manual

7.0.6 Update Browser 6.x/7.x, TYPO3 6.x

3.5.0 Publishing Initial release

Illustration Index

Illustration 1: The page "Browser Sample II" with the Browser plugin and an extension template 5

Illustration 2: Browser plugin tab [Behaviour] 6

Illustration 3: Browser plugin tab [Plugin] > [List View] 6

Illustration 4: List view 7

Illustration 5: Single view 7

Illustration 6: List view with the search form, filter and both browsers 8

Illustration 7: List view without the search form, the filter and both browsers 8

Alphabetical Index

0 Optional: Needed only, if you like the HTML wrap of the Browser 4.x for the page browser.

18