Gelöst Anpassen von Header und Header Top Bar

[deliman]

Hallo,

wo/wie kann man die Breite der Header Top Bar anpassen? Für den Header habe ich das in der header.tpl schon gemacht aber da ändert sich der Top Bar Bereich nicht mit und in der header-top-bar.tpl habe ich keinen entsprechenden Eintrag gefunden.

Da wir in der Header Top Bar links über dem Logo beginnend noch einen eigenen Eintrag a la "Hotline xxx" platzieren wollen..., weis jemand, wie man die Textposition via css festlegt? Bislang erscheint der Text so halb mittig irgendwo mittendrin. Im Idealfall sollen unsere Texteinträge auf der gleichen Höhe wie die Standardeinträge rechts sein (also Währungs- und Sprachenauswahl u.s.w.) und das mehrsprachig.

Testshop: http://u31431ct.test3.jtl-hosting.de

 

[deliman]

Teil 1 habe ich gerade selber in Zeile 293 der header.tpl gefunden.

 

[DRaufeisen]

Mach aus dem Textblock <p> mal ein <div> und nimm das align="left" weg.
Dann gibst du dem <div> mal folgende CSS Eigenschaften:

flex: 1;
padding: 0.5rem 0;

 

[deliman]

Etwa so?

<div> {flex: 1; padding: 0.5rem 0;"} Hotline +49 340 8507 403 (Mo-FR 09:00-17:00 Uhr)| versandfrei ab 100,00€ Bestellwert*

 

[DRaufeisen]

Nein, die Style-Eigenschaften kannst du im style-Attribut vom <div> notieren, ohne geschweifte Klammern. Eher so:

<div style="flex: 1; padding: 0.5rem 0;">
Hotline +49 340 8507 403 (Mo-FR 09:00-17:00 Uhr)| versandfrei ab 100,00€ Bestellwert*
</div>

Hier auch bisschen Lektüre wie man CSS definiert:
https://wiki.selfhtml.org/wiki/CSS/Tutorials/Einstieg/Stylesheets_einbinden

 

[deliman]

OK, vielen Dank. Hatte ich gestern schon mal so ähnlich aber irgendwas muss ich falsch gesetzt haben, da es mir das Templatedesign etwas zerlegt hatte...

Welchen Code muss man denn noch einbinden, wenn man die o.g. Textzeile sprachenabhängig ausgeben will? Ich habe in der header.tpl zwar schon Sprachvariablen gesehen aber da ist ja recht viel Code enthalten...

{block name='layout-header-branding-shop-nav'}
                                    {nav id="shop-nav" right=true class="nav-right ml-auto order-lg-last align-items-center flex-shrink-0"}
                                        {block name='layout-header-branding-shop-nav-language'}
                                            {if isset($smarty.session.Sprachen) && $smarty.session.Sprachen|@count > 1}
                                                {navitemdropdown
                                                class="language-dropdown d-flex d-lg-none"
                                                right=true
                                                text="
                                                    {foreach $smarty.session.Sprachen as $language}
                                                        {if $language->kSprache == $smarty.session.kSprache}
                                                            {$language->iso639|upper}
                                                        {/if}
                                                    {/foreach}"
                                                }
                                                    {foreach $smarty.session.Sprachen as $language}
                                                        {dropdownitem href="{$language->cURL}" rel="nofollow" active=($language->kSprache == $smarty.session.kSprache)}
                                                        {$language->iso639|upper}
                                                        {/dropdownitem}
                                                    {/foreach}
                                                {/navitemdropdown}
                                            {/if}
                                        {/block}
                                        {include file='layout/header_nav_icons.tpl'}
                                    {/nav}
                                {/block}

Das bezieht sich wohl auch auf die Sprachenauswahl auf der rechten Seite, oder?

 

[DRaufeisen]

Sprachvariablen kannst du im Template ganz einfach mit folgendem Befehl einfügen

{lang key='helloworld'}

das "helloworld" ist dein Key. Dem kannst du im Backend unter "Sprachvariablen" einen Text in verschiedenen Sprachen zuordnen. Da legst du dort einfach eine neue Sprachvariable an, Sektion "global" und die jeweiligen Texte. Dann sollte es gehen.

 

[deliman]

Ja, funktioniert super. Danke.

Eine Frage noch: Wo/wie stelle ich es aus, das die header top bar ausgeblendet wird, sobald man nach unten scollt?

 

[deliman]

Kann man den o.g. Code auch unter "Global/Hinweis in Fusszeile" nutzen um dort sprachenabhängige Infos auszugeben? Einfaches HTML funktioniert ja aber dieser Code wird bislang nur als Text ausgegeben.

 

[DRaufeisen]

Theoretisch müsste das genau so gehen. Alternativ kannst du auch ne "Eigene Box" anlegen unter "Footer/Boxen" für den Bereich "Footer"

 

[deliman]

In der eigenen Box wird der Text aber nur in der Breite der darüberliegenden Box ausgegeben, egal ob nur Box oder via neuem Container. Wenn ich die "Textbox" über die gesamte Shopbreite haben will, also den Shopteil mit Inhalt, dann muss ich das sicher irgendwo in den CSS-Einstellungen oder in einer .tpl Datei anpassen, oder?

Jetzt sieht es so aus: http://spielerdemo.timmeserver.de/

 

[saterich]

Mal eine für euch wahrscheinlich easy Frage, mit was kann ich die .tpl öffnen, und gibt es für das was man darin ändert eine Art Liveansicht, wie beispielsweise im Dreamweaver?