css - Wordpress 特色图片调整大小和裁剪不起作用

标签 css wordpress wordpress-theming crop image-resizing

我无法在我的 wordpress 博客中调用博客文章的特色图片。我在网站上搜索了该教程,但结果都是一样的。

它不符合我指定的大小,即 200x180 像素,然后其余部分被裁剪。为了更好地了解我正在尝试做的事情,您可以引用这个网站:

http://freakify.com/

我试图让所有特色图片都具有相同的尺寸 (200x180)。在一个非常相关的主题上,我的特色图片的大小不同但不低于 500px 且不超过 650px。我试图在不同的地方显示它,例如我的索引文件和侧栏 bar.php 文件

add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 200, 180, true ); // 50 pixels wide by 50 pixels tall, crop mode
add_image_size( 'post-thumbnails', 200, 180  );

我希望你们能帮助我。

最佳答案

首先,如果您打算只使用一个缩略图大小,则不需要 add_image_size,只需前两行就足够了。 其次,使用“真实”语句,您是在“告诉”wordpress 对图像进行硬裁剪,因此它只是将图像裁剪为 200x180。另一方面,如果您将“true”更改为“false”,那么您的图像将被调整到最大宽度或高度,它们可以保持纵横比。 这是在不改变图像外观的情况下调整图像大小的两种方法,因为如果不保持纵横比,图像就会被拉伸(stretch)。 我的建议是使用 200px 作为绝对值,动态改变高度。 为此,您可以这样做:

set_post_thumbnail_size( 200, 9999, false );

这样您就可以获得原始图像,满足 200 像素的要求但不改变它们的高度,因此您可以保持纵横比。

http://dfine.me要查看实际效果,您只需修改 css 以正确的方式获取元素。

关于css - Wordpress 特色图片调整大小和裁剪不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13831679/

相关文章:

javascript - 将 javascript 从 onclick 转换为 onhover

css - 过滤 'current-menu-item' 类以使用 'active' 代替

php - WordPress 子主题 - 一般理解

html - Css 表单进度条样式问题

html - 两个可变自动高度行占据父高度(无 JS)

ruby-on-rails - 移动 CSS 缩略图边框

php - WordPress - 使用 jQuery/Ajax 将表导出为 csv

html - 如何排除 wp_nav_menu( array(?

html - 图片不显示 html css

css - 从 WordPress 子主题编译一个 less 文件是否实现了 SEO 友好的来源?