How to add custom fields to albums

Share this via:

Custom fields were introduced in UM Gallery Pro version 1.0.9.7. Below will demonstrate how to add custom fields to your album form.

The Album form is divided by top and bottom fields. The top fields are above the photo uploader and these fields are album name and description while the bottom fields include the privacy options. To add custom fields, you can use the custom hook `um_gallery_pro_album_form_fields_top` and `um_gallery_pro_album_form_fields_bottom`.

function add_custom_album_field( $album = array() ) {
    $album_id = $album->id;

    ?>
    <input type="text" id="custom_field_id" value="" placeholder="Custom Field" />
    <?php
}
add_action( 'um_gallery_pro_album_form_fields_top', 'add_custom_album_field', 11, 1 );

Next, we will add a Javascript hook to capture the field value when the album is saved.

wp.hooks.addFilter(
    'um_gallery.extra_fields',
    'testCustomField',
    function() {
        return jQuery( '#custom_field_id' ).val();
    }
);

Notice, inside of the aforementioned script, we get the value from from the field inside of the function field. Next, we will take the submitted field and store it

function store_extra_field( $album = array(), $extra_fields ) {
    if ( ! empty( $extra_fields['custom_field_id'] ) ) {
        // store custom field.
    }
}
add_action( 'um_gallery_album_updated', 'store_extra_field', 11, 2 );

In an upcoming update, we will introduce album meta fields for easier store options.