Okay
  Print

Accron Header Setup

(1) How to Open the Header Section  for editing in the Global Editor  ?

Before we proceed with customizing the Contents of the Header Section. First, we need to learn how to open the Header Section for editing in the Global Editor.

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Here You have to click on the header section and when you click the section this Global editor page will appear after that click on "Open in global content editor" 

Please follow this Screenshot for Reference :

(2) How to manage Logo in Header Section ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Logo in Header Section just follow this path : Go To Contents > Section > Column > Logo 

After reaching here you can manage various Logo settings.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :


(3) How to manage Logo style settings in Header Section ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Logo in Header Section just follow this path : Go To Contents > Section > Column > Logo 

After reaching here Click on Styles toggle & here you can manage various Logo styles settings such as Visibility , Alignment & Spacing , Background & Border. 

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(4) How to manage Contact Widgets in Header Section ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Contact Widgets in Header Section just follow this path : Go To Contents > Section > Column > Custom Contact 

After reaching here select your custom contact widget and Click on edit. After that you can manage Contact Icon , Title and Subtitle , you can also add link to the Contact Widget from here.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(5) How to manage Contact Widgets style settings in Header Section

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Contact Widgets in Header Section just follow this path : Go To Contents > Section > Column > Custom Contact 

After reaching here Click on Styles toggle & here you can manage various Contact Widgets styles settings such as Title, Subtitle & Mobile Breakpoint Hide. 

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(6) How to manage Header Button in Header Section ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Header Button in Header Section just follow this path : Go To Contents > Section > Column > Row > Column > Accron Button

After reaching here you can manage the Header Button.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(7) How to Manage Header Button style settings in Header Section ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Header Button in Header Section just follow this path : Go To Contents > Section > Column > Row > Column > Accron Button

After reaching here you can manage the Header Button styles such  as Text , Background , Border , Corner , Spacing & Alignment.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(8) How to Manage Dark/Light button in Header Section ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Dark/Light Button in Header Section just follow this path : Go To Contents > Section > Column > Row > Column > Light Dark Auto

After reaching here you can manage the Light/Dark Auto buttons

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :


(9) How to manage Bottom Header contents in Header Section ?

Up until now we have been managing the Above Header Contents in this Article but now we will see how can we manage the Bottom Header contents as well.

(a) How to manage Nav Info text in Bottom Header ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Nav Info Text in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > We are hiring 

After reaching here you can manage the Nav Info text.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :


(b) How to manage Nav Info text styles settings in Bottom Header ? 

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select Home and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Nav Info Text in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > We are hiring 

After reaching here you can manage the Nav Info Text styles such as Visibility & Alignment & Spacing.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(c) How to manage Navigation Menu in Bottom Header ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select AccronHome and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Navigation Menu in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > Accron Menu

After reaching here you have to select which Menu do you want to display in Header Section by selecting the header from Menu Dropdown. 

NOTE : If you don't see the Navbar Menu here , that means you haven't created the Menu Yet. So first you need to create a Navbar Menu from the Dashboard and then you can select any Menu you created in the Dashboard using this Menu Dropdown. Please read this article for more details : https://spancoweb.ticksy.com/article/20189/

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(d) How to manage Navigation Menu Styles settings in Bottom Header ? 

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select AccronHome and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Navigation Menu in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > Accron Menu

After reaching here select Styles Toggle & you can manage the styles of Navigation Menu such as Text and Dropdown settings as well.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :

(e) How to manage Header Docker in Bottom Header ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select AccronHome and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Header Docker in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > Row > Column > Header Docker 

After reaching here you can manage all the contents in Header Docker section.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :


(f) How to manage Header Docker Styles settings in Header Section ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select AccronHome and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Header Docker in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > Row > Column > Header Docker 

After reaching here select Styles Toggle & you can manage the styling in Header Docker section.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :


(g) How to manage Header Search in Bottom Header ?

 

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select AccronHome and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Header Docker in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > Site Search Input

After reaching here you can manage all the contents in Header Search .

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :



(h) How to manage Header Search styles settings in Bottom Header ?

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select AccronHome and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage Header Docker in Bottom Header just follow this path : Go To Contents > Bottom Header > Section > Column > Site Search Input

After reaching here select Styles Toggle & here you can manage all the style related things of Header Search option.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :


(10) How to manage the Columns Positions in Header Section ?  

 

In HubSpot Dashboard click on Content submenu and Select Website Pages.

After reaching to this page select AccronHome and open it.

Once the Global Editor is opened , you can manage the Header Section contents from this Editor.

To manage the Columns Positions in Header Section , all you need is select the particular columns's white line and then you can adjust the Columns posistion by draging that white line left or right.

Then click on Apply changes and Update.

Please follow this Screenshot for Reference :