Set the Default Order in the Divi Gallery Settings
By default Divi will display the images in the order that they are added to the gallery. This might be enough for you to get the order you wish. You can just add the images one at a time to the gallery in the order you want them to display. Note that you can add multiple images at once and they will be added to the gallery in the order they appear in the media library – i.e. the most recently uploaded image will appear earliest in the gallery.
Sorting the Gallery Image Modules by Drag and Drop
The Divi gallery module has a handy, though not very obvious, feature for re-ordering the images in the gallery module. You can simply drag and drop them into the order you wish them to display, like so:
Displaying the Gallery Module Images in a Random Order
To have the gallery images shown in a random order each time the page is displayed, you can simply set the following Divi option:
Gallery Settings > Content > Images > Image Order = Random
Displaying the Gallery Module Images Alphabetically
If you'd like to have the images in your gallery modules automatically sorted alphabetically, by the title set in the media library, you can use the following PHP code:
add_filter('et_pb_module_shortcode_attributes', 'dbcf_sort_gallery_by_name', 10, 3);
add_filter('et_module_shortcode_output', 'dbcf_clear_gallery_sorting');
if (!function_exists('dbcf_sort_gallery_by_name')) {
function dbcf_sort_gallery_by_name($props, $atts, $slug) {
if ($slug === 'et_pb_gallery') {
add_action('pre_get_posts', 'dbcf_gallery_orderby_title');
}
return $props;
}
}
if (!function_exists('dbcf_clear_gallery_sorting')) {
function dbcf_clear_gallery_sorting($content) {
remove_action('pre_get_posts', 'dbcf_gallery_orderby_title');
return $content;
}
}
if (!function_exists('dbcf_gallery_orderby_title')) {
function dbcf_gallery_orderby_title($query) {
$query->set('orderby', 'title');
}
}Related Post: Adding PHP to the Divi Theme
Sorting the Gallery Module Images by Filename
If you wish to sort your images by filename, this Stack Overflow post offers some options.
HI, I am not seeing this work. I posted a different comment earlier but it appears to be gone.
Here is my child theme with your code in it… What did i do wrong?
/*
Theme Name: Divi Child
Theme URI: http://elegantthemes.com/
Description: Divi Child Theme
Author: ElegantThemes
Author URI: http://elegantthemes.com
Template: Divi
Version: 0.1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: responsive-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, featured-images, full-width-template, post-formats, rtl-language-support, theme-options, threaded-comments, translation-ready
Text Domain: divi-child-theme
*/
/* ==== Add your own styles below this line ====
* ——————————————– */
/*
add_filter('et_pb_module_shortcode_attributes', 'dbcf_sort_gallery_by_name', 10, 3);
add_filter('et_module_shortcode_output', 'dbcf_clear_gallery_sorting');
if (!function_exists('dbcf_sort_gallery_by_name')) {
function dbcf_sort_gallery_by_name($props, $atts, $slug) {
if ($slug === 'et_pb_gallery') {
add_action('pre_get_posts', 'dbcf_gallery_orderby_title');
}
return $props;
}
}
if (!function_exists('dbcf_clear_gallery_sorting')) {
function dbcf_clear_gallery_sorting($content) {
remove_action('pre_get_posts', 'dbcf_gallery_orderby_title');
return $content;
}
}
if (!function_exists('dbcf_gallery_orderby_title')) {
function dbcf_gallery_orderby_title($query) {
$query->set('orderby', 'title');
}
}
*/
Hi John, your earlier comment is still there, awaiting moderation (though I'll delete it in a moment since it's basically the same as this one). The issue is that you're placing PHP code in a file meant for CSS code (style.css). You need to instead place the code in your child theme's functions.php file (if there isn't already one in the main folder of your child theme, create a blank file named functions.php and start it with a line that reads "<?php" – no quotes – to put it into PHP mode).
Thanks Dan! I literally JUST saw the options for the functions tab on the right side of the screen and went "A-HA" and came back here to grab the code again.
Works like a charm, thank you!!!!!!!
Great! Glad you got it working, John 🙂
Hi, thanks for this post. Can you reverse the order for alphabetical ordering?
Never mind! I realized I just needed to add ASC to the function.
if (!function_exists('dbcf_gallery_orderby_title')) {
function dbcf_gallery_orderby_title($query) {
$query->set('orderby', 'title', ASC);
}
}
Great! I'm glad you figured it out Justin and thanks for sharing 🙂