Embedded Projects On A Website

A Visme can be easily embedded to any website or blog. The process is very similar to embedding objects from other popular third-party platforms (i.e., YouTube)

Once your project is ready to be downloaded, click on the “Share” button located on the top right corner of the editor window.

A pop-up will appear allowing you to choose how to share your project. Click on the “Embed” button and then click on the “Publish” button.

Select the option that best suits your website between Responsive Size and Fixed. Then, copy the code generated by clicking on the “Copy” button.

Tip:
You’ll need to insert this directly into the HTML code of your website. Nearly all site builders and CMS have the ability to insert HTML code snippers into web pages. If you are not sure how to insert it, refer to your website’s documentation or contact your webmaster/web designer for assistance.

Here’s an example of how embed code is added to WordPress, which is the most popular open source blogging/website platform.

Locate the page in which you want to add your HTML code. Click on the Text tab shown.

Now paste the embed code that you copied from your Visme Project.

What is the difference between Responsive and Fixed Width?

Responsive is where your Visme project automatically adjusts to the width of the embed container. On the other hand, A Fixed Width will instruct the code to display your content using the exact pixel width you set for your Project in the Editor window. If needed, you can edit this width by navigating to the menu at the top left of the Editor above the sidebar, and selecting Canvas Size.

Viewer Functionality after Embed is complete

After your Project has been embedded to your website, streamlined controls will be available for the viewer.

Using the arrow buttons, the viewer can navigate through the slides both forwards and backwards.

To the right of the control bar, the viewer can also choose to Mute/Unmute the Project, Share it, or expand it to a Fullscreen view.

Remember, if you don’t want your viewers to be able to use the Control Bar, you can disable it. In the Editor window, navigate to the top left menu above the sidebar and select Publish Settings.

Click the Advanced Settings tab, then set the Control Bar to OFF. This will remove the control bar from the embed code of your project.

NOTE:
Some third-party platforms and hosts do not support embeds of third party codes, or pose limitations to those embeds. For example, WordPress websites hosted on WordPress.com pose such restrictions.

Embedded Projects On A Website

What is the difference between Responsive and Fixed Width?

Viewer Functionality after Embed is complete

Visme 101