Moin.
Schaut bitte mal hier: https://www.gaststaette-zur-sonne.de
Auf der Startseite ist diese Begrüßungsblock mit dem Hinweis "Gaststätte Bierkneipe Restaurant Treffpunkt".
Anstatt dieses Textes würde ich gerne das Logo der Menüleiste als Bild einfügen.
Tja. Nur wie?
Falls das überhaupt so geht, dass man es erkennen kann was da steht....
Bild anstatt Text in Teil eines Blocks einfügen
-
- Mitglied (Level 10)
- Beiträge: 257
- Registriert: Di 15. Dez 2020, 11:46
- Wohnort: Dortmund
Bild anstatt Text in Teil eines Blocks einfügen
scherenschlag
MBR 5.9.17
MBR 5.9.17
- Tommy Herrmann
- Site Admin
- Beiträge: 5865
- Registriert: So 6. Dez 2020, 07:37
- Wohnort: Berlin
- Kontaktdaten:
Re: Bild anstatt Text in Teil eines Blocks einfügen
Na - ist jetzt so "theoretisch" (ohne es zu testen und den Block zu kennen) etwas schwierig für mich zu sagen.
... aber eigentlich musst Du doch nur, anstelle des Textes, dann das Logo einbinden - also das <img> Tag für ein Bild.
Ich habe mal diesen Teil-Bereich vom Quellcode kopiert und anstelle des Textes Dein Logo eingefügt. Suche den im "Code Editor" von dem Block und ersetze den Text inklusive vom <h3> Tag.
Also wo jetzt dieses <h3> Tag mit dem Text </h3> steht:
Ersetzt Du es mit dem Bild so:
... dem <img> Tag habe ich noch eine id="sonne" verpasst um mit dieser CSS die Größe vom Logo leicht anzupassen, auf z.B. maximal 300px Breite. Die ID wird in der CSS-Klasse als Raute # Zeichen angegeben und gehört dann in dem Block (rechts) in den Bereich "CSS Editor":
... das sollte es schon sein.
Ich weiß jetzt auch nicht - ohne das zu testen - wie sich dieser Bereich dann mit dem Bild an den unterschiedlichen Displaygrößen (Handy) darstellt und ob da dann noch CSS fehlt oder nicht.
Sollte das so noch nicht funktionieren, schreibe mir bitte (mit Screenshot vom Block) ganz genau welcher Block aus welchem Thema das ist, sodass ich es hier nachstellen kann.
... aber eigentlich musst Du doch nur, anstelle des Textes, dann das Logo einbinden - also das <img> Tag für ein Bild.
Ich habe mal diesen Teil-Bereich vom Quellcode kopiert und anstelle des Textes Dein Logo eingefügt. Suche den im "Code Editor" von dem Block und ersetze den Text inklusive vom <h3> Tag.
Also wo jetzt dieses <h3> Tag mit dem Text </h3> steht:
Code: Alles auswählen
<div class="card-wrapper">
<div class="card-title-wrapper">
<h3 class="mbr-title_1 mbr-fonts-style display-2">
Gaststätte Bierkneipe<br>Restaurant Treffpunkt</h3>
</div>
</div>
Ersetzt Du es mit dem Bild so:
Code: Alles auswählen
<div class="card-wrapper">
<div class="card-title-wrapper">
<img id="sonne" src="https://www.gaststaette-zur-sonne.de/assets/images/schriftzugsonneklein-485x95.png" alt="Gaststätte zur Sonne">
</div>
</div>
... dem <img> Tag habe ich noch eine id="sonne" verpasst um mit dieser CSS die Größe vom Logo leicht anzupassen, auf z.B. maximal 300px Breite. Die ID wird in der CSS-Klasse als Raute # Zeichen angegeben und gehört dann in dem Block (rechts) in den Bereich "CSS Editor":
Code: Alles auswählen
#sonne {
max-width: 300px;
}
Ich weiß jetzt auch nicht - ohne das zu testen - wie sich dieser Bereich dann mit dem Bild an den unterschiedlichen Displaygrößen (Handy) darstellt und ob da dann noch CSS fehlt oder nicht.
Sollte das so noch nicht funktionieren, schreibe mir bitte (mit Screenshot vom Block) ganz genau welcher Block aus welchem Thema das ist, sodass ich es hier nachstellen kann.
-
- Mitglied (Level 10)
- Beiträge: 257
- Registriert: Di 15. Dez 2020, 11:46
- Wohnort: Dortmund
Wer ist online?
Mitglieder in diesem Forum: 0 Mitglieder und 145 Gäste