Dynamic content enables you to create your own translations and reference them in macros, triggers, and other automations using a placeholder. In addition, dynamic content supports HTML code. For example, if you have Guide Professional and Support Professional or Enterprise, you can create a dynamic content item to dynamically change your Help Center's design based on the customer's language.
Let's say that your company targets the French and English speaking markets. You would therefore like to have a different footer on your Help Center to provide different contact information based on your customer's language. Or maybe, for a better customer experience, you'd like to display the French support number only to French speaking customers. In this article, you'll learn how to set this up.
This article contains the following topics:
Creating a new dynamic content item
You need to be a Zendesk Support administrator to create dynamic content. In this example, you'll create a dynamic content item with a French variant and add the HTML code of the footer you'd like to be displayed for French speaking customers. Dynamic content allows you to choose a default language. A good best practice is to English if your customer selects a language for which you don't have a footer translation.
- Click the Admin icon (
) in the sidebar, then select Dynamic Content .
- Click Add Item .
- Choose a name, such as footer or HC_footer to more easily find your Help Center related dynamic content later.
- Select a default language such as English.
- Paste the HTML code you want to display for English speaking customers in the content box.
- Click Create to save your dynamic content item.
- Notice the item's name between curly brackets. You'll use that later on.
- Now add one or more other translations. To do so, click Add Variant and follow steps 3-6 again.
Your dynamic content ready. Now, you can add it to your Help Center.
Modifying your Help Center theme
- In Guide, click the Customize design icon (
) in the sidebar.
- Click the theme you want to edit to open it.
- Click the options menu, then select Edit Code.
- This example modifies the footer so open the Footer template.
- Use the following syntax to insert the dynamic content item we created above: {{dc ' item_name '}}.
- Click Save and you'll be able to see the newly added footer.
- Click Publish changes.
Now, your custom footer on your Help Center and the text will be displayed based in the language your customers select on the homepage.
This article covered only the footer but you can go further than that. You could have a completely different look & feel based on your customer's language. Or maybe the product you're selling has a different name in French than in English; in this case you can use dynamic content to display a different logo based on the customer's language.
44 Comments
Is it possible to use dynamic content in an help center article as well?
For example localized URLs?
@Andreas
Dynamic Content placeholders will not work in articles, unfortunately. As a workaround, you can remove the language identifier from the URL (en-us, for example) and it should display in the language chosen by the end-user. I hope this helps answer your question!
Hi,
I get an error messade that it's not possible to save because of the unvalid reference on row 3 (my {{dc.welcome}} ). I creates one dc in swedish and one in english, can that be the problem?
Hi Eva!
Did you create two separate dynamic content items, or one dynamic content item with two variants? I think that if you have two different DC items with no variants the placeholders won't work.
Hi @Eva I was having the same problem, in order to fix it you should call your dynamic content as follows:
{{dc 'welcome'}}
That is, replace the . for a space and use sigle quotes around your dynamic contente title.
Hope this helps, cheers.
Hello,
Can we use dynamic content in JS file?
Thanks
Hi Anil,
I'm afraid that it is not possible to use dynamic content in a JS file.
As a workaround, what you can do is to create a hidden input field and within that place the dynamic content as its value. Make sure to create an ID for that so that you may use that as a reference in your JS file. I hope that helps.
This is awesome! Thanks Arnaud!
The only way to use DC in JS is if we put JS code into HTML script tag on any of pages (or header/footer).
The same thing is about using DC into CSS (putting CSS in HTML with style tag). eg:
Hi Vladan,
Does this mean that if you use dynamic content in JavaScript in a <script> tag, you could use JS to replace content in your article with dynamic content when it's published?
For example, you could write something like this in the WYSIWYG editor:
"Use {{menu}} to delete a comment".
Then use JS in the template to replace {{menu}} with some dynamic content?
Hey Jake, unfortunately, it will not work on that way, cause you can't use DC as article content (in the WYSIWYG editor). We can put DC in article HTML template but in that case, DC item will be visible to any of articles.
Hi,
How can I add dynamic content to the Help Center search Helper: {{search submit=true instant=true class='search search-full' placeholder='{{dc 'hc-home_page_heading_search'}}'}}
I want my dynamic content inside the placeholder tag.
Hey Karsten! I see that Trapta was able to help you with this over here. Let us know if you need anything else!
got some weird thing. Created an dynamic content which is active. I copied the placeholder name + pasted it inside the template code. But when i try to save i get: not possible to access `dc` in `dc.helpdesk_submit_request_button`
More people have this? or some info why dc can't be accessed?
Hi Paul,
There's a notation difference in how the placeholder is used, maybe that's what is causing your error?
Your placeholder in Zendesk support:
Your placeholder should look like this in the html templates:
Hope that helps you out!
Thanks. that works :) i copied the placeholder name from the zendesk page. Forgot the ' ' :)
This is fascinating. Does this work, even if English is the only language used for creating the dynamic content? And are there specific pages where this can be inserted into the Guide templates?
I've tried creating a dynamic content in a single language and add it into the article template. However, it's not displaying. Near as I can tell, I'm using the correct format as well (ie {{dc 'help'}}.
Hi Jennifer,
This is a pretty great tool for customizing help centers. As far as I know it should work in any of the html templates. We use it to embed contact info, opening hours etc. in the HC Home Page below the navigation.
Your notation looks good.
It might be worth testing if the DC content is the problem - try a simple text string "test" (no html), or if that isn't the issue, maybe try inserting the DC placeholder in another place, another template or different positioning.
Thanks for the suggestions Jacob! I couldn't make this work with the "preview" function. However, once I published the changes, I could see it. Seems that the only thing blocking it from working before was preview vs publish.
Ah of course, I've noticed that from time to time also...preview doesn't always preview your changes, very frustrating. Glad you got it worked out!
While I've got this figured out, is there any way to extend this idea?
For instance, I'd love to have variables that I can insert into the article body itself. This would allow us to feature specific tips/ideas that come up in a lot of our content in a way that is much easier to update. So, rather than update 100 articles (out of 2000), we could update the dynamic content, which would be reflected in the specific articles that contained the variable.
I'd love to know if anyone has been successful with this or any other dynamic content use cases in Guide. Thanks!
Hi Jennifer,
You may find this Q & A helpful for that.
Btw: I was told by Zendesk Support, that the preview button only previews saved changes to the templates. If like me you fearlessly edit live themes, the preview button won't let you preview unpublished edits - which is confusing.
Can you please add the formatting option mentioned above to the dc setup page?
https://"subdomain".zendesk.com/agent/admin/dynamic_content
Currently it's only the placeholder used in triggers and automations that is shown.
Hi Niclas,
Since this would be a UI change within Support I would recommend creating a post in our Support Product Feedback forum for our Product Managers to view.
Thanks again for providing your feedback and let us know if you have any other questions :)
https://support.zendesk.com/hc/en-us/community/posts/360004398108-Show-Dynamic-Content-HTML-formatting-in-setup
Any plans to make HTML work on DC displayed via triggers and automations?
No plans as of yet Mariliam.
If we have any updates our Product Managers will reach out on the following post which it looks like you've located :)
Rich Text in Dynamic Content
Thanks again for sharing your feedback!
Is it possible to use placeholders in dynamic content used on the Help Center? i.e. can we use a piece of dynamic content in the Guide that references another piece of DC using {{dc.dynamic_content_name}}?
I'm trying to add this in the footer but doesn't work. What am I missing?
<script type="text/javascript">
var my_activities_dropdown = document.querySelector('.my-activities') ;
my_activities_dropdown.text = {{dc 'my_activities_dropdown'}} ;
</script>
It works fine if I put the string 'My tickets' instead of the dc reference.
Hi @Michele,
Try replacing my_activities_dropdown.text = {{dc 'my_activities_dropdown'}} ; with my_activities_dropdown.text ='{{dc 'my_activities_dropdown'}}' ; and let us know if that works for you.
Thanks
Please sign in to leave a comment.