New Features


To top


Dynamic content overview - Card Layout

News and Agenda items are usually displayed in what is called a Dynamic Content Overview. The news / agenda feed on your page is one as well. There are several overview templates available, but there was great demand for a template that displayed the search results in a card layout. This has now been introduced, an example can be seen on the right.

Also, check out more Card Layout display options!

Styling is determined by the available content of the result pages, as well as custom settings in the overview element. All card variations (normal, half height, horizontal, and horizontal half height) are available to choose from, as well as the number of results per row.

Because the overviews are difficult to set up properly, changing from your current template to this new template is not done by editors. Please contact your local content manager to apply for this overview template.

TU Delft Pre-University Team Wins SEFI Francesco Maffioli Award

TU Delft Pre-University Team Wins SEFI Francesco Maffioli Award We are proud to announce that Volkert van Steijn and his diverse team of colleagues have been awarded the Francesco Maffioli Award of Excellence for Developing Learning and Teaching in Engineering Education by the European Society for Engineering Education (SEFI). This prestigious recognition honours TU Delft’s work on the Pre-University program, designed to ease the transition from secondary school to university-level chemistry. Addressing key challenges for prospective students Modelled after the successful Pre-University Calculus and Pre-University Physics courses, the Chemistry course designed by Volkert and his team, addresses the common challenges faced by students when entering higher education. These challenges include the academic leap from high school to university, misunderstandings about the level of study, and the interconnectedness of the subjects Calculus, Physics and Chemistry, required for a degree in science or engineering. Launched by the Faculty of Applied Sciences in 2022 in collaboration with the Extension School for Continuing Education and edX, the course helps prospective students navigate university-level chemistry and make better-informed decisions about their study choices. Bridging the gap The full Pre-University program builds on the core scientific and mathematical subjects taught at the secondary school level, integrating them in ways that reflect the more formal and intertwined approach of engineering education at a technical university. To ensure accessibility, the courses are available online year-round and divided into flexible modules, enabling students to focus on specific areas based on their preparation needs and degree choices. Personalised learning By offering interactive elements and an easy-to-navigate structure, the Pre-University program engages learners from all over the world helping students transition smoothly into university education. The ongoing success of these MOOCs has the potential to shape more differentiated and personalised learning experiences in the future. In combination with the matching of our study programs, prospective students may receive personal advice on how to use the Pre-University program for a confident study start. Volkert Steijn, the lead of the project team for the Pre-University Chemistry course, expressed his pride in receiving the award: I am incredibly proud to accept this award on behalf of our entire Pre-University team. It is a wonderful recognition of the hard work and dedication we put into this program, and we hope it will continue to benefit students for years to come. ― Volkert van Steijn - Associate Professor Commitment to supporting future engineers and scientists This recognition highlights TU Delft’s commitment to curriculum development, innovative teaching methods, and support for future engineers and scientists. By providing students with the tools and knowledge to begin their academic journey with confidence, the Pre-University program is a valuable resource for learners worldwide. The Extension School offers these courses as part of their commitment to improving TU Delft’s education and have better prepared students to start their Bachelor programs. For more information on the Pre-University program, visit the website of the extension school: Pre-University Courses Heartfelt congratulations to everyone in the team! Dr. Volkert van Steijn, Dr. Cristiano Glessi, Dr. Robin de Kruijff, Dr. Rienk Eelkema, Drs. Laura Janssen, Dr. Wilma Elston, Drs. Carola van Muren, Dr. Bijoy Bera, Yash Divekar, Cees Breevaart, Stefan van der Griend, Bonny Klop, Jisca Barbian and of course all the colleagues & students involved in the Pre-University Calculus and Physics courses. Additional Highlights from the SEFI Annual Conference: TU Delft Representation During the SEFI Annual Conference, the board announced that Annoesjka Cabo had been elected to join the SEFI Board of Directors. Annoesjka Cabo, Director of Education at the Faculty of Electrical Engineering, Mathematics and Computer Science (EEMCS), Academic Director of the Teaching Academy, and Full Professor of Statistics for Innovation in Education, will represent TU Delft in this distinguished role. SEFI (European Society for Engineering Education), established in 1973, is one of the largest organisations in Europe dedicated to advancing engineering education. It promotes collaboration between higher education institutions, educators, and students, enhancing the quality of engineering education through innovation in teaching, research, and policy development. In addition to the board announcement, the SEFI Francesco Maffioli Award of Excellence was presented at the same event. The award, named after former SEFI president Francesco Maffioli, honours individuals or teams who contribute to advancing engineering education. It recognises excellence in curriculum design, learning environments, and teaching tools that engage students and improve educational outcomes. Know one of the people involved? Congratulate them on LinkedIn Know one of the people involved? Congratulate them on LinkedIn linkedin

