Im Footer Bilder nebeneinander...

Shopware 5 Themes & Design
1

Hallo Zusammen,
ich versuche nun schon seit Tagen im Footerbereich Bilder/Icons unterzubringen und verzweifel daran… Geschafft habe ich (vermutlich auf vollkommen merkwürdigen Weg) dass ich zwei Icons anzeigen lasse. Aber die sind untereinander. Ich hätte sie gerne nebeneinander. Alles was ich so aus html etc. kenne und versucht habe hat nicht geklappt.

Was ich bisher gemacht habe:

  • eigenes Design angelegt (Kopie von Responsive)
  • in diesem dann per FTP die Dateien footer.tpl  (Pfad: /themes/Frontend/GerdsCoffeshop/frontend/index/ angelegt.

In dieser Datei habe ich dann:

{extends file='parent:frontend/index/footer.tpl'}

{block name='frontend_index_footer_menu' append}

div.flexbox {
  display: flexbox;
  flex-flow: row;
}
div.flexbox p {
  width: 100px;
  height: 100px;
}





    







{/block}

eingefügt, was mir meine 2 Icons bringt… aber neben und nicht untereinander…

 

Kann wer nem Blinden helfen? Habe schon gegoogelt etc. aber entweder ich verstehe es nicht, oder es klappt nicht :wink:

 

Vielen Dank

 

Ossacip

2

Hi,

vielleicht hilft dir das: CSS/Tutorials/Flexbox/Flex-Container – SELFHTML-Wiki 

3

Das p-Element ist ein Block-Element und erzeugt eine Absatz. Nimm das mal raus.

1 „Gefällt mir“
4

Moin,

hab da schon gelesen und probiert, aber es fluppt nicht, wie ich es möchte :frowning:

Einer ne Idee, was ich falsch mache?

5

Lies dir mal durch wie Flexbox überhaupt funktioniert. Z.B. d isplay: flexbox? meinst du nicht eher display: flex?

6

Vielen Dank für die Mototrsäge :wink: hab die Bäume weggesägt und nun hab ich den Wald gesehen :wink:

Dass mit der Flexbox war natürlich verkehrt!! Aber wenn du stundenlang immer wieder hin und her probierst, kommt sowas schonmal.

Jetzt hab ich es, zumindest funktioniert es so :wink:

{extends file='parent:frontend/index/footer.tpl'}

{block name='frontend_index_footer_menu' append}

div.flexbox {
	display: -webkit-flex;
	display: flex;
}
div.flexbox p {
  width: 100px;
  height: 100px;
}





    







{/block}

Vielen Dank für die Hilfe

2 „Gefällt mir“
7

Hallo Ossacip,

kannst du mir vielleicht genauer sagen, wie du das jetzt im Footer eingebaut hast??

Bin jetzt auch seit Stunden dran und bekommen es nicht eingezeit. Hab mir mal dein Code so genommen und bei mir reinkopiert mit den entsprechend Veränderungen. Funktioniert aber so leider nicht. Hast du mir da vielleicht was genaueres? Wäre echt super.

8

Hallo Ake

Evtl. hilft dir das weiter, 

{extends file='parent:frontend/index/footer-navigation.tpl'}

{block name="frontend_index_footer_column_service_hotline_content"}
	
        {s name="sFooterServiceHotline"}{/s}
    

	
		
			
		
		
			
		
	
{/block}

.dein-Style {
 float:left;
}

Du kannst natürlich dein Style noch erweitern oder die Bilder mit einem Link versehen. Wenn du es an einer anderen stelle einfügen möchtest, dann musst du den Code anpassen.

VG 

9

Hallo Hds,

ich danke für die Rückmeldung. Ganz schlau bin jetzt darauf nicht geworden.

Ich würde ganz einfach 4 Logos wie GLS | DHL | und ähnliches nebeneinander platzieren und auch direkt verlinken.

Es soll genau unter dem Copyright Text platziert werden, also ganz am Ende von dem Footer, dann mittig.

* Für Endkunden sind unsere Preise inkl. MwSt. zzgl. VERSANDKOSTEN | Copyright ©

Wie müsste der Code dann aussehen im Footer-Navigation.tpl ??

Danke dir für die Unterstützung.

Gruß

AKE

10

 

{extends file='parent:frontend/index/footer.tpl'}

{block name="frontend_index_shopware_footer_logo"}
{$smarty.block.parent}


		
			
		
		
			
		
	
{/block}

und wenn du das Bild verlinken willst dann kannst du das so einfügen

Es gibt bestimmt auch bessere, einfachere und schönere Lösungen. Eskommt drauf an wie du es haben willst.

VG