Your Typo3 work area should look something like this:

In the screen shot you can see that there are 3 columns on the page.

• [1] The left most column, underneath the globe icon and the word Web, is Typo 3 information.
• [2] The second column, starting with the globe icon and the web site's name, is your web site's navigation information.
• [3] The third column is the work area
• [4] Clears the cache so that the latest version is displayed in the browser. Use before Save document and view page is pressed when editing a page or page content.
• [5] Use the logout button to close Typo3. Typo3 will remember your last work area and come back to it on the next log on.
• [6] That is you, the user who is working right now in the workspace.
• [7] Find your page by its ID number. If you are working with a lot of files this is much faster than scrolling and trying to find the file.

Work in TYPO3 usually runs from left to right: you select an option in the left-most column, select sub-options in the middle column if this is appropriate, and then actually do the work in the right-hand column.

This column helps you choose your work area. You will be mostly using the 'Page' option underneath the Web Title and the Task center option under the User Title.

You may see considerably less of the interface than this if the site administrator has decided that your access should be restricted. This is what a site administrator would see

There may also be additional options, depending on the extensions which have been installed, or which you are able to use.

In the Task center you can leave yourself or others notes and important information about your web pages.

Using the menu

Clicking on the word next to the icon opens up that information in the column 2 which is to the right of this current column and your website navigation column.

The task center is one section that comes in handy to leave yourself messages and reminders. You get there by clicking on the text [Task center] below User in the Typo3 column (1st column).
In the middle column you now have the Task overview information.
The right hand column by default opens up the Quick Note option. To save information here click the Update button.

in the left column rather than on the folder icon will open up the Navigation Column to the right which is a file tree view of your website.

[1] This is the Root of your Website and always has ID=0. The next line down is usually the first page of your website or your index/default page.

[2] Clicking on the plus sign expands the directory tree. Clicking on the minus sign contracts the directory tree.

[3] The red X on the white file folder icon indicates that this file is hidden and therefore not visible online.

[4] The plain yellow file folder icon indicates a file that is visible online.

[5] Clicking the icon with the 2 arrows refreshes the directory tree.

Hidden Page Icon

File Folder Icon

Refresh Icon

Note

Placing the mouse cursor over the yellow folder icon turns the cursor into a hand and below that a yellow rectangle with the folder or file's ID number and Alias if there is one (more on that later). As Typo3 is a database driven program, every folder and content section has a unique ID number assigned to it automatically. This makes it easier to keep track of information and also telling the program to link to a specific ID number can link information.

Note

In the left column (the Typo3 Module) clicking on the name of a folder works the same way as in Windows Explorer, it opens the page.

In the second column (the website navigation column) clicking on the folder opens up a pop up menu with different options/choices (click here to jump to an explanation of the choices). Clicking on the folder name, the word next to the folder opens up that page to be edited in the work area to the right.

The work area is where changes are made. The area will look different depending on your choices in getting here. Click on the word Page in the Typo3 column (left most column) under the heading Web

Then in the second column, the website navigation, click on the name of the file.

Clicking on the yellow file folder icon next to the page name and selecting edit from the drop down menu will have the same result.

Now you will be in the work area. The screen shot is the same as for editing existing content and it on the next page.