Top
Whatfix Slideshows
  • 1 minute to read
  • Print
  • Dark
    Light

Whatfix Slideshows

  • Print
  • Dark
    Light

One of the outputs that Whatfix supports is a slideshow. Slideshows can be embedded into your knowledge base. The advantage with slideshows is that whenever there is a UI change on your application, all you need to do is update the associated walkthrough. The slideshow content is automatically updated in your knowledge base. The users can see the flow as a slideshow or run them live.


To embed a slideshow,
  1. Navigate to the Whatfix Dashboard.
    gotoDashboard%20%282%29.png

  2. Open the walkthrough you want to embed and click Embed drop-down menu.
    embed_video_export

  3. Click Slideshow.
    Embed_slideshow

  4. Configure the appearance and order of your slideshow using the options available. 
    embed_ss_options.png

  5. Select the language in which you want to display the Slideshow content.
    This option is available only if you have translated the content in a different language in the languages page. If not, skip this step. 
    slideshow_lang_dropdown.png

  6. Depending on the environment and format that you are working on, copy the respective HTML/ code. 
    embed_ss_copy_code_button.png

  7. Paste the copied code in your content in the place where you want to display the slideshow.

Note
  • Changes made to the task are automatically reflected in the embedded slideshow once the associated walkthrough is updated.
  • If you use CDN servers, you need to push your changes to production before the updates are visible in multi formats.
  • The first page of the slideshow provides slideshow details.

Customizing the size of the slideshows:

By changing the following attributes in the div element, you can control the slideshow size:

While using the Div Embed options:

data-size = "custom"

data-height = "<height>"

data-width = "<width>"

Div Embed

Sample div: &lt;div data-href=&quot;//whatfix.com/deck.html&quot; data-flow=&quot;&lt;flow_id&gt;&quot; data-suggest=&quot;1&quot; data-size=&quot;custom&quot; data-height=&quot;700&quot; data-width=&quot;850&quot;&gt;&lt;/div&gt;

While using the iFrame Embed options:

Modifythe height and width property of the inline CSS ofIframeelement.

Add height and width properties to the URL parameters.

Add "custom" at the beginning of the URL hash.

Iframe Embed

src=&quot;//whatfix.com/&lt;ent_id&gt;/deck.html?suggest=1&amp;closeable=false&amp;height=700&amp;width=850#!custom/&lt;flow_id&gt;/&quot;&gt;&lt;/iframe&gt;
Note
If your knowledge base requires that external content is embedded in an iframe, then click the respective button to copy the code that must be included inside iframe so that you can display the slideshow.
Was this article helpful?