Collage auf der Startseite - flexible Anordnung von Bildern

Thema wurde von eikesan, 14. Januar 2015 erstellt.

  1. eikesan
    eikesan Erfahrener Benutzer
    Registriert seit:
    3. April 2014
    Beiträge:
    107
    Danke erhalten:
    1
    Danke vergeben:
    54
    Guten zusammen,

    kennt jemand einen Trick, um verschiedene Bilder auf der Startseite bunt zusammen zu mischen?

    In etwa soll das so aussehen:
    startseitenkollage.jpg

    Doch die Bilder einzelnt einzufügen klappt nicht so wirklich; sie verrutschen.
    Wenn ich beispielsweise das erste obere linke Bild einfüge und danach das rechte schmale daneben setzen will, verschiebt sich das linke Bild in die vertikale Mitte des rechten Bildes.
    Mit einer Tabelle habe ich es auch schon versucht, aber da passiert das gleiche.

    Kennt jemand einen Trick?
     
  2. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    10. August 2012
    Beiträge:
    1.554
    Danke erhalten:
    455
    Danke vergeben:
    96
    Wie genau hast du das mit der Tabelle probiert? Es gibt die Möglichkeit, dass man Zellen verbindet. Bei dir könnte man z.B. versuchen eine 4x3 Tabelle zu nehmen und dann z.B. die ersten drei Zellen der ersten Zeile zu verbinden, dann die 4. Zelle der ersten und zweiten Zeile, usw. Dann noch die genauen Maße der Zellen festlegen. Eine Anleitung, wie man Zellen verbindet, findest du (Link nur für registrierte Nutzer sichtbar.). Könnte aber natürlich sein, dass manche Browser dann wieder andere Meinungen haben, wie sie das anzeigen wollen.

    Ich nehme an, die Bilder sollen auch auf Kategorien oder soetwas verlinkt sein? Dann könntest du das auch mit einer sogenannten Imagemap lösen. Dazu fügst du die Bilder zu einem großen Bild zusammen und kannst dann verschiedene Bereiche definieren, die beim draufklicken auf verschiedene Seiten verlinken. Wie das geht steht (Link nur für registrierte Nutzer sichtbar.). Du kannst auch mal nach Imagemap Generatoren googeln, da gibts einige. Ausprobiert hab ich selbst aber noch keinen davon.
     
  3. M+D
    M+D Erfahrener Benutzer
    Registriert seit:
    1. September 2014
    Beiträge:
    209
    Danke erhalten:
    2
    Danke vergeben:
    73
    Genau sowas suche ich auch!
     
  4. MP Solution
    MP Solution Erfahrener Benutzer
    Registriert seit:
    2. Oktober 2013
    Beiträge:
    2.945
    Danke erhalten:
    456
    Danke vergeben:
    93
    #4 MP Solution, 14. Januar 2015
    Zuletzt bearbeitet: 14. Januar 2015
    Bildwürfel

    1.jpg Hierbei werden die Zelleigenschaften, Bildeigenschaften sowie die Tabelleneigenschaften zu Nutze gezogen.
    Die Ausrichtung erfolgt hier über jedes einzelne Bild. Hierbei wurde mit einem Rahmen in Rahmen gearbeitet und die Bilder sind ohne Rahmen implementiert worden.
    2.jpg
     
  5. franciskameszaros
    franciskameszaros Aktives Mitglied
    Registriert seit:
    11. Juni 2014
    Beiträge:
    34
    Danke erhalten:
    3
    Danke vergeben:
    13
    #5 franciskameszaros, 15. Januar 2015
    Zuletzt bearbeitet: 15. Januar 2015
  6. M+D
    M+D Erfahrener Benutzer
    Registriert seit:
    1. September 2014
    Beiträge:
    209
    Danke erhalten:
    2
    Danke vergeben:
    73
    Hallo Franci

    vielen Dank für den Link. Wie hast du denn die Artikel in die Kategorie Sales bekommen? Mit Duplizieren?

    Vielen Dank
    Petra
     
  7. franciskameszaros
    franciskameszaros Aktives Mitglied
    Registriert seit:
    11. Juni 2014
    Beiträge:
    34
    Danke erhalten:
    3
    Danke vergeben:
    13
    Hi Petra, zuerst muss du eine neue Kategorie mit "Sale" erstellen. Dann von der gewünschte Kategorie einfach die Produkte kopieren.
    du muss das Produkt anklicken und rechts auf "kopieren" klicken dann die Kat. Sale auswählen und speichern.


    LG Franci
     
  8. M+D
    M+D Erfahrener Benutzer
    Registriert seit:
    1. September 2014
    Beiträge:
    209
    Danke erhalten:
    2
    Danke vergeben:
    73
    Hat super funktioniert! Danke!
     
  9. franciskameszaros
    franciskameszaros Aktives Mitglied
    Registriert seit:
    11. Juni 2014
    Beiträge:
    34
    Danke erhalten:
    3
    Danke vergeben:
    13
    #9 franciskameszaros, 15. Januar 2015
    Zuletzt bearbeitet: 16. Januar 2015
    unglaublich dass ich jemandem helfen konnte :) :) es freut mich!!!


    und noch etwas zu canva... ich benutze da immer die Card Design... das hat bei mir von der Größe her super gepasst, musst nicht verkleinern...


    Franci
     
  10. peterluederitz-1
    peterluederitz-1 Mitglied
    Registriert seit:
    17. April 2013
    Beiträge:
    5
    Danke erhalten:
    0
    Danke vergeben:
    2
    #10 peterluederitz-1, 19. Januar 2015
    Zuletzt bearbeitet: 19. Januar 2015
    Hallo zusammen,

    wir haben in unserem Shop ein ähnliches Anliegen.
    Über die index(mobile) im ContentManager möchte ich unsere vier wichtigsten Kategorien über Bilder darstellen.

    Sollte im Ergebnis etwa so aussehen:
    index_mobile.png

    Ich habe es mit einer Imagemap versucht, leider wird das Bild zu groß dargestellt und in MC kann man ja nicht nach rechts scrollen.
    Das Bild per "width" responsive zu machen passt sich zwar der Bildschirmauflösung an aber letztlich geht es so ja leider auch nicht, da die Koordinaten der Linkpunkte ja nicht relativ mitberechnet werden und "starr" bleiben. Die Größe der Imagemap kleiner zu machen ist auch keine optimale Lösung, da sie sich ja nicht an die Bildschirmaufösung verschiedener Smartphones anpassen kann.

    Nun habe ich versucht, die Bilder per Tabelle einzufügen und responsive zu machen, was allerdings auch nicht so klappt.
    Habe bereits verschiedene Möglichkeiten mit width, max-width, etc. versucht.

    Ich möchte gerne, dass sich die vier Bilder automatisch an die Bildschirmgröße des Smartphones anpassen und auf ganzer Breite dargestellt werden.

    Ist das so irgendwie möglich oder gehe ich da ganz falsch ran?
    Hat jemand dazu einen Vorschlag/Lösung?


    Update: Habe jetzt einfach die Imagemap in einer 320 Pixel-Breite erstellt und scheint soweit auch zu funktionieren. Die meisten Smartphones sollten dies gut darstellen können. Falls jemand aber noch weitere Vorschläge hat, wie man eine solche "Collage" gut darstellen kann, immer her damit :)