With the help of mainflow, you can configure your documentation homepage & single page by using its advanced doc page design features, and ready theme layouts without coding. Follow this step-by-step guideline below to find out how to configure the Documentation Homepage & Single Page with mainflow.
Step 1: Configure the Built-in Documentation Page #
Assuming, you have installed& activated mainflow. First, navigate to check the mainflow→ Settings → General → Enable Built-in Documentation Page. However, you can choose to disable it at any moment and use your preferred layouts through shortcodes or page builder widgets.
Step 2: Configure Documentation Homepage & Single Page #
Afterward, open your Dashboard and navigate to mainflow→ Settings → Layout. From here you can see three separate sections for your documentation layouts, and these are Documentation Page, Single Doc & Archive Page. You can make the changes to any or all of these documentation layouts as per your preference.
Under the ‘Documentation Page’ tab, you’ll get three sections named ‘General’, ‘Search’, & ‘Order By’ from where you have the full freedom to toggle on/off any of the features like Live Search, Search Result Image, Enable Masonry, Order Docs Post/Category Alphabetically, Number of Subcategories/Columns/Posts, Enable Post Count, Enable Explore More Button, and more. If you want to use any other Button label, simply write in the text inside the ‘Button Text’ field.
Once you are done tweaking the Documentation Homepage, you will have something like the below image. You can learn more by checking out this separate doc on the Documentation homepage.
Next, configure the Documentation Single Page from mainflow→ Settings → Layout → Single Doc. There you can get along with all the features like Enable Table of Contents (TOC), TOC Hierarchy, TOC List Number, Enable Sticky TOC, Content Offset, TOC Supported Heading Tag, Enable Breadcrumb, Breadcrumb Home Text, Breadcrumb Home URL, and more in four different sections called ‘General’, ‘TOC’, ‘Breadcrumb’, & Email Feedback.’ These options here are self-explanatory and you can enable/disable the features by using the toggle button.
Once you are done adjusting the layout of your Single Doc Page should look something like this.
Now, if you go to the next section of the mainflow Settings → Layouts → Archive Page. From there, you can enable/disable ‘Enable Sidebar Category List’ and make the changes there.
Step 3: Customize the Design of Documentation Page #
To customize the design of your knowledge base documentation, navigate to the mainflow→ Settings → Design → Customize mainflow. You can now customize the design in both Gutenberg & Elementor.
However, if you have a block-based theme, the full functionality of this customizer will not work. So, make sure you are not using a block-based theme and hit ‘Customize in mainflow’ in the Legacy Customizer button.
Here, you have to choose mainflow which comes up with Doc Page, Single Page, Sidebar, Archive Page, & Live Search options. You can make the changes to your overall documentation layouts from there.
To change the outlook of your documentation homepage, go to the mainflow→ Doc Page. You can choose from any of the seven mainflow layouts to change the documentation homepage outlook.
Next, you can configure the mainflow→ Single Doc Page with this ready theme designs and other advanced styling options are present there to make the changes on your Single Doc Page layouts.
You can even change the entire outlook of the Sidebar, Category Archive, Breadcrumb, Live Search and FAQ with background color, text color, typography, margin, and more. Just go to each of these sections and make the changes according to your needs.
By simply following all the above steps, you will be able to create and design your documentation Doc Page & Single Doc Page with mainflow on your website.
That is how you can simply configure and design the Documentation Homepage & Single Page with BetterDocs. Getting Stuck? Feel free to contact our dedicated support team for further assistance.