Bild anstatt Text in Teil eines Blocks einfügen

Allgemeine Fragen
scherenschlag
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 257
Registriert: Di 15. Dez 2020, 11:46
Wohnort: Dortmund

Bild anstatt Text in Teil eines Blocks einfügen

Ungelesener Beitrag von scherenschlag »

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? :confused:
Falls das überhaupt so geht, dass man es erkennen kann was da steht....
scherenschlag
MBR 5.9.17
Benutzeravatar
Tommy Herrmann
Site Admin
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

Ungelesener Beitrag von Tommy Herrmann »

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:

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;
}
... 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.
scherenschlag
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 257
Registriert: Di 15. Dez 2020, 11:46
Wohnort: Dortmund

Re: Bild anstatt Text in Teil eines Blocks einfügen

Ungelesener Beitrag von scherenschlag »

Super.... :freude:
Danke
scherenschlag
MBR 5.9.17
Antworten

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 134 Gäste