You can create custom pages from scratch and then link to them from anywhere in your help center or from any other web page or application. For example, you can use custom pages to create special landing pages for your help center, or even create new pages to embed content from sources outside of Zendesk.
This article covers the following topics:
Creating custom pages
You can create custom pages in one of two ways. You can either create and customize a page using the Zendesk Curlybars and HTML markup within Guide's theming editor, or you can create and develop the page outside of Zendesk and then import it as part of a theme into the help center.
You can create up to 100 custom pages.
To create custom pages using the theme editor
- In Guide, click theCustomize designicon (
) in the sidebar.The Themes page opens.
- ClickCustomizeon the theme that you want to edit.
- ClickEdit code.
- ClickAdd new, then selectCustom page.
- ForPage name, enter a filename for your page.
The name becomes part of the page URL.
- ClickCopynext to the URL field to save the URL to your clipboard.
You’ll need it to add the link to other pages.
- ClickAdd custom page.
The custom page appears without content and is listed under the custom_pages section in the sidebar.
To design the page, seeDesigning custom pages.
To create custom pages using code
作为一名开发人员,您可以构建主题线下和upload them as a ZIP file or use a GitHub repository. To create custom pages using code, create the page as a .hbs file in the following directory: templates/custom_pages. SeeWorking on a theme locally.
Designing custom pages
When you create a custom page, the page is blank. To design a custom page, you can use the Zendesk templating language, also known as Curlybars, as well as HTML, CSS, and JavaScript.
For more information, see the following templating language references:
Linking to custom pages
Your content hierarchy is composed of a number of different pages such as sections and topics that make up your help center. Custom pages exist outside of this hierarchy and are not visible to users until they click a direct link to them.
For example, if you create an “About Us” custom page, you can add a link to that page from any help center template, article, or even home page. Users visiting those pages can click the About Us link to view the custom page. If users don’t have access to a link that points to the page, they can still search for it.
The URL of a custom page follows this pattern: "https://{domain_name}/hc[/{locale}]/p/{page_name}". The locale is optional and the page name does not include an .hbs or .html file extension. You can get the page_name from the list of pages in the theme editor. See Creating custom pages.
For example, if your domain name is mondocam.zendesk.com and the page name in the theme is about_us.hbs, the URL will be https://mondocam.zendesk.com/hc/p/about_us.
If you want to insert a link to the custom page in another page or template in the same help center, you can use a relative link such as About Us.
43 Comments
I am not a coder.
I want to make a tutorials page based on the article template. As in I want the page to look like our articles, but as a separate url that is not listed under categories. We will constantly add videos and I don't want to hard code the page. If that makes sense.
Or can I give an article a custom url instead?
I am Japanese.
I'm not good at English, but I have a question.
For example, if you want to change the display by language, is there a description like {{#isnt lang = en-us}} text {{/ isnt}}?
HiLisa Sedlak
The custom pages feature is currently targeted at customers who want to do some level of coding, so it might just not be for you. If you do want to go ahead though, and if you want to avoid hardcoding the content, then you need to make it such that the content is fetched dynamically. For example you can use Dynamic Content (the {{dc}} helper) to fetch text strings dynamically. And if your video collection is available somewhere in a machine-readable format like JSON, you could use Javascript to fetch that resource and dynamically build out the page.
Unfortunately we do not currently have a way to give articles a custom URL.
Hikobayashi
For localization of strings in HC templates you can use Dynamic Content (the {{dc}} helper).
Are custom pages included in search results?
I'm coming across an issue with the DC mark-up formatting carrying over to the custom page. So links and lists (bulleted and numbered) aren't populating as intended. Is the solution to create separate DC items when you need to insert a link or make a list and format with code via the custom page's HTML? Or is there a more straightforward solution?
HiDavid Bjorgen- Custom Pages are not included in search results by default. It is however possible to use the Federated Search feature with Custom Pages, if you add the page to the external content yourself.
HiAlyssa- Currently the DC helper is only built to support translating simple strings, so bulletpoints or links are in deed not supported. I'll record your feedback as a sign that we should think about something more flexible as well. I think that for now you will need to create the bulletpoints in HTML and insert individual DC strings into those bulletpoints.
高兴看到这个选项。我很好奇如果anyone has experimented with adding Explore content to a custom page. We are interested in allowing our light agents access to a couple of different Explore views, and would prefer to lead them directly to a page that has this content. Thanks for any ideas!
Is there a way to create custom pages that can only be viewed by certain users or organizations? Thanks!
AsArt Costiganmentioned, is there a way to use permissions on a custom page? I want only users that are signed in to be able to access the custom page.
I tried adding a {{#if signed_in}} statement at the top of the page, but the function seems to always think that the user is not signed in.
Essentially I tried the following code for the page:
{{#if signed_in}}
Display some content on the screen.
{{else}}
Sign in to access product documentation and resources.
{{/if}}
My result was that the sign-in prompt was displayed whether a user was signed-in or not.
Hi. Is there a way of adding the locale value as default to the custom URL? We use a redirection method based on the locale within the URL. However, because the default URL value doesn't have it, the redirection method bombs out and keeps the user on the same locale.
default:https://example/hc/p/example- (still works, but causes problems when we change languages using our in-built tool)
what we would like the default to be:https://example/hc/en-gb/p/example
HiArt CostiganandAcoustic
Unfortunately we do not have permissions checks like those you describe. It is possible to use access JavaScript and call into e.g. the users REST API to get information about the current user.
Taking notes about your request to have more built-in permissions handling in custom pages and/or in the templating language.
I'd like to hide our footer on a custom page. Is this possible? I've looked athttps://support.zendesk.com/hc/en-us/articles/4408845769882but this approach requires an article id, which I don't have for a custom page.
Hey :)
You can hide footer on custom template, just add the below code snippets.
Step 1: Add template name on your custom pages at the top which you have been create.
Screenshot for the same:
Step 2: Now check the template name and hide the footer by Javascript. Add the below code at the bottom of your script.js file.
var footer = document.querySelector('footer');if(templateName === 'custom_page_one'){
footer.style.display = 'none';
}
Screenshot for the same:
If any confusion do let me know.
Thanks :)
That worked! Thanks much!
Happy to hear!
We've been able to use the new custom page to build a great custom tool for the Helpdesk team but now that we've completed the development we don't appear to be able to access the page except for in the preview mode.
Are there restrictions on use with a custom domain? In Preview Mode it works great but whatever we try, our signed-in users (including Admins) get redirected to the "The page you were looking for doesn't exist" page.
Anybody else had issues with this?
HeyDavid Leigh,
Have a look at it:https://support.zendesk.com/hc/en-us/articles/4409427690138-Announcing-custom-pages-in-help-center
Hope it would be helpful for you.
I just start to customize my help center.
I have created a custom page named "betaplan.hbs" under the folder "custom_pages" and the URL is support.yeastar.com/hc/p/betaplan
In preview mode, I can visit this page,although the URL is changed to support.yeastar.com/hc/en-us/p/betaplan
But when I close the preview mode, I cannot visit this, can anyone offer me some help?
Wondering if someone can help,
Looking to use Custom Pages to display Categories/Sections as would like to use the home.hbs as a landing page for our customer base. The idea would be they come to our HelpDesk and can choose "Portal" or "Legacy" then under those custom pages would be the categories/sections for the relevant page.
I know we could do this just using categories then sections and sub sections and so on, but without having to re-structure our entire help desk, it's not really a viable task.
Is there a way for me to pull categories/sections dynamically like I would on the home.hbs?
I have the same issue as黄哲andDavid Leighabove. We have created 2 custom pages in our help center and other than ADMIN Preview our internal agents AND end users cannot access these pages.See image below. How to we allow access to these pages?
Is there a way to restrict a custom page to only signed-in users or a specific subset of users?
Restricting access to signed-userswill be for your entire Help Center.
@黄哲 and @Michael Sutcliffe ,
As much as I wanted to help, the actual customization for the custom page is outside our scope. I have also followed this page just in case other users share their own use cases here that can help out with yours.
While building custom scripts is outside the scope of support for Zendesk Advocacy, we do have aProfessional Servicesteam that can help/build it for you.
HiDane,
Thanks for the response. However, if I turn that setting on, then my custom page gives the 'not_found' error message, when it should be giving the 'unauthorized' error message. Can I fix it so it recognizes the user isn't signed in to my custom page, not that the custom page doesn't exist?
If you can share the error you received, I can check it for you. In addition, it will also help other users that will have the same problem or they can even help if they have encountered it before.
Is there an option to purchase additional custom pages over the limit of 10? Will this cap be removed or increased at any point in the future? Thanks!
Based onGuide product limits for your help center,自定义页面的限制确实设置为10。Additional custom pages is not yet supported. Please keep an eye for any improvement on ourZendesk update page.
I'd also recommend creating aCommunity postseparately for that with your use case to help get more visibility and votes on the idea. Then, others can share their use cases to further drive demand for that feature.
Hi everyone,
Some of you mentioned that custom pages you created didn't exist. Custom pages is an Enterprise feature. If you have Guide Professional you can still create and preview custom pages. If you want to have custom pages as part of your help center, you'll need to have Guide Enterprise.
This means I can't use this function. (I read about the script thing, but I have no knowledge of scripting.)
A workaround I see is to make articles instead, probably with specific templates. You lose the custom URL though.
Dylan Buckleythe limit for custom pages has been increased to 100.
Happy holidays :)
Pleasesign into leave a comment.