Das Web einfach erklärt

Wissen und Tipps zum eigenen Internet-Auftritt für jeden einfachst aufbereitet! Dein Mehrwert rund um Web-Lösungen und Sichtbarkeit im World Wide Web.

Joomla! Kategorieblog oder Hauptbeiträge - Spalten mit Bootstrap 3

Joomla! Kategorieblog oder Hauptbeiträge - Spalten mit Bootstrap 3

Damit die Spalten-Einstellung in Joomla! 3.x, welche man beim Menüeintragstype Kategorieblog oder Hauptbeiträge auch im eigenen Template mit Boostrap 3 greift, kann ein Template-Override helfen. Wie genau beschreibe ich in diesem Beitrag.

 

 

In den Menüeintragstypen Kategorieblog und Hauptbeiträge besteht die Möglichkeit eine Einstellung zu treffen, welche die Anzahl der zu verwendeten Spalten definiert.

kategorieblog spalten

Da Joomla! 3.x aber mit Bootstrap 2 arbeitet  und noch nicht mit Bootstrap 3, wird dies bei eigenen Templates mit Bootstrap 3 nicht automatisch funktionieren. Durch ein Template Override kann man dies aber "beheben". Zuerst schauen wir uns den Override für den Kategorieblog und danach für den Menüeintragstype Hauptbeiträge an.

Template Override für Kategorieblog Spalten mit Bootstrap 3

Hierzu benötigen wir einen Override der folgenden Datei:

components/com_content/views/category/tmpl/blog.php

diese Datei einmal kopieren und in folgendes Verzeichnis legen

templates/MeinTemplate/html/com_content/category/blog.php
(statt "MeinTemplate" verwendet man natürlich das aktive Joomla!-Template)

In dieser Datei dann folgendes anpassen:

Zeile 98-100:

 


            
            
 

 

 

ersetzen durch

 


            
            
 

 

 

 

Template Override für Hauptbeiträge Spalten mit Bootstrap 3

Hierzu benötigen wir einen Override der folgenden Datei:

components/com_content/views/featured/tmpl/default.php

diese Datei einmal kopieren und in folgendes Verzeichnis legen

templates/MeinTemplate/html/com_content/featured/default.php
(statt "MeinTemplate" verwendet man natürlich das aktive Joomla!-Template)

In dieser Datei muss dann folgendes angepasst werden:

Zeile 59-62:

 


        
            
spancolumns); ?>"
                itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">

 

ersetzen durch

 


        
            
col-md-columns); ?>"
                itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">

 

 

 

Jetzt kann man mit Spalten arbeiten

Nun kann man loslegen und dank Bootstrap 3 diese Spalteneinstellung nutzen. Einfach einstellen wieviele Spalten man haben möchte und schon funktioniert das ganze - auch Responsive.

Kostenloser E-Mail Kurs:

In 5 Schritten zu mehr Website Traffic

Diese 5 Profi-Tipps verhelfen dir zur Optimierung deines Website-Traffics!
In diesem kostenlosen E-Mail Coaching bekommst du von mir 5 Tage lang Profi-Tipps für eine enorme Steigerung deiner Website-Zugriffe.
Klicke jetzt hier und hole dir diesen Kurs.

 

 


 

So bleibst du TOP-Informiert!

Wir schreiben laufend interessante Artikel mit rund um das Thema Internet, Websites, Social Media, uvm. Bleibe am laufenden und verpasse nichts!

Warum Sie eine Website benötigen
Chrono Forms Felder Responsive
 

Kommentare 2

Gäste - Admin Kita am Mittwoch, 16. August 2017 22:18

Hallo Herr Lackner,

hat es einen Grund warum die eigentliche Info in diesem Beitrag nicht vorhanden ist? Ich suche gerade eine Lösung für dieses Problem, um die Website unserer Kita (Ehrenamtliches Projekt) auf Vordermann zu bringen.

Über eine Info würde ich mich freuen.

Hallo Herr Lackner, hat es einen Grund warum die eigentliche Info in diesem Beitrag nicht vorhanden ist? Ich suche gerade eine Lösung für dieses Problem, um die Website unserer Kita (Ehrenamtliches Projekt) auf Vordermann zu bringen. Über eine Info würde ich mich freuen.
Joachim Lackner am Donnerstag, 17. August 2017 08:07

Hallo!
Oje da müssen wir uns entschuldigen - hier gab es ein Problem mit der Code-Ausgabe. Habe ich soeben behoben. Nun sieht man diesen wieder.
Vielen Dank aber für den Hinweis.
Wenn ich sonst noch helfen kann, dann bitte einfach melden.

Hallo! Oje da müssen wir uns entschuldigen - hier gab es ein Problem mit der Code-Ausgabe. Habe ich soeben behoben. Nun sieht man diesen wieder. Vielen Dank aber für den Hinweis. Wenn ich sonst noch helfen kann, dann bitte einfach melden.
Bereits registriert? Hier einloggen
Gäste
Sonntag, 19. November 2017

Kostenloser Kurs:

Website Traffic Optimierung E-Mail Kurs

In 5 Schritten zu mehr Website Traffic
Die 5 effektivsten Wege zur Optimierung der eigenen Website-Performance!
Diese 5 Profi-Tipps verhelfen dir zur Optimierung deines Website-Traffics!

Jetzt E-Mail Adresse eintragen und starten: