News System
List- & Detail-View für EXT:news
Für die List- und Detail-View der EXT:news, habe ich für Bootstrap 4 optimierte Templates erstellt.
Diese werden eingebunden, wenn die EXT:news installiert/aktiviert ist und in der EM config "Extension news" aktiviert wurde (default).
Danach stehen weitere "Template Layouts" (s. Screenshot) zur Verfügung.
Ajax Pagination: Wenn die EXT:typoscript_rendering installiert und aktiviert wurde!
Hierfür muss die EXT:news muss unter "Statische Templates einschließen" vor t3sbootstrap eingeschlossen werden.
BTW: Mit dem Plugin "Content Consent" kannst du auch in den News-Items unter "Content Elements" Youtube Videos datenschutzkonform einbinden!
Im Template "BS4: Detail view" wird der News-Titel mit einem h1-Tag ausgegeben!
Templates auslagern:
Wenn du Tempaltes für die EXT:news auslagern möchtest, dann musst du folgendes in dein Setup schreiben:plugin.tx_news.view.templateRootPaths.2 >
plugin.tx_news.view.partialRootPaths.2 >plugin.tx_news.view.layoutRootPaths.2 >
Ansonsten würden die Tempaltes aus der EXT:t3sbootstrap greifen!
Wenn du die News-Templates der EXT:t3sbootstrap weiterhin nutzen möchtest, dann kannst du dieses mit folgendem Setup umsetzen:
plugin.tx_news {
view {
templateRootPaths {
3 = fileadmin/Resources/Private/Extensions/news/Resources/Private/Templates/
}
partialRootPaths {
3 = fileadmin/Resources/Private/Extensions/news/Resources/Private/Partials/
}
layoutRootPaths {
3 = fileadmin/Resources/Private/Extensions/news/Resources/Private/Layouts/
}
}
}
Folgende Konstanten stehen im Konstanten-Editor zur Verfügung:
bootstrap.ext {
# Info (list view): zeigt Info (Datum, Kategorien) in List-Ansicht.
news.list.info = 0
# Image ratio (list view): z.B.: 16:9, 4:3 - oder 0.
news.list.imageRatio =
# Utility class für den "more-button" in der List-Ansicht.
news.list.buttonClass = primary
# Image mobile overlay (list view): wenn < 576px nur für Card-Templates.
news.list.imageOverlay = 1
# Loading Spinner Position (list view): with ajax pagination.
news.list.loadingSpinnerPosition = top
# Info (detail view): zeigt Info (Datum, Kategorie, Tags, Autor) in Detail-Ansicht.
news.detail.info = 1
# Image ratio (list view): z.B.: 16:9, 4:3 - oder 0.
news.detail.imageRatio =
# Lightbox (detail view): aktivieren für Detail-Ansicht.
news.detail.enableLightbox = 1
# Utility class für den "back-button" in der Detail-Ansicht.
news.detail.buttonClass = primary
# Teaser class (detail view): z.B.: "lead" oder jede andere.
news.detail.teaserClass = lead
# Carousel (detail view): zeigt Bilder im Carousel, wenn aktiviert und mehr als ein Bild.
news.detail.carousel = 1
# Breite für linke Spalte (detail view):
news.detail.leftGrid = 7
# Media oben (detail view): zeigt Bild oder Video oben, über dem Text.
news.detail.mediaOnTop = 0
}
Demo:
Beispiel: List Group

News 2
