This code snippet allows you to control Divi’s default image size generation directly from your WordPress dashboard. By adding a custom settings page under Settings > Divi Image Sizes, you can easily enable or disable the creation of additional image sizes that Divi generates when you upload images. Disabling these extra image sizes can help optimize your site’s performance and save server storage space.
Disable Divi Image Generation
Details
Snippets Demo
Code
Description:
Adding this code to your functions.php file will give you an additional option under Settings called Divi Image Sizes where you can toggle whether it generates additional image sizes for images you upload.
Language: PHP
Where to add: functions.php
/**
* Create a custom settings page for Divi Image Sizes.
*/
function mytheme_add_settings_page() {
add_options_page(
'Divi Image Sizes', // Page title
'Divi Image Sizes', // Menu title
'manage_options', // Capability
'divi-image-sizes', // Menu slug
'mytheme_render_settings_page' // Callback function
);
}
add_action( 'admin_menu', 'mytheme_add_settings_page' );
/**
* Render the settings page content with branding and promotional message.
*/
function mytheme_render_settings_page() {
?>
<div class="wrap">
<h1><?php esc_html_e( 'Divi Image Sizes', 'mytheme' ); ?></h1>
<!-- Info Box Start -->
<div class="de-info-box" style="border: 1px solid #ccd0d4; background-color: #f1f1f1; padding: 15px; margin-bottom: 20px; display: flex; align-items: center;">
<img src="https://diviengine.com/wp-content/uploads/2023/12/logo.png" alt="Divi Engine Logo" style="max-width: 150px; height: auto; margin-right: 20px;">
<p style="margin: 0; font-size: 14px; color: #23282d;">
<?php esc_html_e( 'Get 10% off any plugin or All-Access Pass with the coupon code ', 'mytheme' ); ?>
<strong>snippetengine</strong>
<?php esc_html_e( ' at ', 'mytheme' ); ?>
<a href="https://diviengine.com" target="_blank" style="color: #0073aa; text-decoration: none;"><?php esc_html_e( 'diviengine.com', 'mytheme' ); ?></a>.
</p>
</div>
<!-- Info Box End -->
<form method="post" action="options.php">
<?php
settings_fields( 'mytheme_settings_group' );
do_settings_sections( 'divi-image-sizes' );
submit_button();
?>
</form>
</div>
<?php
}
/**
* Register settings, sections, and fields.
*/
function mytheme_register_settings() {
register_setting(
'mytheme_settings_group', // Option group
'disable_divi_image_sizes' // Option name
);
add_settings_section(
'mytheme_settings_section', // ID
__( 'Divi Image Size Settings', 'mytheme' ), // Title
null, // Callback
'divi-image-sizes' // Page
);
add_settings_field(
'disable_divi_image_sizes', // ID
__( 'Disable Divi Image Size Generation', 'mytheme' ), // Title
'mytheme_disable_divi_image_sizes_callback', // Callback
'divi-image-sizes', // Page
'mytheme_settings_section' // Section
);
}
add_action( 'admin_init', 'mytheme_register_settings' );
/**
* Callback function to render the checkbox field.
*/
function mytheme_disable_divi_image_sizes_callback() {
$option = get_option( 'disable_divi_image_sizes' );
?>
<input type="checkbox" name="disable_divi_image_sizes" value="1" <?php checked( 1, $option, true ); ?> />
<label for="disable_divi_image_sizes"><?php _e( 'Check to disable Divi image sizes', 'mytheme' ); ?></label>
<?php
}
/**
* Disable Divi image sizes based on the settings page option.
*/
function disable_divi_image_sizes() {
if ( get_option( 'disable_divi_image_sizes' ) ) {
// Remove all image sizes registered by Divi
remove_image_size( 'et-pb-post-main-image' );
remove_image_size( 'et-pb-portfolio-image' );
remove_image_size( 'et-pb-portfolio-module-image' );
remove_image_size( 'et-pb-gallery-module-image' );
remove_image_size( 'et-pb-fullwidth-image' );
}
}
add_action( 'after_setup_theme', 'disable_divi_image_sizes' );
/**
* Disable WordPress intermediate image sizes based on the settings page option.
*/
function remove_default_image_sizes( $sizes ) {
if ( get_option( 'disable_divi_image_sizes' ) ) {
return array();
}
return $sizes;
}
add_filter( 'intermediate_image_sizes_advanced', 'remove_default_image_sizes' );
Related Snippets
Easy | CSS
How to Align the Search Button in Divi Engine Filter: A Simple CSS Snippet
Aug 27 2024
Explore more from Divi Engine
Divi Form Builder
From simple contact forms to complex frontend post or product creation, Divi Form Builder has you covered.
Divi Machine
Build complex websites that displays dynamic fields you can filter, search and so much more with the Divi Builder.
Divi BodyCommerce
A versatile toolkit for developers using Divi and WooCommerce together, designed to boost your e-commerce site and achieve greater conversion rates.
Divi Handoff
Let clients update content without touching the Divi Builder. Design layouts once, connect them to Flexible Content fields, and give editors simple forms for text, images, and sections.
Divi Loop Extender
Unlock the Full Power of Divi 5 Loop Builder Add advanced sorting, filtering, and relationship logic right inside the Visual Builder.
Divi Membership
Monetize your Divi websites by transforming them into membership sites with seamless subscription management, user-friendly interfaces, and customizable membership tiers.
Divi Machine Accounts
Build an account area for your customers to edit their details, access wishlist, submitted posts and more. *Note: Requires Divi Machine installed and active
Divi Ajax Filter
Filter WooCommerce, Posts & Custom Posts without reloading the page.
Divi Mobile
Divi Mobile helps you create beautiful looking mobile menus without having to code.
Divi Nitro
Give your Divi website that extra boost of speed with our Divi Nitro plugin to enhance your customer's experience.
Divi Protect
Password protect the content of your Divi website with our Divi Protect plugin. Keep unwanted eyes out!
Divi Mega Menu
Create stunning, responsive, and content-rich mega menus using the Divi Builder you already know. No coding required.