Landing page templates

2 min

archbee provides white label landing page templates so you can easily create a branded landing page for your doc portal how to get the custom code from our git repo (coming soon) copy paste the custom code from our documentation to space settings docid\ wvj uaa wgatdv7usvszy docid\ ed0vt01okknkvs6ekzcdb how to use to set up your custom landing page you must copy our custom code to space settings > custom code and landing page sections for each template you will have 3 files index html , script js and style css the 3 files can be found below for each template docid\ wvj uaa wgatdv7usvszy docid\ ed0vt01okknkvs6ekzcdb include headers tab copy the include headers section from index html paste it in the include headers section of space settings > custom code make sure it includes the \<head> tags and press save custom css tab copy the content of the stlye css file and add it to the custom css section from space settings > custom code ensure they are enclosed in \<style>\</style> tags the style code starts with a few variable declarations, which can be used to easily change the theme of the page \ root { \ accent text #2166ae; \ secondary text #0a4563; \ primary text #24292e; \ background color #fff; \ primary link #999; \ accent link var( accent text); \ header title color #fff; \ header subtitle color #fff; } custom javascript copy the code from script js add it to the custom javascript section from space settings > custom code make sure they are enclosed in \<script>\</script> tags landing page html copy the html code from index html starting from the \<! start landing page > comment select the custom html landing page type and then add the html code in the container that appears below how to customise the code logo + images all images and logos are defined with placeholders with the format \<img src="https //placehold co/ " /> as exemplified below navbar links navbar contains a few of links that can be used to navigate inside or outside the doc at the end of the list there is also a commented link that can be used to add other links if need hero section contains a background image and a title and subtitle (the colors of these can be changed in the style # section) document blocks a list of blocks containing an icon, a title, a description and a button, generally used to navigate to your docs an example is commented out at the end of list