Knowledge Base

Integrate Bynder with Wordpress

By integrating Bynder and Wordpress, you can use Bynder assets in your Wordpress environment. With our latest plugin. which makes use of our Compact View, you can now add images, videos, audio files as well as documents to your Wordpress content easily.

Note

This integration is for Wordpress 4. Click here if you want to integrate your Wordpress 5 instance with Bynder.

Watch a video

  1. Create a new page or post or edit an existing one by clicking on the edit button in Wordpress.

    Note

    Make sure any popup or ad blocker is disabled, since this could prevent the Wordpress plugin from working correctly

  2. Click Add Media.

  3. Click Insert from Bynder.

    Note

    If your company's Bynder URL is already filled in in the pop-up, click continue. If not, enter the URL in the following format:

    https://myCompanyName.getbynder.com
  4. Click on the Continue button. A popup will open, which allows you to login to the connected Bynder environment.

  5. Login to the portal in the usual way. Click on Yes if you want to allow the Compact View to fetch the assets from the portal. The latest version of the Compact View allows you to easily search and filter for the assets you are looking for.

  6. Use the filter bar to filter or search for the assets you need.

  7. Select the files(s) in the Compact View and click on rAdd media to add the asset(s) to your Wordpress page.

    Example (click to enlarge)

    wordpress_plugin_add_image.gif
  1. Download the Wordpress plugin ZIP file.

  2. Go to your Wordpress website.

  3. Go to Plugins and click on Add New.

    install-wordpress.png
  4. Click Add Plugin.

  5. Select the downloaded ZIP file and install the plugin.

  6. (Optional) Go to Settings > Bynder and define your Bynder URL. Save your changes.

  7. Note

    Make sure that the Bynder URL you enter in the Wordpress admin settings has the following format:

    https://myCompanyName.getbynder.com

    If you do not define your Bynder URL, you will have to provide every time you want to insert a file from Bynder to Wordpress.

  8. (Optional) You can configure the derivative Wordpress makes use of. Check out the Derivative configuration section for more information.

Image files

By default we make use of the 'webimage' derivative for image files. This means that instead of the original file the 'webimage' derivative is added to your Wordpress content. It is possible to make use of one of the alternative default derivatives or one of your custom public derivatives. To change the image derivative used, open the plugin package. Go to the folder views and open the file container.php. On line 33 replace the value 'webimage' with the name of the derivative you want to make use of.

var thumbnail = asset.thumbnails['webimage'];

Video files

By default we make use of the 'mp4' video derivative, but you can also make use of the other format 'webm' that we offer. To change the video derivative used, open the plugin package. Go to the folder views and open the file container.php. On line 39 replace the value 'webm' with the name of the derivative you want to make use of.

var videoURL = asset.videoPreviewURLs.filter(function (url) { return url.match(/mp4$/) })[0];

Learn more about derivatives here.

To deactivate the plugin go to Settings > Installed plugins and click the Deactivate hyperlink in the Bynder section.

Learn more