Überschrift H1 und H2 in Anzeige ändern

[Hanny]

Hallo,

gern möchte ich die H1 und H2 Überschriften von Großschreibung auf normal ändern. Ich habe bereits die base_custom.css wie folgt geändert von
h1 {
margin : 0 0 0.5em 0;
font : 2em "Trebuchet MS", sans-serif; color : #333;

in


h1 {
margin : 0 0 0.5em 0;
font : 2em "Verdana", sans-serif; color : #333;

aber die Anzeige im Shop ändert sich nicht. Was mache ich denn hier falsch?

Desweiteren wird der Kategoriename als H1 Überschrift automatisch auf der Seite eingefügt. Diesen möchte ich gern nicht mehr angezeigt haben. Wo kann ich denn dies ändern.

Ich hoffe es kann mir jemand einen Tipp zu den Problemen geben. Besten Dank bereits im Voraus.

Hanny

 

[Groundhog]

AW: Überschrift H1 und H2 in Anzeige ändern

Hallo Hanny,

Änderungen an h1 und/oder an h2, genauso wie weitere Modifikationen im css solltest du in die theme.css des Benutzerdefinierten Themes schreiben. Eine Erweiterung des Dateinames ist bei *.tpl Dateien nötig, nicht aber bei den Stylesheets. Die theme.css des Template Ordners welchen du im Backend als Standard-Theme definiert hast wird als letztes geladen und überschrieibt die Werte in den anderen .css Dateien.

Je nachdem welches Template du im Moment benutzt, kopierst du den Inhalt (also die theme.css sowie den images-Ordner) in den Ordner custom. Dann stellst du im Shop-Backend auf das Theme Benutzerdefiniert um. Also Reiter Darstellung > Template > Einstellungen > Standard-Theme auf "Benutzerdefiniert" stellen.

So, nun kannst du den Inhalt der theme.css welche ja jetzt in deinem custom Ordner im Template Verzeichnis liegt ändern. Die Großschreibung der Überschriften zB. findest du in Zeile 24:

h1, h2 { text-transform: uppercase; }

Hier kannst du die verschiedenen Überschriften anpassen, sowie weitere css Werte ändern oder hinzufügen.

 

[Hanny]

AW: Überschrift H1 und H2 in Anzeige ändern

Hallo Groundhog,

vielen lieben Dank für deine Erklärung es hat mit einigen Probieren alles geklappt.

Vielleicht hat Du noch eine Tipp für mich wie ich diese H2 Überschrift die automatisch aus dem Kategorienamer erzeugt wird im ganzen Shop entfernen kann. Über die Funktion Element untersuchen kann man mit "Knoten löschen" genau dies Überschrift ausblenden (nur für den Moment da es ja nicht dauerhaft geänder ist) jedoch finde ich in der page.css (Tiny) einfach nicht den Code der dafür verantwortlich ist.

Der Code sieht wie folgt aus:
<div class="category_wrapper clearall">

<ul class="category_item">
<li class="img"> … </li>
<li class="desc">
<h2> … </h2>(soll nicht mehr automatisch erzeugt und angezeigt werden)
<div class="item_desc custom_content"> … </div>
</li>
</ul>

</div>

Wenn der Knoten gelöscht ist wird auf der rechten Seite page.css 2889

.category_wrapper ul.category_item li {
float: left;

und float: left; ist durchgestrichen angebeben. Jedoch wenn ich diesen Code in der page.css Datei ändere, verändert sich nur die Ansicht vom Kategorie-Tex allegemein, daß er nicht mehr neben dem Bild sondern darunter angezeigt wird. Und die Überschrift ist weiter hin da. Für eine Hinweis wäre ich Dir sehr dankbar.

Liebe Grüße

Hanny

 

[Groundhog]

AW: Überschrift H1 und H2 in Anzeige ändern

Hallo Hanny,

Es gibt zwei Möglichkeiten die Überschrift aus den Kategorien auszublenden. Direkt über CSS, oder in der tpl-Datei selbst.

Meiner Meinung nach ist die Ausblendung über CSS die einfachere und schönere Variante.

Ich nehme an du hast bereits eine theme.css im Benutzerdefinierten Ordner angelegt. In die theme.css schreibst du folgendes:

.category_item .desc > h2 { display: none; }

Fertig.

Wenn du es im Template ausblenden willst dann muss du die komplette überschrift ausblenden. Dazu schreibst du <!-- vor den beginnenden <h2> -Tag und schließt hinter dem endenden </h2> Tag folgendes an: -->

Fertig sieht deine Zeile dann so aus:

</-- <h2> .... </h2> -->

Damit ist die h2 im Template ausgeblendet und wird nicht mehr beachtet. Damit du dich dann hinterher auch auskennst (was bei vielen Änderungen irgendwann nicht mehr der Fall ist) solltest du es so machen:

<!-- Kategorieueberschrift ausgeblendet
<h2> ... </h2>
-->

Damit ist der Übersichtlichkeit dann auch geholfen.

Und lass bitte die css Dateien im base Ordner unangetastet. Die Dateien werden beim Shopupdate überschrieben und somit sind deine Änderungen dann futsch. Auch ein anhängen von _custom ist hier sinnlos. Änderungen an CSS Dateien gehören in die theme.css. CSS Werte aus den Dateien im base-Ordner werden durch die Regeln im der theme.css überschrieben.

So wie du beschreibst arbeitest du wahrscheilich mit Firefox und dem eigebauten Editor. Wenn du hier ein durchgestrichenes Tag findest, also in deinem Fall zB: float: left; , dann bedeutet das, dass eine andere Regel (zB aus der theme.css) die Eigenschaft der angegebenen CSS (also bei dir: page.css) überschreibt.

 

[Hanny]

AW: Überschrift H1 und H2 in Anzeige ändern

Hallo Groundhog,

vielen lieben Dank für deine ausführliche Erklärung. Habe die Änderung über theme.css gemacht und alles hat geklappt. Sehr gut für mich war auch noch einmal der letzte Abschnitt. Denn, das alle Änderungen aus der theme.css in den jeweiligen Seiten überschrieben werden, dass hatte ich bis jetzt noch nicht verstanden. Danke dafür! Die Änderungen von gestern wurden auch gleich noch in der theme.css eingefügt und die original Datein wieder hergestellt.

Besten Dank und liebe Grüße

Hanny