Setting up the GitHub integration with your help center theme




What's my plan?






All Suites

Growth, Professional, Enterprise, or Enterprise Plus









Support with

Guide Professional or Enterprise






Verified AI summary ◀▼
Integrate your help center theme with GitHub to collaborate on theme development and manage it in one place. Prepare your theme in GitHub, ensuring it meets requirements like having a manifest file at the root. Set up the integration in Knowledge admin by importing the theme from GitHub. Manage updates in GitHub and publish them when ready.




Location: Knowledge admin > Customize design ( ) > Add theme > Add from GitHub

The GitHub integration enables you to develop and maintain a theme collaboratively in GitHub,
then preview or publish it in Knowledge admin. To set up the integration, make sure your theme
is stored in GitHub, then set up the integration in Knowledge admin.


Note: The GitHub integration with Help Center does not support GitHub Enterprise Server, but
it does support GitHub Enterprise Cloud. If you use GitHub Enterprise Server you can
alternatively use the Guide theming API.

You must be a Knowledge admin to set up the GitHub integration.
This article covers the following topics:
Preparing your theme in GitHub
Setting up the integration




Preparing your theme in GitHub

You need to ensure that your theme is in GitHub before you set up the integration in
Knowledge admin. If you're new to Git and GitHub, check out this tutorial. If your theme is already in GitHub, and it meets
the following requirements, see Setting up the
integration.
The integration has the following requirements for your GitHub repo:



The manifest file must be at the root of the GitHub repo The file
manifest.json should be placed at the root of your GitHub repository to be able to add
your theme. You can still include extra files, such as tooling, which are ignored when
importing to Knowledge admin.


The GitHub repo can have only one theme You should only manage one theme in
each repository. You can use the branch option during theme import to try out
variations of your theme.



To get your theme into a GitHub repo


If you do not currently have a theme, fork the Copenhagen theme repo and start building your theme. This enables you to easily
port improvements from the Copenhagen theme to your theme in the future.

If your theme is in Knowledge admin, download your theme, then create a GitHub repo (if
you don't already have one), and push your theme to the GitHub repo.

If your theme is not in Knowledge admin or GitHub, create a GitHub repo (if you
don't already have one), and push your theme to the GitHub repo.

After you've prepared your theme in GitHub, you are ready to set up the integration.



Setting up the integration

To set up the GitHub integration you need to make sure your theme is stored in GitHub, then
fetch your theme from GitHub to Knowledge admin. This one-time fetch establishes the
connection between your theme and GitHub.
After you set up the integration, you will work on the theme in GitHub, then update the
theme in Knowledge admin when you're ready. You can then preview or
publish the theme live in Knowledge admin.
To set up the GitHub integration with your help center theme


In GitHub, ensure that you have prepared
your theme.

In Knowledge admin, click Customize design
( ) in the sidebar. The Themes page opens.

Click Add theme in the upper-right corner.
Click Add from GitHub.

Enter the URL for the repo and, optionally, enter a branch name if you want to fetch
from a branch other than the default branch, then click Import.
Log in to GitHub if prompted, then click Authorize Zendesk.


The theme thumbnail appears on the Themes page when the import is complete. If you have
problems, see Troubleshooting the GitHub integration for help center
themes.
After you've established the connection, you will manage your theme in GitHub and update the theme in Knowledge admin as needed.



//
const fast_path_style = document.createElement('style');
fast_path_style.innerHTML = `#article-body .fastpath{font-size:.9em;background-color:#f3f3f3;border:1px solid #d3d3d3;padding:10px 10px 8px;margin-bottom:16px}#article-body .fastpath::before{content:none!important}`;
document.head.appendChild(fast_path_style);
//

//
const ai_summary_style = document.createElement('style');
ai_summary_style.innerHTML = `#styled-article-body{padding:0 0 0}#article-body #docs-ai-summary{background-color:#f3f3f3;border:1px solid #d3d3d3;padding:10px 10px 6px;margin-bottom:16px}#article-body #docs-ai-summary #docs-ai-summary-toggle{font-size:.9em;font-weight:700;margin-bottom:4px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}#article-body #docs-ai-summary #docs-ai-summary-toggle #up-triangle{margin-left:auto;padding-right:10px;display:none}#article-body #docs-ai-summary #docs-ai-summary-toggle #down-triangle{margin-left:auto;padding-right:10px}#article-body #docs-ai-summary #docs-ai-summary-content{font-size:.9em;padding-left:25px;padding-right:25px;margin-bottom:12px}`;
document.head.appendChild(ai_summary_style);

const toggleAISummary = () => {
const summary = document.getElementById("docs-ai-summary-content");
const upTriangle = document.getElementById("up-triangle");
const downTriangle = document.getElementById("down-triangle");
if (summary.style.display === "none") {
summary.style.display = "block";
upTriangle.style.display = "none";
downTriangle.style.display = "inline";
} else {
summary.style.display = "none";
upTriangle.style.display = "inline";
downTriangle.style.display = "none";
}
};

document.getElementById("docs-ai-summary-toggle").addEventListener("click", toggleAISummary);
//

