Custom Landing Page

you can set up a custom html page to load instead of the first document which is the default option when the docs site loads to change the landing page option follow the next steps click on the space you want to add a custom html landing page look for the settings gear ( ⚙️ ) and click on it in the space settings window, go to the landing page tab select custom html add your html code in landing page html field and hit save keep in mind that this is your index html file the custom html supports https //handlebarsjs com/ and https //tailwindcss com/ you can interpolate some variables in the html template here is the object that we pass to the template; you can render any of these variables first level variables export interface publicdocspaceresponse { id string name string icon string publiclogourl string darkpubliclogourl string publictheme 'light' | 'dark' | 'auto' contentlayout 'one column' | 'two column' isindexable boolean template 'booklet' | 'stripe' | 'widget' faviconurl string landingpageheadertext string landingpagesubheadertext string landingtemplate? string footertemplate? string headerincludes? string jwtredirecturl? string hostingtitle string showreadtime boolean showlastupdate boolean showcontributors boolean showdocfeedback boolean logoredirecturl string hostingcolor string darkhostingcolor string hostname string hostnamepath string proxydomain string isarchbeebrandvisible boolean i18nlanguage string isauthenticated boolean showpdfbooklink boolean pdfbooklink? string createdat string spacelinks publicspacelink\[] externallinks publicexternallink\[] versionlinks publicversionlink\[] publicdocstree publicdoctreeresponse\[] } prop interfaces export interface publicdoctreeresponse { id string name string icon string urlkey string expanded? boolean iscategory? boolean categoryname? string islink? boolean linktitle? string linkhref? string linkopensinnewtab? boolean parentdocid? string rightdoc? publicdoctreeresponse leftdoc? publicdoctreeresponse children publicdoctreeresponse\[] } export type publicspacelink = { label string docspaceid string icon? string versionlinks? publicversionlink\[] hasversionswithoutlinks? boolean } export type publicversionlink = { label string docspaceid string forkedfrom string language string versionlinks? publicversionlink\[] } export type publicexternallink = { label string url string } this is an example html for rendering custom html in the landing page publiclogourl props example id {{ id }} name {{ name }} icon {{{ rendericon icon }}} public docs tree {{#each publicdocstree}} name {{name}} {{#if children}} {{#each children}} name {{name}} {{/each}} {{/if}} {{/each}} for a structure like this and an uploaded logo you should see something like this, with the above code custom functions for activating search on a custom landing page you can build your own search input, but you'll also need a way to show the search modal — we've got you covered on the `window` object of the browser there are 2 methods you can call to control the search modal // shows the search modal window\ showsearch() // hides the search modal window\ hidesearch() these functions are also available for usage in your custom scripts