Home > Enterprise >  How to customise content elements in typo3?
How to customise content elements in typo3?

Time:10-26

I have just begun my Typo3 journey. There is not much typo3 content available over the internet. I have gone through its documentation. As far as I have understood it, the ideal way of creating a website (frontend) is using content elements from backend and customising it according to our need in code (using CSS). My Question is how can I do so? How can I find the code of all my used content elements so that I can use my own CSS to style it according to my need? Or is there any other ideal or professional way of creating a webpage that mostly developers use? Please please help me with my questions.

THANK YOU IN ADVANCE :)

CodePudding user response:

I suggest to look into one of the following 2 extensions which allow to create content element types within a nice backend module:

Both come with a manual and it is afterwards easy to adopt the based default templates and apply the HTML you need

for the page structure I suggest to use something like https://jweiland.net/typo3/typo3-template-version-11.html or the bootstrap package https://www.bootstrap-package.com/ which also come with various custom content elements already

if you are german speaking you can also take a look at the video tutorials of wolfgang wagner which can be found at https://wwagner.net/

CodePudding user response:

The base frontend structure of a TYPO3 websites is:

  • page templates (usually contain generic elements such as header, footer, navigation.
  • page templates can be devided into serveral sections if needed
  • content elements which are than displayed in this sections / in
    templates

The core already ships a set of common content elements and supplies basic CSS styling which you can override and adjust.

I prefer to check what kind of content elements I might need in order to get the website layout done and then build those custom elements. This gives full control over the HTML markup output and I can write my custom CSS specifically for my markup. This approach might need more initial work and requires a deeper understanding of the system, but often pays off in the end.

But if you want to see quick results as a beginner the approaches Georg mentioned with Mask or the bootstrap package are perfectly fine.

  • Related