0

I want to make a carousel gallery with WordPress Gutenberg but I'm facing an dilemma. How do I add images dynamically?

I could go and add like 10 MediaUpload but this isn't very reliable.

I'm thinking about a button that might create MediaUpload

el(MediaUpload, {
    onSelect: onSelectInfoImage,
    type: 'image',
    value: attributes.smallMediaURL,
    render: function (obj) {
      return el(components.Button, {
        className: attributes.smallMediaID ? 'image-button' : 'button button-large',
        onClick: obj.open
      },
      !attributes.smallMediaID ? i18n.__('Bild hochladen') : el('img', { src: attributes.smallMediaURL })
      )
    }
})

and the button should be something like

el(IconButton,{
    className: 'media-create',
    icon: 'no',
    label: 'Add slide',
    onClick: function (media) {
        ***spawn new media***
      }
})
-1

You can set the multiple and gallery props to {true} which enables to select multiple images and make a gallery. More information in the GitHub readme: https://github.com/WordPress/gutenberg/tree/master/packages/block-editor/src/components/media-upload

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.