Knowledge Base

Integrate Bynder with Wordpress 5

By integrating Bynder and Wordpress, you can use your latest Bynder assets in your Wordpress environment. With our latest plugin, which makes use of our Compact View, you can now add image, video and document assets to your Wordpress content easily.

Tell me more about the plugin

With our Wordpress 5 plugin you can add your Bynder assets to your Wordpress 5 website directly from within Wordpress. By making use of the Bynder reference URLs and our automatic CloudFront invalidation process the plugin ensures that when you update your assets in Bynder the latest version is also automatically reflected on your website. The integration uses custom Bynder blocks for single images and video assets. The Gallery Block is used to showcase multiple image or video assets.

Use the plugin

  1. Click + New to create a new page or post. Alternatively you can edit existing content.

  2. Click the add_content.png to create a new block.

  3. Click wordpress5_bynder_io_wp-admin_post_php_post_634_action_edit.png Bynder Asset if you want to add a single asset or click wordpress5_bynder_io_wp-admin_post_php_post_634_action_edit.png Bynder Gallery if you want to add multiple assets or a collection.

    wordpress5_adding_block.png

    Click to see an example of adding a block

  4. Click Open Compact View. The Compact View will open. If your company's Bynder portal URL is already filled in in the pop-up, click Connect. If not, enter the URL in the below format. A popup will open, which allows you to log in to your Bynder environment.

    https://YourPortalURL.com

  5. Log in to the portal in the usual way.

  6. In the Asset tab use the filter bar or search bar to filter and search for the assets you need. Select the files(s) you need and click Add media to add the asset(s) to your Wordpress page. In the Collection tab select the collection that you want to add or click the collection and select the file(s) you want to add. Click Add media to add the asset(s) to your Wordpress page.

    Tip

    You can also use Bynder's embed code in combination with the Wordpress Custom HTML block to embed a single asset or collection. Learn more about embedding assets here.

Installation and configuration

  1. Download the plugin here if you want to use the following derivatives:

    • webversion (for images)

    • mp4 ( for videos) then they should use the following plugin  

    Download the plugin including the source code here if you want to further configure the derivatives used. This version allows you to extend the plugin or select other public derivatives for images and video

  2. Go to your Wordpress website.

  3. Go to Plugins and click Add New > Upload plugin.

  4. Click Choose file, select the ZIP file you downloaded before and click Install Now.

  5. Once the installation has finished go to Settings > Bynder to set up the configuration for the asset tracker. Enter the URL of your Bynder portal in the Portal domain field. Enter the permanent token for the Wordpress 5 installation in the Permanent token field. Read more about permanent tokens here.

    wordpress5_tokens.png

    Click to see an example of the Asset Tracker configuration

  6. In the Derivatives section you can configure the derivative Wordpress makes use of. Click Fetch derivatives to retrieve the available derivatives and click the Image derivative dropdown to select one of the available derivatives that you want to use.

  7. Click Save changes to save your configuration.

Deactivate the plugin

To deactivate the plugin go to Plugins  in the side menu and click Deactivate in the Bynder plugin section.

Limitations

  • Bynder audio assets cannot be added via the Wordpress 5 plugin.

  • The Wordpress functionality Featured Images is not supported for Bynder assets.

In this section: