Artikelbilder in unterschiedlichen Größen ausgeben

[Coulyo]

Hallo,

ich bin dabei eine HTML Page an Wordpress anzupassen und bin nun bei den Artikelbildern angekommen. Auf der Blog-Seite sollen die Artikelbilder im Format 16:9 ausgegeben werden. Das funktioniert soweit auch wunderbar.
Auf der Startseite möchte ich allerdings die Artikelbilder aus einer bestimmten Kategorie in 3 quadratischen Boxen, also im Seitenverhältnis 1:1 ausgeben. Da sie aber in 16:9 vorliegen, werden die quadratischen Boxen nicht ausgefüllt.

Nun meine Frage: Gibt es eine Funktion in Wordpress (oder ein Plugin), womit man die Artikelbilder für die quadratischen Boxen automatisch beschneiden kann, damit sie die ganze Box ausfüllen?

Zur Veranschaulichung hier nochmal zwei Screenshots.




Danke schonmal für alle Antworten

 

[wex]

AW: Artikelbilder in unterschiedlichen Größen ausgeben

Hi,
ich kenne kein Plugin für WordPress, aber versuch es doch mal mit CSS und dem background-position Attribut.

Du könntest doch, wenn ich das richtig verstanden habe, das Bild auf die komplette Höhe der quadratischen Box machen und dann den Div einfach mit overflow: hidden abschneiden lassen. Dann wäre rechts der überstehende Teil des Bildes abgeschnitten.

Ich hoffe ich konnte dir damit irgendwie helfen

gruß
wex

 

[Lycanos]

AW: Artikelbilder in unterschiedlichen Größen ausgeben

Hi,

so wie ich das sehe wirst Du immer ein Problem haben und zwar aus folgenden Grunde:

Ein Bild in 16:9 kannst Du, wie auch immer, nur abschneiden - sprich einen Ausschnitt wählen - oder es strecken, was verzerrt aussieht. Auch kannst Du es verkleinern, wirst aber immer einen Balken oben und unten behalten. Letzteres kennt man vom Fernseher.

Muss es also ein Quadrat sein für die Startseite?

 

[Coulyo]

Genial, das mit dem Overflow funktioniert.

Kann man es auch irgendwie so hinbiegen, dass das Bild auf beiden Seiten abgeschnitten wird und man dann nur noch den mittleren Teil des Bildes sieht?

@Lycanos, dass es abgeschnitten wird ist mir bewusst und auch so gewollt. Auf der Startseite müssen es Quadrate sein, ja ;D

Ah, habs grade selbst hinbekommen, mit position:relative und position:absolute

 

[wex]

AW: Artikelbilder in unterschiedlichen Größen ausgeben

Mit background-position kannst du es verschieben.

http://www.css4you.de/background-position.html

Beispiel für ein mittiges Bild.

background-position: top center;

glaube so müsste es funktionieren.

Viele Grüße
wex