Add the Zendesk custom template to your ScreenSteps Live site
This lesson will show you how to make your ScreenSteps Live site fit right in with your Zendesk help desk. You will do this by creating a custom template.
Make sure you are using the ScreenSteps Live 2011 content template. If you aren't, then see this lesson on how to update your content template.
If you are converting from the Legacy content template then make sure that your sidebar is set to appear on the right side.
Prepare Your Custom Template File
Download the Zendesk ScreenSteps Live Custom Template file. This is the text file you will be editing to create your custom template on ScreenSteps Live.
Add Zendesk Custom Generated CSS
Go to your Zendesk site and view the page source. There will be a line that looks something like this:
<link rel='stylesheet' type='text/css' href='/generated/stylesheets/branding/100/10043/1283172034.css' media='screen' />
The numbers will be different though.
Copy this line and update the href value to include the full path to your Zendesk site.
The result should look something like this:
<link rel='stylesheet' type='text/css' href='http://mycompany.zendesk.com/generated/stylesheets/branding/100/10043/1283172034.css' media='screen' />
Place it in the <head> section of the template file you downloaded.
Customize Your Template Header
The template file has a basic layout that will work with Zendesk. You will need to customize a few things though. The first area you want to customize is the header. Add in the links to your Zendesk site and your logo.
Customize Your Template URLs
Update the urls in the "top-menu" section to point to your Zendesk site. Make sure the "Documentation" tab points to your ScreenSteps Live site.
Add Any Custom CSS
Add any custom css you have applied to your Zendesk site either to your custom template file or via the ScreenSteps Live Custom CSS field.
Create Your Custom Template on ScreenSteps Live
1. Create a custom template on ScreenSteps Live and paste the contents of your custom template file into the field on ScreenSteps Live.
2. Apply the custom template to one of your ScreenSteps Live spaces.
That's It!
That is all there is to it. If you need to see how to add the documentation tab to your Zendesk site so that it points to ScreenSteps Live see this lesson.
Add your comment