iFrames can help you to create an information-rich workspace. Share a Spotify podcast about an interesting topic, stay informed about the weather forecast, or keep your colleagues updated on news within your company with a YouTube video. There are endless possibilities with iFrames, which you can use to integrate any web content into your digital workspace. Want to learn how you can do this? In this blog, I will explain how to use the Web Content Tile within Workspace 365 and give you seven examples of content you can integrate using iFrames.

# 1. Embed a Spotify podcast playlist

Does your company have a podcast? Why not integrate it into your digital workspace? Besides music playlists or albums, Spotify also has a fast-growing selection of business podcasts. This allows you to share important information or an interesting topic with your colleagues and keep them up to date.

How do you integrate Spotify playlists? The only thing you have to do is:

  • Go to your Spotify App.
  • Select your preferred podcast playlist.
  • Click on the three dots – Share – Copy Embed Code.

How to embed any web content in Workspace 365

To proceed, you need to know how to add web content to Workspace 365, for example this Spotify podcast playlist. This is the same step for any iFrame that you’d like to embed in the workspace.

  • After you’ve copied the embed code, you go to the App store > New App > Web content.

  • Paste the Embed code in the ‘Embed code’ field.

<iframe src=”https://open.spotify.com/embed-podcast/show/1EOL2H2Yqic5L5GgOqDVYf” width=”100%” height=”100%” frameborder=”0″ allowtransparency=”true” allow=”encrypted-media”></iframe>

  • Choose whether you want to show the header and footer of the Live tile.
  • For the Live tile navigation URL you go to the Spotify App again, click on the three dots – Share – Copy Show Link.
  • Choose who has access or add owners for this app.
  • Last but not least, you can change the name of the app, for example to ‘Spotify Podcast’, and adjust the icon of the app by clicking on it and selecting your preferred icon or change the colour from default to a customised colour.
  • Now click on ‘Save and Back’ and you are done creating the app!
  • To add the tile to your workspace. Click on ‘Add tiles’ in the menu on your workspace. Search for the app you want to display in your workspace, in this case ‘Spotify Podcast’. Select the app Spotify Podcast and click on ‘Add to workspace’.

  • Voilà, here you have your podcast playlist, now integrated into your digital workspace.

 

# 2. Add your Twitter timeline

Do you use Twitter within your company? You can easily integrate Twitter within your digital workspace using an iFrame. Share news or updates istantly via the latest tweets.

  • To display your own Twitter profile, you can use the link below or go to Twitter Publish and enter the URL you would like to integrate/embed.

  • When using the link below, make sure to change the name to match your own profile.

<div align=”center”><a class=”twitter-timeline” data-width=”600″ data-dnt=”true” data-tweet-limit=”4″ href=”https://twitter.com/NewDayatWork?ref_src=twsrc%5Etfw”>Tweets by NewDayatWork</a><script async src=”https://platform.twitter.com/widgets.js” charset=”utf-8″></script></div>

  • To add it to your workspace, follow the steps explained in ‘’How to embed any web content in Workspace 365’’.

Now your Twitter timeline is integrated into your workspace.

# 3. Stay up to date with the weather forecast

It’s always handy to stay updated about the weather. Especially for mobile workers who have to travel around while using their workspace. A mailman who needs to run a delivery or a district nurse who needs to go outside, they might want to plan their schedule to dodge the rain. That is why you can integrate live weather forecasts within your digital workspace using iFrames.

  • Go for example to Meteoblue, enter your location and how you want to display it (Fahrenheit or Celcius)
  • Copy the iFrame code to embed

 

To stay updated on the rainfall worldwide, you can add the Rainviewer.

  • Click on the embed button to get the iFrame code or copy the code below.

<iframe src=”https://www.rainviewer.com/map.html?loc=40.7831,-73.9712,4&oFa=0&oC=0&oU=0&oCS=1&oF=0&oAP=0&rmt=4&c=1&o=83&lm=1&th=0&sm=1&sn=1″ width=”100%” frameborder=”0″ style=”border:0;height:50vh;” allowfullscreen></iframe>

  • To add it to your workspace, follow the steps explained in ‘’How to embed any web content in Workspace 365’’.

# 4. Add a favourite location with Google Maps

Show an important location or your office within your workspace with Google Maps, making it easier for people to quickly navigate to the office.

  • Go to Embed Google Map, enter your location and get the HTML/iFrame code.
  • Make sure to change width and height to 100%, or use the code below and change the address and place.

