Web Programming 12) Typo3 a PHP CMS

Web Programming12) Typo3 a PHP CMS

Emmanuel BenoistFall Term 2013-14

Berner Fachhochschule | Haute cole spcialise bernoise | Berne University of Applied Sciences 1

A CMS called Typo3

3 parts

Author and administrator of a web site

How to implement a new template

Programming for typo3


Management of a Web Site

Old Web Site Content Management

DreamweverFrontpage... (emacs)

HTML FileFTP Transfert

Web Server


What is a Content ManagementSystem (CMS)?

Web server

Admin−interface

Browser

Administrator

Browser

User


What is a Content ManagementSystem (CMS)?No More HTML

The look is centralized

We use “templates”

Redactor concentrates on his business

Redaction

Translation

Collection of data

Advantages

Web site easier to manage

Look centralized

Nobody cares about layout apart from the professionals


Typo3

An Open Source CMSBased on Open source technologies

Unix or Windows

Apache

PHP

MySQL

Totally free

Doc online http://www.typo3.org

Mixed CMS

Used to maintain an arborescence of pages

Application can be developed to build a portal


The three columns of Typo3

First ColumnThe main modules

Page, View, List, Info, Access, Functions, Filelist, Images

Second ColumnThe main tree (or forest)

1 tree represents the “context portals”

The branches are the element of the menu

Click on the name of a node : the node is displayed in thethird column

Click on the icon : a local menu is displayed


The three columns of Typo3 (Cont.)

Third ColumnThe Work Space

Depends on the module and the node in the tree

Contains some icons:

Disket : savePencil : editTrash : deleteX : close (without saving)X and disket : close and save...


Basis TasksEdit an existing page

Click on module “page”

Select your page

The content of the page appears in the work area

You can add, update or remove content

You may insert content in the “normal” part of the page

At any time, see a preview with the magnifying glass

Insert a new content element

Click on the “new record” icon

Choose a “typical page content”

Fill the content of the fields : header and text

Validate with the icon: save and quit (X and a disket)


Basis Tasks (Cont.)

Upload an image

Rename your file (locally)

Select the “Images” module

Select your directory on the server

Click on the icon of the directory,

choose upload in the menu

Select your file

Insert an image in a page

Insert a new content element containing an image

(or change the content element type)

Select the already uploaded image in your directory


Basis Tasks (Cont.)Insert Elements in the news column

In the page module, select your page

In the “Right” column, insert your content

Insert a new element (select any type)

Change the type to “Insert records”

Once done, choose a name for the rubric (news for instance)

Select the news to display :In Items,Click on the folder iconIn the pop-up window, select “Aktuell” sysfolderChoose the news you are interested in.

The size of the main column will be adapted automatically.

Insert in the last column

Do the same in the “Border” part of the page


Administration TasksCreate a new page

Select the page where you want to insert your new page

Click on the icon of the file

In the menu select “new”

Choose insert inside (as a child)

Or insert after (as a brother)

Unselect Hide, or you won’t be able to see it (this can bemade after the page has been finished).

Input Title (used in the menu)

Input subtitle (appears as a title inside the page)

Insert content elements in the columns.

Create a version in another language

Do the same as for a new page, but select “Alternative PageLanguage”

You can display all languages in one version of the page mode.


Back End user managementBack End Users

Autors

Login: http://www.yourSite.com/typo3/

Have a specific menu

Have a restricted set of fields

Admin creates users

In the list Menu, choose the root of your site (with theearth).

You see the list of back end users and back end groups.

One can create a new user.

Admin users have all the power (can see everything and doeverything)Other users belong to groups


http://www.yourSite.com/typo3/

Back End user management (Cont.)

BE Users Groups

Contains the menu for the members

Contains the elements to be shown

The tree that has to be displayed

A file mount point

Users and groups

A user can be in more than one group

For instance menu items and root can be in two groups


RightsVery similar to Unix right management

Each page has one owner and one group

The rights can be set for the owner, the group and the restof the world.

Rights

represented by stars (* = OK) and times (× = NO).for instance

owner ***** adminGroup ***×* HTIEverybody *××××

Symbols correspond to:

Show page: Show/Copy page and content.Edit content: Change/Add/Delete/Move content.Edit page: Change/Move page, eg. change pagetitle etc.Delete page: Delete page and content.New pages: Create new pages under this page.


Rights (Cont.)

The Access menu

Choose the page you want to see

Possible to access to all the pages in one subtree (using adepth parameter).


Insert Special Content

E-mail Form

In a page, insert a new content element (text for instance)

Change its type to plugin.

Select the sort of plugin: form

Configuration is a bit complicated

Should use the wizard

. . .


Front End UsersFor restricted access

User needs to be identified to be allowed to see something

Username password

How To Create users

Create a page for the login (use the login content type)

Choose the page to go from there

Create a new page whose type is Sysfolder anywhere in thetree (usually near the root).

Click on the icon of the sysfolder and choose new, thenselect Website user or Website user group

Protect a page (or a branch)

Select the page, Click on Edit page header

Select the group for which this page is

Click on include subpages


Extensions

Categories of extensions

Backend Program started on the server

Backend Module Can be used as menu items on the left

Frontend Change the display of the web site

Frontend Plugins Can be inserted in any page by a BE user

Miscellaneous

Examples

Install an extension

Search online which extension is interresting

Select the desired package


The Data Base that hides behindTypo3

Main tables

page contains all informations about pages

pages language overlay same informations for thealternative languages

tt content contains all the contents of the pages.

be users Back end users (authors)

be groups

fe users Front End users (visitors for pages with restrictedaccess)

fe groups


Conclusion (CMS)

A lot of different CMS’s on the marketWritten in PHP with a DBWritten in Java with a DBWritten in Java with XML filesWritten in C++ and proprietary solution. . .

PrinciplesContent can be edited by anyoneTemplate must be easy to integrateNew functionalities can be implemented using a given API


Conclusion (Web Prog.)

Principles:HTTP Request and ResponseSession / Cookies / FormsMulti-layers Architecture

PHP one of many technolgiesJava EE : JPA + JSF + TomcatMicrosoft : .NET +IIS + MS-SQL Serverother technologies: Ruby, Python, Perl, Groovy and Grails, . . .


Documents

Web Programming 12) Typo3 a PHP CMS