How can I config Image Size in Wilcity?

Notice: Screenshots in this tutorial are shortcodes of King Composer page builder. You will find the same setting if you are using Elementor or WP Bakery Pagebuilder

Setting up Custom Size:

Step 1: Activate Child Theme

Step 2: Put the following functions to functions.php of Child Theme

add_action( 'after_setup_theme', 'wilcityChildThemeImageSizes');
function wilcityChildThemeImageSizes() {
// 300 pixels wide (and unlimited height)
add_image_size( 'wilcity_360x200', 360, 200, true ); // (cropped)
add_image_size( 'wilcity_500x500', 500, 500, true ); // (cropped)

The code should after <?php syntax

You can put more size if you want by using add_image_size function. However, We recommend you should not add too many image sizes.

Step 3: Setup ReGenerate Thumbnail plugin

  1. Click on Plugins -> Add New
  2. Search for Regenerate Thumbnail
  3. Install and activate this plugin
  4. Click on Tools -> Regenerate Thumbnail -> Run it

1. Hero Image Size

I recommend using the large key. If you want to use full key (Using original size), I recommend uploading an image of 1200 x 800px

2. Configuring Listing Slider / Listing Grid Image Size

You can configure image size of these shortcodes by clicking on Pages -> [The page contains this shortcode ] -> Edit Listing Slider / Listing Grid -> Image Size / Desktop Image Size.

3. Configuring Taxonomy Image Size

Taxonomy page is Listing Category / Listing Location / Listing Tag page. To configure Image Size of the taxonomy page, please click on Appearance -> Theme Options -> Customize Taxonomies -> Custom Taxonomy Image Size

Default Image Size Setting: wilcity_360x200

4. Configuring Search Without Map / Map Image Size

Click on Pages -> That Page -> Search Without Map Settings -> Image Size

Default Image Size Setting: wilcity_360x200

5. Changing Single Listing Image Size

Click on Settings -> Media -> Change Large setting

Default Image Size: large. I recommend an image size of 1200x800px

6. How to increase the default image sizes.

  1. From the admin sidebar, click on Plugins -> Add New -> Installs and activates Simple Image Sizes plugin
  2. Installs and activates Regenerate Thumbnails plugin
  3. Now clicks on Settings -> Media -> Here you will see all image sizes -> You can change to the size you want
  4. Finally, clicks on Tools -> Regenerate Thumbnails  -> Executes it

Leave A Comment?