Static Sections

Modified on Tue, 02 Mar 2021 at 05:47 PM


I. Announcement Bar

Announcement Bar is a static section of settings for every Theme of Arenacommerce. It has 2 parts for settings: 

1. Content 

where you can add the number of values for Announcement Bar

2. Settings 

where you are able to edit its display

Eg: there are 2 columns on Announcement Bar. 

- The left side is Text. You can add whatever you want to the content by clicking Add content > Text, after you modify it, drag it to the position that is below "Left Column" 

- The right side has My Account and Contact us. Do the aforementioned steps for the Right Column

- Icons, Currency, and Language don't need dragging up, it will automatically display on the right side of the announcement bar when added. 

Note: the content is up to your wish, there are no default settings on it. 

II. Header

1. Settings


Header Desktop Style: 7 styles 

- Logo Image: select or upload your logo for Header (Retina Displays require double the pixels to display the same image)

- Fixed Header: tick to choose where to show the fixed header (it can be both)

- Fixed: Logo max width: 100

Desktop Settings

- Logo maximum width: 140

- Menu alignment: Left / Center / Right

- Main Menu: select menu item for the navigation (the menu item you already set up on your Navigation in the admin account). Apply for all Header styles except Kitchen Double Menu.

- Left Menu and Right Menu: Only for Header Double Menu

* Note: Before use Custom font, make sure custom font had added in "Custom css" section

- Menu font family: 7 styles

Mobile Settings

- Select to show the Currencies & Languages icons

- Logo maximum width: 100

- Mobile menu: edit the items by clicking "Edit menu"

Only work for the 3-level menu item. Type the name of level 2 to modify the level 3 

eg: the feature 2 display on the left side, instead of the right one. 

3 labels for showcasing: HOT, SALE, NEW. Add names of the menu items to the box of each label that you want them to display on navigation. 

General Settings

Tick to show Icons, Currencies, and Language

- Menu spacing: Order: Top Right Bottom Left (eg: 30px 8px)

- Search and Account Icons

  • Header Padding

- Padding: Order: Top Right Bottom Left (Eg: 30px  15px)

  • Header Border
  • Header Left Settings: Only for style 6 Vertical menu and left column home

2. Content

To set up menu on Navigation: go to this link

To add more content to show on Navigation: click "Add Content" 

Mega Navigation

(For menu "Home" on Navigation)

- Block Label: name whatever you want that is easy to remember for this section 

- Layout

  • Mega navigation trigger: add the title for the menu that you want customers to navigate. 
  • Submenu Position: where you want submenu to place (Left / Center / Right)
  • Width: the width of the submenu
  • Background style: background color / background image (if choosing an image for background then modifying its display below) 

Column Width

There are 4 columns to modify (0 is Auto width, 12 is 100%)

- Column Component

Each column shows you several items, choose one to display on the submenu (that you already set up on Navigation in your admin account) 

After you choose the item for each column, you move to modify the elements of it. 

  • Column 1: 
  • Heading: set the title for the heading in column 1
  • Link to: paste a link or search the available collection to attach it to the heading
  • Menu item: the editing will work, in case you select "menu item" for Column Component above. Then click "Edit menu" to edit the data of the submenu 
  • Product 01, 02, Collection item: modify those ones, in case you select them in Column Component. 

(Eg: you choose Collection 2 to display on column 1 in Column Component, then scroll down and choose the corresponding type in +column 1 as the image below. And you can modify the other columns with the same steps)

  • Total items: choose the item number to display
  • Items per column (Only for Collection 2) 
  • Image: if you don't want a background color, then select or upload an image, the background of column 1 will display it. After that, edit the size and link of the image below.
  • Column 2,3,4: Do the same steps as column 1

III. Footer Widget

1. Settings

  • Visibility: Select one of the options for displaying
  • Section Paddling: follow the order - Top Right Bottom Left (Eg: 30px, 20px, 28px)
  • Section Margin: the same as Section Paddling

Block Headings

  • Block heading font size: drag to modify the font size of Heading (Large to Small: 1 -> 6)
  • Block heading font weight: select options to modify the font-weight for Heading
  • Border size: drag to modify the border size and choose the border color 
  • Border length (in %): choose % that meets your need
  • Border margin: in order - Top Right Bottom Left

  • Border Mode: Select the border style for Footer (Hide / Box / Full) > move to Border Color to change color for the border 
  • Border size (in px): to modify the width for Border
  • Border style: select the style for the border
  • Border margin (in px)

Subscribe Setting

Tick "Separate Subscribe" to place the contact section on the top footer.

There are several sections for you to choose to display on the footer. Click Add Content to have more sections to show

IV. Footer

1. Content

There are several options to display on Footer. Click "Add Content" to add more information you want to show

2. Setting

  • Block Heading
  • Copyright

Visibility: select where you want customers to see the copyright text

- Width: change the width from 1-12, 0 to hide. Eg, 4,4,8

- Copyright content alignment: select to change the alignment (Right / Left / Center)

- Position: place the text "Copyright content alignment" First or Last in the Footer

  • Footer Border

- Border mode > Border color

- Border size (in px)

- Border style

- Border margin (in px)

V. Popup Newsletter

1. Content

Click "Add Content" to have information for Popup Newsletter. Eg: Add Image and Text for the content

Then Click Image and Text to modify 

2. Settings

  • Style: Select a displaying style for Popup Newsletter
  • Delay time: drag to decide the delay time to appear on 
  • Scroll position: Calculated from top of the site
  • Expires: drag to decide the number of days to show Popup Newsletter

Text Box

  • Textbox Width

Eg: 50 

  • Position: Select the placement for the Text on Popup Newsletter
  • Background Image (pixels): select or upload the image for Text Box then modify its Size, Image Repeat, Image Position. 

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article