【问题标题】:php-css editing for image resize (wordpress theme)用于调整图像大小的 php-css 编辑(wordpress 主题)
【发布时间】:2013-11-19 04:37:55
【问题描述】:

我在以下主题方面需要您的帮助。

http://www.korevolution.com/risorse-gratuite/free-wp-theme/koresponsive/

我想更改索引页上图片的大小以及每个帖子上的图片大小。

我在functions.php和stylesheet.css上找到了下面的代码,只是编辑它是不够的。

Functions.php code

add_theme_support( 'automatic-feed-links' );
add_theme_support( 'post-formats', array( 'aside', 'link', 'gallery', 'status', 'quote', 'image' ) );
if ( function_exists( 'add_theme_support' ) ) { 
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 314, 200, true );
add_image_size( 'related', 50, 50, true ); 
add_image_size( 'home_img', 314, 200, true ); 
add_image_size( 'single_img', 600, 300, true );  
add_image_size( 'page_img', 920, 350, true ); 
add_image_size( 'slider_img', 600, 280, true ); 

Stylesheet.css code

.img-home, .feat-thumb a
max-width: 314px;
max-height: 200px;
display: inline-block;

.img-single, .feat-thumb-s a
max-width: 600px;
max-height: 300px;
display: inline-block;

有什么想法吗?

【问题讨论】:

  • 仅供参考,请记住,所有上传的图像都应用了您的旧尺寸设置,因此使用add_image_size() 更改尺寸只会影响新图像。如果你想要一致性,你将不得不删除旧图像,然后重新加载它们。

标签: php css image wordpress edit


【解决方案1】:

更改 CSS 应该可以做到...当我在 Chrome 中将 .feat-thumb amax-width 属性的值更改为更小的值时,我看到它按预期调整大小。您可能没有正确编辑它(例如,您可能没有设置服务器端文件权限来保存通过 Wordpress 管理面板对模板所做的编辑 - 请尝试使用 FTP),或者您可能看到缓存的样式表并且需要清除浏览器的缓存以加载更新的样式表。

functions.phphome_imgsingle_img 中的 add_image_size() 引用仅在首次上传图像时使用,因此它不具有追溯力,因此要更新之前上传的图像,您需要使用插件 -我喜欢这个:AJAX Thumbnail Rebuild

但是,在响应式主题中,图像通常设置为 width: 100%max-width: 100%(在本例中为后者),并且取决于其父容器的大小,或者在某些情况下是更远的祖先容器,这这就是为什么您要更新 .feat-thumb a 的 CSS 值,即包装 img 的锚元素,而不是直接更新 img,因此在许多情况下,如果没有 CSS 调整,只更新 add_image_size() 是不够的(实际上,将调用更改为 add_image_size() 并不重要,因为无论实际大小如何,响应式设计中的图像通常不会超过其较小容器宽度的 100%)。

如果您确定正在应用/加载 CSS 更新(例如,您可以从服务器在浏览器中检查它,这不是文件权限或缓存问题),您可以尝试在样式末尾添加 !important (草率)或将它们复制并粘贴到样式表的末尾并将另一个元素添加到选择器链中以确保它们具有更高的特异性(例如body .feat-thumb a而不是.feat-thumb a)。但是我怀疑您还有其他问题,因为正如我所说,当我直接在 Chrome 中修改 CSS 时,我可以在前端看到结果。

【讨论】:

  • 现在感谢它的工作。我必须同时编辑 php 和 css,然后我使用了插件,这让事情变得更容易了。
【解决方案2】:

您可以通过 WordPress 的图像编辑器和设置来更改图像的大小。完成此操作后,您的 CSS 应该可以工作了

转到您的 Wordpress 媒体库 (your_website.com/wp-admin/upload.php) 以编辑您上传的图像文件

您可以在这里找到WordPress image settings help

【讨论】:

    猜你喜欢
    • 2016-09-11
    • 1970-01-01
    • 1970-01-01
    • 2018-05-17
    • 2012-10-17
    • 2011-03-18
    • 1970-01-01
    • 1970-01-01
    • 2011-10-22
    相关资源
    最近更新 更多