Zum Inhalt springen

Free TYPO3 template (sample project)

Book our hosting package and use a ready-made website straight away. We have installed a current TYPO3 website as a template for your own content in all our hosting tariffs. There is also an 'empty' TYPO3 installation for your own projects and a template for other websites.

TYPO3 Version:8 LTS

Note: Newer version of the template project available!

A newer version of the TYPO3 template is based on TYPO3 10 LTS. For new projects the latest version of the TYPO3 template should be used.

With the free TYPO3 template, you can start creating content immediately and your website will be online in no time. So you don't have to worry about design, templates or TypoScript for your own site.

View the live version of the sample project here

You can customize the template and extend it with additional functions, for this we have easy-to-understand video instructions created.

The template offers:

  • Responsive web design, suitable for desktop, smartphone and tablet
  • Optimized for search engines
  • prepared for accessibility
  • Examples for all standard content elements
  • optimized for short loading times
  • State-of-the-art technology
  • Visually and functionally customizable

It can be used as a basis for your own website and represents a "best practice" that shows how to set up a TYPO3 project. It is not intended to be a design template, but a project template in which the design can be adapted to your own ideas.

We have deliberately kept the sample project very lean and only pre-installed the most frequently used functions:

  • Display of current news (extension: news)
  • Search engine friendly, readable web addresses (extension: realurl)
  • Support for search engine optimization of the website (extension: cs_seo)
  • Lightbox effect for the click enlargement of images (extension: cl_jquery_fancybox)

The sample project is based on TYPO3 LTS version 8.7, which means that it can be operated without a relaunch until at least the end of March 2020. With the extended support (Extended Long Term Support, ELTS) provides updates and support until the end of March 2022.

Why did we develop the template? Answers can be found in theHistory of the template.

What does the sample project cost?

The Musterprojekt is included in the price of all new

TYPO3 hosting packages from jweiland.net and is already pre-installed.

What about updates?

The project is under continuous development. The current version of the template v8 from 18. Oktober 2018 is based on TYPO3 version 8.7.30 and is automatically available in the hosting package.

Example websites based on our sample project

Overview, functions, differences to previous versions

We have fundamentally revised the sample project. The most important differences and new features are

  • Encapsulation of all files in a separate template extension (sitepackage)
  • own, lean grid CSS
  • different navigation variants, easily switchable in the backend
  • Various page layouts
  • Lightbox effect for images
  • internal search (indexed_search)

More information in the following video:

Install the sample project yourself

In the following video, we show you how to install the sample project for TYPO3 8 LTS yourself in just a few minutes.

The prerequisite for this is that you log in to the web server via SSH. We show how to do this in separate video instructions for Windows(Putty, MobaXterm), Linux and Mac users.

Online documentation in the backend

The video instructions for the sample project can also be viewed directly in the TYPO3 backend.

Navigation variants

The sample project for TYPO3 8 LTS comes with 3 navigation variants and 4 color schemes. These can be easily selected using the constant editor.

Using page layouts

The sample project comes with 4 different page layouts that can be switched via the backend layout.

Maintaining the contents of the footer

The footer area of the layout can be filled with any content elements. These appear automatically on every page.

The template extension at a glance

The TYPO3 8 LTS sample project is implemented as a template extension (sitepackage). In this video you can see how the files are organized in this extension.

The background image in the header area

The page properties can be used to define an image that is displayed in the header area of the page. It is important to define the dimensions of the image correctly using the constant editor. Optionally, inheritance to subpages can also be activated.

The options in the constant editor

Some important settings can be made in the TYPO3 8 LTS sample project directly in the constant editor. For example, you can easily change the logo, change the (company) name for the footer or switch between different navigation variants.

What functions does the cs_seo extension have?

A few extensions are already pre-installed in the TYPO3 8 LTS sample project, including cs_seo. This can help with the on-page search engine optimization of the website.

Allow indexing of the website by search engines

As soon as your site goes online, it should of course be visible and indexable for search engines.

During the development of a site, however, this is often not wanted. That is why we have deactivated the indexing of the website by search engines such as Google, Bing & Co. by default via a file called robots.txt.

Once you have finished making adjustments to the sample project and the website goes online, you must therefore carry out the following steps.

  1. In the project directory of your website (e.g. typo3cms/muster-8lts/) you will see the robots.txt file. Delete this file (or rename it, e.g. robots.txt_alt)
  2. In the same directory you will see a file allow_robots.txt
  3. Rename this file to robots.txt

To edit the files, you can either connect to the web server via SSH or use an FTP program such as FileZilla, Cyberduck, Transmit or WinSCP.

Marking a page in the page tree

The page "Important information - Please read" is highlighted in color in the page tree of the backend.

This highlighting can be set up via User-TSconfig.

In the file EXT:jwmusterprojekt8/Configuration/TSconfig/User.txt you will find the corresponding passage in lines 11-13.
The color is transferred as a hexadecimal code to the page ID, in our case ID 28.

Tip: As the color specification is also inherited by any existing subpages, you can mark entire page tree sections in color.

options {
  clearCache.system = 1
  ## TYPO3 8
  clearCache.all = 1
  pageTree.showPageIdWithTitle = 1
}

TCAdefaults.tt_content.filelink_size = 1

##Color for background in page tree "Important information"
options.pageTree.backgroundColor {
  28 = #ff9696
}

Add more languages

The sample project is already prepared for multilingualism. German is defined as the default language, English as an additional language.

Of course, additional languages can be added as required. This requires 3 steps:

  1. Create an additional language in the backend
  2. Adapt the TypoScript configuration of the language and the language menu
  3. Adapt the configuration of the RealURL extension to generate readable, search engine-friendly URLs.

You can see all 3 steps in the following video tutorial:

Replace favicon

Favicons are small images that are displayed in the browser title bar, for example. A company logo or similar is usually used here.

The sample project is prepared for the use of individual favicons. It also creates touch icons for smartphones and tablets.

In this video you can see how you can integrate your own icon into the sample project.

Supplement

If the favicon or the touch icons are not displayed correctly despite clearing the caches, it will probably help to force the recalculation of the images by deleting the images already created.

To do this, go to the install tool -> "Clean up" -> "Clear processed files" and click on the corresponding button.

This page contains automatically translated content.

Updated: 17.07.2024