Cacher is the code snippet organizer for pro developers

/**
* Demo Styles for GW Multi-file Merge Tag
* https://gravitywiz.com/customzing-multi-file-merge-tag/
*/

.gw-file { float: left; margin: 0 5px 20px; width: 29.2%; }
    .gw-video video,
    .gw-video object,
    .gw-video embed { margin: 0; min-height: 120px; background-color: #111; border-radius: 3px; display: block; }
.gw-file a:first-child { display: block; min-height: 120px; max-height: 120px; overflow: hidden; border-radius: 3px; background-color: #eee; }
    .gw-text a:first-child { background: #eee url( '../images/gw-text-icon.png') no-repeat center center; text-indent: -999em; }
    .gw-pdf a:first-child { background: #eee url( '../images/gw-pdf-icon.png') no-repeat center center; }
.gw-file a { text-transform: uppercase; font-size: 11px; }

<?php

/**
* Demo Config for GW Multi-file Merge Tag
* https://gravitywiz.com/customzing-multi-file-merge-tag/
*/

gw_multi_file_merge_tag()->register_settings( array(
    'form_id' => 27,
    'markup' => array(
        array(
            'file_types' => array( 'jpg', 'jpeg', 'png', 'gif' ),
            'markup' => '<div class="gw-file gw-image gw-{ext}"><a href="{url}"><img src="{url}"></a><a href="{url}">{filename}</a></div>'
        ),
        array(
            'file_types' => array( 'pdf', 'txt' ),
            'markup' => '<div class="gw-file gw-text gw-{ext}"><a href="{url}"><span>{filename}</span></a><a href="{url}">{filename}</a></div>'
        ),
        array(
            'file_types' => array( 'mp4', 'ogg', 'webm' ),
            'markup' => '<div class="gw-file gw-video gw-{ext}"><video><source src="{url}" type="video/{ext}">Your browser does not support the video tag.</video><a href="{url}">{filename}</a></div>'
        ),
        array(
            'file_types' => array( 'ogv' ),
            'markup' => '<div class="gw-file gw-video gw-ogv"><video><source src="{url}" type="video/ogg">Your browser does not support the video tag.</video><a href="{url}">{filename}</a></div>'
        )
    )
) );