To keep on going with your customization we assume you’re already familiar with HTML5 and CSS3 minimum, and read this introduction(link to the introduction) article and the article with basic Liquid markup language(link to it) .

So let’s continue, as said on the introductory article the Main Layout document is responsible for the structure of the KB, said structure includes header, footer, search bar and search results returned.

In the picture bellow you can see what is defined through this document highlighted in Yellow:

Exemple with main layout items highlighted

You can modify the structure of your Main Layout to show any kind of static information such as texts and pre-defined links, and also dinamic content.

To access such content Helpjuice uses Shopify/Liquid, and this are the Objects accessible on the Main Layout:

  • on_show_question_page: Variable that returns a true value if the current page is a question;
  • on_index_page: Variable that returns a true value if the current page is the index page;
  • on_contact_us_page: Variable that returns a true value if the current page is the contact-us page;
  • account: Object that returns a list of properties related to the KB account;
  • internal_kb_user: Object that contains the info on the logged in user;
  • current_user:Same as internal_kb_user ;
  • javascript_includes: This Object is specific for the template it returns a string containing the main JS;
  • responsivemenu_js: This Object is specific for the template it returns a string containing the javascript files responsible for the mobile menu;
  • typewatch_js: This Object is specific for the template it returns a string containing the javascript files responsible for the monitoring of the search block;
  • questions_js: This Object is specific for the template it returns a string containing the javascript files responsible for the fetching and displaying of questions after performing a search;
  • content_for_layout: This Object fetches the contents on the current page as a text and paste it over the template code.

Some elements are essencial to the Main Layout:

Search Block:

 
       
 

Contact Form:

     
           
            
               
                   
                     Sorry, we didn't find any relevant articles for you. 
                     Please fill out the contact form below and we will reply as soon as possible. 
                     
                       
                        
                          
                           
                            {{csrf_token}}
                            
                           
                           
                            
                            Your email
                             
                           
                           
                            
                            Your question
                             
                           
                           
                            
                            Description (details)
                             
                           
                          
                          
                          
                        
                       
                     
                   
                 
           
       
    

Head Items:

    
    
    
    {% if question %}{{account.name}} — {{ question.name }}{% else %}{{account.name}} Support{% endif %}
    
    
    
    
    
    
    
    
    
  
Did this answer your question?