how to use media library

The question:

hello i want to use wordpress media library .
i want to user see the library when click on button i made and choose a picture and i get a link of picture wich user choosed .
actualy i want to learn how we should use this library

<button type="button"  class="button button-primary">choose picture</button>

i will be so happy to you guys to answer or link some docs to study them.

The Solutions:

Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.

Method 1

Take a look at wp_enqueue_media funciton. It enqueues all scripts, styles, settings, and templates necessary to use all media JS APIs.

Then you can execute wp.media function:

  var button = document.querySelector('.button');

  button.addEventListener('click', function(e) {
    e.preventDefault();

    var frame = wp.media({
      title: 'Frame title',
      multiple: false
    });

    frame.on('select', function () {
      var attachment = frame.state().get('selection').first().toJSON();

      alert(attachment.url);
    });

    frame.open();
  });

More detailed guide: https://codex.wordpress.org/Javascript_Reference/wp.media


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Comment