dongyan8896 2013-10-01 21:32
浏览 54
已采纳

php-css编辑图像调整大小(wordpress主题)

I need your help with the following theme.

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

I want to change the size of the images on index page and also the size of image on each post.

I found the code below on functions.php and stylesheet.css,bust just editing it isnt enough.

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;

Any ideas?

  • 写回答

2条回答 默认 最新

  • doutan5844 2013-10-01 22:05
    关注

    Changing the CSS should do it... when I change the value of the max-width property of .feat-thumb a to something smaller in Chrome I see it resize as expected. You may not be editing it correctly (for example you may not have server-side file permissions set up to save edits made to templates through the Wordpress admin panel - try FTP instead), or you may be seeing a cached stylesheet and need to clear your browser's cache to load the updated stylesheet.

    The add_image_size() references in functions.php for home_img and single_img are only used when an image is first uploaded, so it is not retroactive so in order to update images uploaded previously you need to use a plugin - I like this one: AJAX Thumbnail Rebuild

    However, in a responsive theme, images are generally set to either width: 100% or max-width: 100% (in this case the latter) and depend on the size of their parent container or in some cases a more distant ancestor container, which is why you are updating the CSS value for .feat-thumb a, the anchor element that wraps the img, rather than the img directly, so in many cases just updated add_image_size() wouldn't be enough without CSS tweaks as well (and really, changing the calls to add_image_size() wouldn't matter because regardless of actual size the images in a responsive design will generally never be more than 100% the width of their smaller container).

    If you are certain the CSS update is being applied/loaded (e.g. you can inspect it in your browser from the server and it's not a file permissions or cache issue) you can try adding !important to the end of the styles (sloppy) or copy and paste them at the end of the stylesheet and add another element to the selector chain to ensure they are of higher specificity (e.g. body .feat-thumb a rather than .feat-thumb a). However I suspect you are having some other issue because as I said I can see the results on the front end when I modify the CSS directly in Chrome.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 给出完整的python代码并解释
  • ¥15 有人懂怎么做大模型的客服系统吗?卡住了卡住了
  • ¥20 firefly-rk3399上启动卡住了
  • ¥15 如何删除这个虚拟音频
  • ¥50 hyper默认的default switch
  • ¥15 网站打不开,提示502 Bad Gateway
  • ¥20 基于MATLAB的绝热压缩空气储能系统代码咨询
  • ¥15 R语言建立随机森林模型出现的问题
  • ¥15 关于#wpf#的问题:怎么更改LayoutGroup组件的标签页的字体颜色
  • ¥15 中级微观经济学,生产可能性边界问题