Indian Institute of Technology Delhi and the Delft University of Technology collaborate to advance sustainable fuel technologies

Researchers from the Indian Institute of Technology Delhi (IIT Delhi) and the Delft University of Technology (TU Delft) have collaborated to advance sustainable fuel technologies through a joint project focused on bio-oil upgradation. The project, titled Bio-oil Upgradation to Fuel Range Hydrocarbons via Integrated Hydrodeoxygenation and Aqueous Phase Reforming, is being led by Prof. Sreedevi Upadhyayula from IIT Delhi and Dr. Atul Bansode from TU Delft, with support from both institutions under the MFIRP initiative. The primary objective of this collaboration is to develop a sustainable method to convert lignin-derived bio-oil into valuable fuel-range hydrocarbons using catalytic processes. The work focuses on reducing the need for external hydrogen donors and freshwater by utilizing the bio-oil’s inherent compounds, which contributes to cleaner and more economically viable bio-refineries. A key aspect of the research has been the integration of Aqueous Phase Reforming (APR) with Hydrodeoxygenation (HDO). APR, which converts bio-oil components into hydrogen and hydrocarbons with water as a solvent, is performed at relatively low temperatures and is essential for hydrogen generation. The hydrogen produced in this process can then be used to support HDO, which efficiently removes oxygen from bio-oil to create fuel-range hydrocarbons. The results from APR have been particularly promising. TUD work reported that using platinum-based catalysts, APR successfully achieved up to 60% conversion of maltose, a model compound with 42% hydrogen selectivity (Figure 1). Conversion and selectivity are based on analysis of only gaseous products. Whereas, for HDO reaction, the FESEM analysis, (Figure 2) revealed the enhanced surface morphology and dispersion of active sites in Cu-Re-SiO₂ catalysts after reduction, which significantly improved the catalytic performance and stability in bio-oil conversion processes. The collaboration also involves reciprocal visits between the two institutions to facilitate knowledge sharing and advance experimental setups. Prof. Upadhyayula visited TU Delft, where discussions on the project's future directions were held while Dr. Bansode is set to visit IIT Delhi. The two teams have already begun joint publications, including a book chapter titled “Pyrolysis Bio-oil Upgradation to Fuels”, set to be published in 2024 along with journal articles. The project’s long-term goal is to contribute to the global shift toward sustainable energy by offering alternatives to fossil fuels and reducing environmental impact. The research findings have potential applications in both Europe and India, particularly in lignin-abundant industries such as paper and ethanol production. Figure 1. % Product Selectivity for all four screened catalysts Figure 2. Field emission scanning electron microscopy microstructure image of catalyst after reduction (a) Cu-SiO2 catalyst (b) Cu-Re-SiO2 catalyst

To top


Tabs as Grid Elements

What changed?

Tabs were difficult to manage, especially when you wanted to re-use and swap content from other pages. Therefore, the tab element has been redesigned for a more user-friendly interface, a better overview of the embedded content, and the added possibility to cut/paste and reference elements in it.

The old Tab element still exists and is not automatically replaced, but will be phased out. For this purpose, the old version has been disabled for editing. In the following weeks, we'll be changing all existing Tab Elements to Tabs Grids. Should you however come across an old Tab Element and you find yourself unable to edit it, please contact your local content manager.

How can I create a new Tabs Grid?

Tabs Grids are created like all other grids. When creating a new element, under Grid Elements, select Tabs grid. This will place a grid on your page with 5 rows, each row representing one of the tabs.

  • The Header in the first element of each tab will also be the title of that tab. So for instance, in this case, the Header of this text element ('How can I create ...') is adapted as Tab title.
  • You can select a colour theme by editing the Tabs Grid properties; under Appearance, select a theme (see fig.)
  • If you don't put any content in a tab, it will be invisible.

 

Any tips and tricks?

When you don't want to start a tab with a header (for instance, when it's an image), you still need to tell Typo3 which title to use for this tab. You can do so by creating a 'Header Only' element, and under Type, select 'Hidden'. This will not show the header inside your tab, but it will be adopted as Tab title.

 

To top


Youtube video in Header Slider

It is now possible to put a video in the Header Slider on top of any page. 

If you want to add a Youtube video to your header-slider, just paste the youtube URL in the link field of a slide; a play button will be shown on your slide, and a pop-up style video will play when the button is pushed.

Like all slides, this feature also requires you to upload an image.

