Pevný rozměry u náhledových obrázků

[donkoolerParticipant]

Dobrý den, obracím se na vás o pomoc s náhledovýma obrázkama. Potřebuji poradit jak docílit toho, aby všechny náhledový obrázky u příspěvků měli stejný rozměry.

Aby se ten obrázek oříznul a nebyl roztačenej na tyto rozměry.

Například když budu mít obrázek s rozměry 300×300 a budu ho chtít na 300×200 tak aby se ořízlo tak, že těch zbylejch 300×100 už nezobrazovalo.

Předem moc děkuji za pomoc.

[donkoolerParticipant]

Vážně nikdo nevíte? :/

[sjiamnocnaParticipant Web]

Jestli ovládáte Angličtinu, podobný (nebo stejný?) dotaz je zde:
http://stackoverflow.com/questions/15083789/resizing-and-cropping-images-with-css

tam se říká, že to nejde udělat jen v CSS, musel byste se patlat s PHP GD, WordPress ořezáváním, či možná ještě něčím horším ;)

Jediné, co mně napadlo je použít obrázek jako pozadí bez určení background-size, jen background-position: 50%; a potom na celý prvek velikost width:300px; height:200px;

[donkoolerParticipant]

Tyjo, jsem rád že tu jseš ty. Opět ti moc děkuju. :)

[donkoolerParticipant]

jo a když už tu jseš, jak mám vytáhnout url z náhledovýho aby to fungovalo?

[sjiamnocnaParticipant Web]

Opět odkážu na externí zdroje:

https://wordpress.org/support/topic/getting-a-post-featured-image-url

použity jsou funkce https://codex.wordpress.org/Function_Reference/get_post_thumbnail_id a https://codex.wordpress.org/Function_Reference/wp_get_attachment_url asi takto:

<?php
$furl = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
?>
<div class="featuredimg"></div>

<style>
div.featuredimg{
background:url(<?php echo $furl; ?>);
}
</style>

anebo přímo:
<div style="background:url(<?php echo wp_get_attachment_url( get_post_thumbnail_id($post->ID); ?>; background-position:50%;"></div>

Abych řekl pravdu, taky jsem rád, že tu jsem… Občasné zodpovídání dotazů mi docela prospívá, a když něco popletu, je vždycky po ruce admin, který mě opraví a já se tím něco naučím

[donkoolerParticipant]

kód jsem ještě musel doopravit, jsi zapomněl zakončit závorky a jinak to funguje!
<div style="background-size: contain; background:url('<?php echo wp_get_attachment_url( get_post_thumbnail_id($post->ID)); ?>'); background-position:50%; width:300px;height:270px;"></div> přidal jsem teda ještě šířku a výšku zobrazované plochy pro náhled

DĚKUJU

[Autor]

Příspěvky