{"id":3957,"date":"2009-04-29T10:58:05","date_gmt":"2009-04-29T10:58:05","guid":{"rendered":"https:\/\/www.amitbhawani.com\/blog\/?p=3957"},"modified":"2009-04-29T10:58:05","modified_gmt":"2009-04-29T10:58:05","slug":"auto-shrink-posted-images","status":"publish","type":"post","link":"https:\/\/www.amitbhawani.com\/blog\/auto-shrink-posted-images\/","title":{"rendered":"Auto Shrink Posted Images to Maximum Theme Width"},"content":{"rendered":"

If you are using wordpress blogs, then you are familiar with the default theme which is a theme full of features, though its not liked by many because of the looks. In the Default WordPress theme whenever you upload any images of any width , they are automatically resized to the theme’s maximum width, not breaking the whole blog and the sidebars. This kind of feature is really required when you are adding multiple images and are looking for perfect looking blog.<\/p>\n

When you use other available wordpress themes, then there are chances that you will get problems with the images section because the themes are broken when the size of image exceeds the current theme’s content section width. Any solution for this using wordpress plugins? No there is no real quick solution for this because most wordpress themes are simply coded and the theme developers dont add code for automatically resizing the images added in the content section. The plugins available on the web only work for images which are hosted in your server and do not support for the images which are hosted somewhere.<\/p>\n

Solution for Automatically Resizing Images :<\/strong>
\nYou need to access your style.css file located in the themes folder and add the following code –<\/p>\n

.post img {
\nmax-width: 530px;
\nwidth: expression(this.width > 530 ? 530: true);
\n}<\/p><\/blockquote>\n

Generally in your stylesheet the content part is denoted by .post but depending on the theme it can be .post, .content, .center etc and you need to trace the same and add the above code somewhere in your file. Once saved, it starts working and resizes all the images to the given width\/size dimensions.<\/p>\n

\"Image<\/p>\n

One of my image posted in this blog was of the size – 603px \u00d7 136px but it got Automatically scaled to 530px \u00d7 120px , which means that it resizes the images to the given width and height respectively. You need to find the maximum width of the content part of your blog and save the dimensions in the above given code.<\/p>\n","protected":false},"excerpt":{"rendered":"

If you are using wordpress blogs, then you are familiar with the default theme which is a theme full of features, though its not liked by many because of the looks. In the Default WordPress theme whenever you upload any images of any width , they are automatically resized to the theme’s maximum width, not […]<\/p>\n","protected":false},"author":1,"featured_media":19078,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[376],"tags":[],"class_list":{"0":"post-3957","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-wordpress","8":"entry"},"aioseo_notices":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2010\/12\/Image-Resize-Properties.png?fit=369%2C181&ssl=1","jetpack_sharing_enabled":true,"jetpack-related-posts":[{"id":3845,"url":"https:\/\/www.amitbhawani.com\/blog\/freemium-premium-wordpress-theme\/","url_meta":{"origin":3957,"position":0},"title":"Download Freemium – Best Premium WordPress Theme","author":"Amit Bhawani","date":"April 25, 2009","format":false,"excerpt":"There are huge number of free premium wordpress themes and paid wordpress themes but most of them are not really worth the buzz they create, because most of these wordpress themes show a beautiful demo screenshot or demo version with no adverts along with Flickr Images & Youtube videos. If\u2026","rel":"","context":"In "Free Stuff"","block_context":{"text":"Free Stuff","link":"https:\/\/www.amitbhawani.com\/blog\/category\/free-stuff\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2010\/12\/India-Guide-Vii-Freemium.jpg?fit=706%2C736&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2010\/12\/India-Guide-Vii-Freemium.jpg?fit=706%2C736&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2010\/12\/India-Guide-Vii-Freemium.jpg?fit=706%2C736&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2010\/12\/India-Guide-Vii-Freemium.jpg?fit=706%2C736&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":2169,"url":"https:\/\/www.amitbhawani.com\/blog\/change-gmail-themes-tutorial\/","url_meta":{"origin":3957,"position":1},"title":"How to Change Gmail Themes – Small Tutorial","author":"Amit Bhawani","date":"November 21, 2008","format":false,"excerpt":"Gmail is now offering upto 30 different themes which are real good and very quick loading because their images are highly optimized to make sure the mails load quickly and you dont feel any delay. Yahoo mail beta on the other hand takes good amount of time for loading because\u2026","rel":"","context":"In "Google"","block_context":{"text":"Google","link":"https:\/\/www.amitbhawani.com\/blog\/category\/google\/"},"img":{"alt_text":"Gmail Themes List","src":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/Images\/G\/Gmail-Themes-List.PNG?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":6424,"url":"https:\/\/www.amitbhawani.com\/blog\/how-to-show-images-in-blog-search-results\/","url_meta":{"origin":3957,"position":2},"title":"How to Show Images in Blog Search Results","author":"Amit Bhawani","date":"October 15, 2009","format":false,"excerpt":"I have a Pictures Blog and i was wondering if there is a way to show just Images on the Blog Search Results Pages because that would be far more better than the Normal Blog Results where the Blog Post Title & a Small Excerpt would be shown, and in\u2026","rel":"","context":"In "Wordpress Guide"","block_context":{"text":"Wordpress Guide","link":"https:\/\/www.amitbhawani.com\/blog\/category\/wordpress\/"},"img":{"alt_text":"Wordpress Tips","src":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2009\/10\/wordpress-tips-tricks.jpg?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":4252,"url":"https:\/\/www.amitbhawani.com\/blog\/best-wp-adsense-themes\/","url_meta":{"origin":3957,"position":3},"title":"Best WordPress WP Adsense Themes","author":"Amit Bhawani","date":"July 6, 2009","format":false,"excerpt":"Most blog themes can be used as Adsense themes because you can easily integrate the advertising codes anywhere in the single posts, homepage\/index section & in the sidebar or header section but when you are looking for some designs which can show you clearly the location of the advertising before\u2026","rel":"","context":"In "Top Lists"","block_context":{"text":"Top Lists","link":"https:\/\/www.amitbhawani.com\/blog\/category\/top-lists\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2010\/12\/Ads-Minded-Theme.png?fit=420%2C315&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":13768,"url":"https:\/\/www.amitbhawani.com\/blog\/remove-footer-links-decrypting-encrypted-wordpress-footers\/","url_meta":{"origin":3957,"position":4},"title":"Remove Footer Links by Decrypting Encrypted WordPress Footers","author":"Jay Bhawani","date":"September 3, 2010","format":false,"excerpt":"All of the WordPress theme sellers are nowadays under GPL License because of which its easy for the Bloggers to switch their themes every few months. Buy recently we found many websites which were offering downloads to WordPress with a few links in the footer. When the original theme developers\u2026","rel":"","context":"In "Wordpress Guide"","block_context":{"text":"Wordpress Guide","link":"https:\/\/www.amitbhawani.com\/blog\/category\/wordpress\/"},"img":{"alt_text":"Wordpress Theme Encrypted Codes","src":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2010\/09\/Wordpress-Theme-Encrypted-Codes.gif?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":5880,"url":"https:\/\/www.amitbhawani.com\/blog\/ab-split-testing-tracking-income\/","url_meta":{"origin":3957,"position":5},"title":"A\/B Split Testing with Theme Change – Tracking Income & Page Views","author":"Amit Bhawani","date":"September 21, 2009","format":false,"excerpt":"If you have checked out my blog today i have changed the theme from the previous Arthemia Premium versions whose Developer Licence i have got to a Simple 3 Column design. Here are a few reasons why i have performed this and what is the idea behind this. A\/B Testing\u2026","rel":"","context":"In "Blogging"","block_context":{"text":"Blogging","link":"https:\/\/www.amitbhawani.com\/blog\/category\/web-blogging\/"},"img":{"alt_text":"Feed Stats AB Split Test","src":"https:\/\/i0.wp.com\/www.amitbhawani.com\/blog\/wp-content\/uploads\/2009\/09\/Feed-Stats-AB-Split-Test1.PNG?resize=350%2C200","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/posts\/3957","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/comments?post=3957"}],"version-history":[{"count":0,"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/posts\/3957\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/media\/19078"}],"wp:attachment":[{"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/media?parent=3957"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/categories?post=3957"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.amitbhawani.com\/blog\/wp-json\/wp\/v2\/tags?post=3957"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}