To top


Full Width page template

This page combines the regular Content page with the Homepage. Its features are identical to the Homepage format in many ways, but it adds the bread crumb on top, so visitors can easily find their way back.

This layout was frequently created with a workaround (Content Page with Left Column, combined with specific element settings), which is why an official option has been included instead. 

To create this layout, go to the page properties, under Appearance, select the Backend Layout 'Content page that is full width'.
(feature renaming can hopefully be included in our next release)

This page is actually an example of this layout. Click 'To Top' to view the breadcrumb.

To top


Special Page template

This is another new page template (see: Full Width page template). This layout is designed for a long-read format, by dividing the screen in two halves; the left one is designated for images, the right one for all content. There is also a special connection between picture and content, enabling a nice scrolling experience.
Try it out!

This layout is particularly useful for magazine-style pages.

To create this layout:

  • go to the page properties; under Appearance, select the Backend Layout 'Special Page' (see fig.).

  • On this new page, create a new element; under Grid Elements, select Special Container (see fig.). This grid consists of two columns.

  • In the left column, you place a 'Special Image' element.
    This is the image that is displayed stationary alongside the scrolling content on the right; when the visitor is at the end of the content in this Special Container, the image will scroll up, and display the next Special Container.

  • In the right column, you place a normal 100% Grid element.

  • In the element properties of this Grid Element, under Appearance, select 'Used for content on special pages..' (see fig.).

  • Inside this 100% grid, you can place all elements to your liking.

The last steps, creating a 100% grid, are necessary to create the Special layout as it was designed. This element layout compresses the width of the elements within - otherwise, the text would run the entire width of the column.

 

To top


Facts and Figures element

This is a new element to display, for instance, facts and figures.

To create this, add a new Fact element inside a grid. Under Theme, select the header colour.
Then, edit the grid properties, go to the tab Appearance, and choose a background colour under 'Theme'.

Please note: the fact element only properly works in combination with this coloured grid background.

What is the coolest new feature?
Fact Element
How many features are in this new release?
40
Number of new features
11

To top


Coloured grid background

The background colour feature for grids can also be used without a fact element. It may for instance be useful for magazine-type pages, to highlight a specific text.

Two layout guidelines:

  • Dont overdo it! These coloured grids are very dominant. Don't create an abstract piece of art.
  • See if you should add top and bottom margins (under Appearance), to prevent the grid from overlapping with other elements. 

To create this, edit the grid properties, go to the tab Appearance, and choose a background colour under 'Theme':

To top


Notification element

This element can be used to draw attention to a certain part of your website, or a call-to-action (for instance, when an application deadline is approaching). You can add one or two buttons. The element is available in all TU Delft theme colours.

To create this, add a new Notification element. Enter a header, text, and theme, and, optionally, one or two buttons. The buttons can either be white or transparent.

Notification element

These are not the only release notes; they are only the new elements. Check out our improvements and bug fixes!

Improvements Bug fixes

To top


Read More-toggle

This option allows you, in a Text element, to hide paragraphs under a 'read more'-line (as seen below).

To create this, in the Rich Text Editor (RTF) of the Text element, stand in the text on the desired location. Click on 'Insert Custom Element', then 'Tudelft', then 'Insert Readmore'. An orange marker will appear in your text.

To demonstrate this, a piece of literary history:

Alice

There was a table set out under a tree in front of the house, and the March Hare and the Hatter were having tea at it: a Dormouse was sitting between them, fast asleep, and the other two were using it as a cushion, resting their elbows on it, and talking over its head. ‘Very uncomfortable for the Dormouse,’ thought Alice; ‘only, as it’s asleep, I suppose it doesn’t mind.’Read more

The table was a large one, but the three were all crowded together at one corner of it: ‘No room! No room!’ they cried out when they saw Alice coming. ‘There’s plenty of room!’ said Alice indignantly, and she sat down in a large arm-chair at one end of the table.

‘Have some wine,’ the March Hare said in an encouraging tone.

Alice looked all round the table, but there was nothing on it but tea. ‘I don’t see any wine,’ she remarked.

‘There isn’t any,’ said the March Hare.

‘Then it wasn’t very civil of you to offer it,’ said Alice angrily.

‘It wasn’t very civil of you to sit down without being invited,’ said the March Hare.

To top


Image side caption

An option has been added to display a caption next to an image. This was a feature in the original design, and works well in storytelling articles.

To create this, go the the element properties, under Appearance, and choose 'Image fullwidth with caption'.
On the General tab, under Description, fill in the caption text.

The caption can now be placed next to the image.

To top