Tumblr

Tumblr

🔖

A step-by-step guide to set up a Vialog on your Tumblr website.

Prerequisites:

  • Have a Tumblr website
  • Your 8-character discussion shortcode code from your relevant discussion's settings page on the Vialog Dashboard.
  • You will need these two HTML code snippets:
<script src="https://ui.vialog.app/vialog-loader.js"></script>
Vialog Loader script
<a name="vialog-YOUR_DISCUSSION_SHORTCODE"></a><div data-vialog="YOUR_DISCUSSION_SHORTCODE"></div>
Vialog embed snippet

Note: you will need to change YOUR_DISCUSSION_SHORTCODE to your 8-character discussion short-code

Example of a Vialog integration on Tumblr.
Example of a Vialog integration on Tumblr.

Steps

1. Log into your Tumblr account.

2. On your dashboard, add a new Text post or edit an existing post (wherever you want to add your Vialog widget.)

3. Click the Gear ⚙️ icon on the top right of the post and select HTML for Text editor before pasting your Vialog embed snippet.

image

4. Paste the Vialog embed snippet code and change YOUR_DISCUSSION_SHORTCODE to your 8-character discussion shortcode.

<a name="vialog-YOUR_DISCUSSION_SHORTCODE"></a><div data-vialog="YOUR_DISCUSSION_SHORTCODE"></div>
Vialog embed snippet

Enable Vialog on Tumblr

The following steps only need to be set up once. You also need to repeat the steps below if you change your Tumblr's Theme.

A) To enable Vialog to load on your Tumblr website, go to Account > Edit Appearance

image

B) At the Website Theme section, click the "Edit theme" button

image

C) At the top left, click on "Edit HTML"

image

D) Search for </body> inside the code (it should be one of the very last lines of code displayed here) and insert the Vialog Loader script before the </body> tag

<script async src="https://ui.vialog.app/vialog-loader.js"></script>

Vialog Loader script

E). First "Update Preview" then "Save"

image

That's it, you're all set! Your Vialog widget is now live on your Tumblr site!

FAQ

Q: When I try to save my custom theme, the following message appears! What should I do?

Uh oh! We couldn't save your theme. Looks like your custom theme references assets from non-HTTPS URLs. Please try again using only HTTPS URLs.
image

A: Tumblr doesn't allow you to save your template if there are any page assets, such as images or scripts, being served from insecure (HTTP) servers. Luckily, fixing this error is relatively easy! You need to ensure all absolute URLs begin with https. Using the built-in Search & Replace functionality of tumblr's HTML editor, simply change all occurrences of http:// to https://

image

Make sure to search for "httpss://". You need to change these back to https://

Once all the links have been changed, click Update Preview again, and you will then be able to Save the template changes.

Q: When I visit my Tumblr from a mobile device, the Vialog discussion is not available.

image

Go to "Edit Appearance" and then Edit Theme, and scroll down all he way down to "Advanced Options."

Make sure that "Use default mobile theme" is turned off.

Can't find what you're looking for?
Contact us
Contact us