Anfängerfragen zum Bootstrap Theme
Eingetragen von Viriditas (15)am 05.03.2016 - 13:45 Uhr in
Hallo zusammen,
ich habe mir jetzt mehrere Themes angesehen und Bootstrap 8 scheint hinsichtlich des responsive designs am besten zu sein.
Ich bin mir aber auch bewusst, dass es ein relativ komplexes Theme ist.
Wenn man nun ein Subtheme anlegt, muss man ja entscheiden, welches Paket man herunterladen möchte: CDN oder LESS.
Welches brauche ich? Ich möchte ganz einfach nur die Templates bzw. CSS mit einem Text-Editor ändern können.
Gibt es wo ein Tutorial, wie man einen Header mit dem Bootstrap Theme macht?
Ich habe schon ein bisschen probiert, eigentlich müsste man ja vor der Navbar einen Block anlegen für eine Headergrafik. Oder aber man arbeitet direkt im dafür vorgesehenen Template.
LG
- Anmelden oder Registrieren um Kommentare zu schreiben
schau mal da rein
am 05.03.2016 - 20:24 Uhr
https://www.youtube.com/playlist?list=PLUBR53Dw-Ef818EUxzNoWKcQ7PYUXpFFA
Grüße
Ronald
Zitat: Wenn man nun ein
am 06.03.2016 - 00:15 Uhr
Wenn man nun ein Subtheme anlegt, muss man ja entscheiden, welches Paket man herunterladen möchte: CDN oder LESS.
Nimm erstmal das CDN, damit kannst du genauso alles ändern, erstellen wie mit dem LESS.
Wenn dir nicht klar ist wie man mit LESS arbeitet, bringt es dir nur Schwierigkeiten am Anfang, du kannst aber jederzeit dein CDN auf LESS später umbauen falls du das mal lernen möchtest.
Um Bootstrap, besonders das Grid und alle vorhandenen Funktionen zu lernen kannst du dich auch hier einlesen:
http://getbootstrap.com/css/
Grüße Jenna
Hallo, ich danke euch, ich
am 06.03.2016 - 15:50 Uhr
Hallo,
ich danke euch, ich habe jetzt mit CDN ein Subtheme angelegt.
Ich habe jetzt auch unterschiedliche basic pages mit dem CSS von Bootstrap aufgepeppt.
Wie aber bekomme ich vor der navbar einen großen Banner rein?
Dazu muss ich ja ein Template bearbeiten. Ich habe mir deshalb aus dem Verzeichnis bootstrap/templates/system das Template page.html.twig kopiert und in mytheme/templates kopiert.
In die Datei habe ich testweise nach dieser Zeile...
<header{{ navbar_attributes.addClass(navbar_classes) }} id="navbar" role="banner"><div class="navbar-header">
folgenden Container gegeben:
<div class="jumbotron">Test</div>Allerdings ändert sich auf der Hauptseite rein gar nichts. Woran kann das liegen? Bin ich an der falschen Stelle oder habe ich nicht verstanden, wie man Templates editiert?
wie so oft, gibt es mehrere Wege
am 06.03.2016 - 16:47 Uhr
du kannst natürlich deine Templatedatei ganz normal bearbeiten, und dort etwas einfügen, was du geren immer dort hättest.
Oder du machst es auf dem Drupalweg.
Deklarierst eine passende Region, schreibst die entsprechenden css-codes im Stylesheet, und legst einen custom Block darin ab.
Der erste Weg ist quick and durty, und geht komplett an Drupal vorbei, und lässt sich somit auch nicht mit Drupal-Verwaltungsmitteln manipulieren.
Der zweite Weg erlaubt es, dass andere, die etwas Ähnliches wollen, dein Template benutzen können, und einfach einen eigenen Block einfügen können, oder auch du einfach das Banner tauschen kannst, indem due den Block austauschauschst, ohne das Templat anfassen zu müssen. Einfach aus der Verwaltungsoberfläche von Drupal heraus.
Grüße
Ronald
Danke, ich habe ja oben jetzt
am 06.03.2016 - 17:11 Uhr
Danke, ich habe ja oben jetzt meine eigene Template-Datei verwendet, aber wieso wird mir dann die Änderung nicht angezeigt?
immer, wenn du an einer Datei etwas geändert hast,
am 06.03.2016 - 18:16 Uhr
musst du die caches löschen ;-)
Grüße
Ronald
Ich war wirklich shcon am
am 10.03.2016 - 10:16 Uhr
Danke, jetzt funktioniert alles!
Ich habe jetzt einen Header vor die Navbar in der page.html.twig integriert:
<div class="container"><div class="container" style="margin-bottom: 0px; background:#183557; background-repeat: no-repeat; background-position: right; background-image: url(../drupal-8.0.4/hintergrund.png); ">
<img src="../drupal-8.0.4/logo.png">
</div>
</div>
Leider überlappt der Header, d.h. er schließt nicht bündig mit der Navbar ab (siehe Anhang). Ich habe es schon mit margin-right versucht, das hat aber keine Wirkung. Hat jemand eine Idee? Ich befürchte, die Klassenzuordnung für die div ist nicht die richtige, habe auch schon einiges probiert, hat aber bisher nichts funktioniert.
schau mal nach width
am 10.03.2016 - 10:01 Uhr
des containers
Grüße
Ronald
Eigentlich logisch, die sind
am 10.03.2016 - 10:12 Uhr
Eigentlich logisch, die sind ja auf 1170px, damit - auch wenn es ein Untercontainer ist, wird wieder die volle Breite genützt. Ich habe die class jetzt rausgenommen und die Breite stimmt jetzt. Danke.
Eine Frage noch: wie gebe ich die Bildverweise am besten an?
Mir ist aufgefallen, dass auf Unterseiten, die eine eigenen LInk bekommen wie "/about", meine Graphiken angezeigt werden, die ich mittels css (url../...) eingebunden habe.
Rufe ich dieselbe Seiten aber über die von Drupal vergebene Adresse (/node/...) auf, werden sie nicht angezeigt.
Das betrifft genau auch den Code des Headers wie oben angegeben, d.h. HIntergrundbild und Logo erscheinen auf den mit /node/... geöffneten Seiten nicht.
schau mal in der node.twig
am 10.03.2016 - 11:18 Uhr
ob da andere Klassen angezogen werden.
Grüße
Ronald
Hallo zusammen ;D Auf
am 10.03.2016 - 13:43 Uhr
Hallo zusammen ;D
Auf Drupal.org hab ich dieses Theme gefunden:
https://www.drupal.org/project/bootstrap
Vielleicht hilft es dir ja weiter ;D
Greetings
Bogus