<div class=”mapouter”><div class=”gmap_canvas”><iframe width=”100%” height=”100%” id=”gmap_canvas”src=”https://maps.google.com/maps?q=Berencamperweg%2C%20nijkerk&t=&z=13&ie=UTF8&iwloc=&output=embed” frameborder=”0″ scrolling=”no”marginheight=”0″ marginwidth=”0″></iframe><ahref=”https://www.embedgooglemap.net/blog/20-off-discount-for-elegant-themes-divi-sale-coupon-code-2019/”>elegantthemes</a></div><style>.mapouter{position:relative;text-align:right;height:500px;width:600px;}.gmap_canvas{overflow:hidden;background:none!important;height:500px;width:600px;}</style></div>

 

  • To add it to your workspace, follow the steps explained in ‘’How to embed any web content in Workspace 365’’.

# 5. Share news, updates and other important information with a YouTube video

Studies have shown that people are more likely to remember information from a video, than when they, for example, have to read an article. Therefore, it can be a good idea to integrate videos within your digital workspace. So, here is how to embed a YouTube video about an interesting topic, or just a company update video.

  • Go to the video on YouTube you want to integrate.
  • Click on the ‘Share’ button below the video.
  • Click on embed

  • Make sure to change the width and height to 100%, or use the code below and change the URL to the video you want to embed.

<iframe width=”100%” height=”100%” src=”https://www.youtube.com/embed/y4wE2HmxkIo” frameborder=”0″ allow=”accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture” allowfullscreen></iframe>

  • To add it to your workspace, follow the steps explained in ‘’How to embed any web content in Workspace 365’’.

# 6. Create a scrolling YouTube playlist

If you want to show more videos in one glance, you can create your own scrolling YouTube playlist.

  • Go to Feedwind and sign up to create the first one for free.
  • Enter the RSS URL of your YouTube channel or playlist. Don’t you know how to create this? Then read the blog: Get a YouTube RSS Feed URL from your channels.
  • Copy and paste the link in the ‘Type new URL’ section.

 

  • Scroll down to set your own settings, such as font colour.
  • To display the thumbnails, scroll down to ‘Style’ and select ‘Thumbnail selection’ – ‘Media Thumbnail’.
  • To get the iFrame code to embed it into your workspace, click on the ‘Save & Get code’ button on the top-right of the page. Make sure you get the iFrame version of the code.

  • Follow the steps explained in ‘’How to embed any web content in Workspace 365’’, and you will see your YouTube playlist within your workspace.

# 7. Show your visualised data in your workspace with Tableau

Tableau is Business Intelligence software that helps to visualise your data. It’s a paid service for which you need an account. Here you will find more information about how you can embed Tableau statistics within your workspace. To add it to your workspace, follow the steps explained in ‘’How to embed any web content in Workspace 365’’.

Integrate any website or application you want

The examples above give you a great start to create an information-rich workspace. Embedding web content in your workspace allows you to integrate any website or application you want, by using the code below or by developing your own Web Content tile.

Some websites or applications block the usage of iFrames, in which case you might have to contact their service desk to request if they can make an exception for your digital workspace.

The code to integrate any website

<iframe width=”100%” height=”100%” src=”https://workspace365.net“</iframe>

Within this iFrame code you just have to change the website URL. After that you can simply follow the steps explained in ‘’How to embed any web content in Workspace 365’’ and your preferred website is displayed in your digital workspace.

What do you want to integrate using iFrames?

Are you already stunned by all the possibilities that these iFrames provide for your digital workspace? Or are you still missing an integration? Please contact us and let us know which web content you’d like to embed with iFrames. We bet you have amazing ideas as well and are curious about new ideas for web content to integrate into the digital workspace.

 

Other articles you may find interesting as well:

Where to find the SharePoint RSS feed URL in Office 365

What can you do with the Workspace 365 App Store?

How to: Create a mixed RSS feed for your digital workplace

Mark Grasmayer

Mark Grasmayer

Product Evangelist

Do you want to discover more about Workspace 365? Check out other articles. Feel free to contact us if you have any questions or visit our Support Portal.

Update: create events in The Hub

Update: create events in The Hub

It's now possible to create an event in your digital workplace. Invite colleagues to an online, physical or hybrid event, and use it for training sessions, your annual staff outing, an online workshop, or anything else relevant to you.The Hub: the central point in...

The Digital Employee Experience (DEX) trends 2023

The Digital Employee Experience (DEX) trends 2023

Digital Employee Experience (DEX) plays an important role within organisations. With many organisations now working remotely and hybrid, optimising the DEX has become even more crucial. After all, it allows them to ensure that employees continue to feel engaged with...