Trenner zwischen den Kategorien im Header?

Shopware 5 Themes & Design
1

Hallo zusammen,

gibt es die Möglichkeit einen visuellen Trenner zwischen den Kategorien im oberen Menü anzubringen? 

Ich denke da an eine feine Trennlinie oder einen größeren Abstand zwischen den Bezeichnungen.

Danke für Eure Tipps :slight_smile:

Andrew

2

So wie oben hier im Menü oben? 
Jo - CSS anpassen, in dem Fall also per eigene LESS im eigenem Theme.

Grob: Dem

  • Element ein Border-right verpassen, und mit Lastchild dem letzen Element wieder den Border wegnehmen.
    Fertigen Code gibts aber nicht  broken heart
3

Danke für die Antwort. Genau das meine ich :slight_smile: Das eigene Theme habe ich bereits, aber da habe ich die Umsetzungen mit Hilfe von Anleitungen vorgenommen  smiley

Bin leider total echt eine Niete was Umgang mit Code angeht. Könnntest du mir evlt. einen Tip geben, welche Datei für die Änderung im eigenen Theme angelegt/verändert werden muss? Dann kann ich weiter nach CSS Code suchen :slight_smile:

4

Ich gehe mal davon aus, dass Du in den DevDocs nachgeguckt hast, wie man sich sein eigenes Theme erstellt und anpasst.

Im Responsive ist die _modules/main-navigation.less für das Mainmenu zuständig. Du musst nicht, solltest aber die gleiche Struktur beibehalten.
Eingebunden wird sie in Deiner  all.less - da also der Eintrag  

@import "_modules/main-navigation";

in Deiner Datei „main-navigation.less“ machst Du Deine Anpassungen - nur die Anpassungen, nicht die ganze Original-Less kopieren.

Eine mögliche - nicht getestete - erste Version könnte sein:

@media screen and (min-width: @tabletViewportWidth) {
	.navigation-main {
		.navigation--list {
			.navigation--entry {
				border-right: solid 1px red;
				&:last-child {border:0; }
			}
		}
	}
}

Da musst Du dann experimentieren - und nicht vergessen: nach jeder Änderung Theme neu kompilieren.

Die main-navigation ist aber nur für den horizontalen Menüteil zuständig, dass dann aufgeklappte Megamenü ist unter plugins im Theme zu finden.
zu LESS:

http://www.lesscss.de/#docs

5

TRAUMHAFT! :slight_smile:

Vielen Dank, funktioniert einwandfrei! Die Inhalte habe ich natürlich im neuen, eigenen Theme angepasst.

Jetzt werde ich weiter testen, wie man die Linien noch weiter anpassen kann (bzgl. Dicke, Farbmöglichkeiten usw.) 

Danke! :)  no