Home Forums Add-ons Gallery Field Edit the "acf-gallery-side-info" content


Edit the "acf-gallery-side-info" content

    • feyfey

    • April 25, 2019 at 10:06 pm

    Hi all,

    I want to edit the “acf-gallery-side-info” <div> content of the Gallery Field in order to add a “download” link to the “actions” <p>.

    To explain my wish : We are an association and we use some parts of the backend as working space and some Gallery Fields in Custom Post Type are used to store files. If someone put a file in a Gallery Field I want to be able to download it with no needs to open the WordPress Media Manager.

    I first try to add the link with some Jquery but the “acf-gallery-side-info” <div> is populated on click so my code doesnt works :

    	function acf_gallery_download_link() {
    		if ( !is_admin() ) { return; }
    		<script type='text/javascript'>
    			( function ( $ ) {
    				$( document ).ready( function () {
    					$('.acf-gallery-side-data .actions .acf-gallery-edit').before('<a href="MyURL" target="_blank" class="acf-gallery-download">Download</a>');
    			}( jQuery ) );
    	add_action( 'admin_footer', 'acf_gallery_download_link' );

    I found the “acf-gallery-side-info” <div> content is populated in the plugin by the function render_attachment but it’s “Bad” to edit directly the plugin =D.

    Do you know how I can do it ?

    Thanks all !

  • See the JS API documentation. After ACF inserts the sidebar in the gallery it runs the append action The value $el here is the sidebar data. You could possibly create an action on this hook that could insert the download link. (?)

    Unfortunately, that’s as much as I can give you. I don’t know all the details on exactly what would need to be done to accomplish this, only the place to start looking.

    • feyfey

    • August 4, 2019 at 5:24 am

    Hi John,

    I needed a looooong time to solve the entire issue but the JS API append action is exactly what I was looking for.

    If someone want the complete solution I use in a PHP function file :

    // Add a AJAX action to get attachement URL by ID in JS
    add_action( 'wp_ajax_get_media_url', 'get_media_url' );
    add_action( 'wp_ajax_nopriv_get_media_url', 'get_media_url' );
    function get_media_url() {
    	if ( isset( $_POST['att_id'] )) {
    		$attachement_id = $_POST['att_id'];
    		$attachement_url = wp_get_attachment_url( $attachement_id );
    		echo $attachement_url;
    	} else  {
    		echo '#';
    // JS to add the download link
    function acf_gallery_download_link() {
    	if ( !is_admin() ) { return; }?>
    	<script type='text/javascript'>
    			( function ( $ ) { $( document ).ready( function () {
    				acf.addAction('append', function( $el ){
    					var attachement_id = $el.find(".actions").children(".acf-gallery-edit").attr("data-id");
    					var data = {
    						'action': 'get_media_url',
    						'att_id': attachement_id,
    					$.post(ajaxurl, data, function(response){
    					     var attachement_url = response;
    					     $el.find(".actions").children(".acf-gallery-edit").before('<a href="'+ attachement_url +'" target="_blank" class="acf-gallery-see" data-id="'+attachement_id+'">See</a>');					
    		}( jQuery ) );
    add_action( 'admin_footer', 'acf_gallery_download_link' );
Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.