---
title: Adding a Header Image from the Frontend of your online ordering page
description: How to add a Header Image from the customer's side of your online ordering menu.
---

[Skip to content](https://docs.zaytech.com/knowledge/adding-a-header-image-from-the-frontend#main-content)

English

Show submenu for translations

[More support](https://docs.zaytech.com/knowledge/kb-tickets/new?hsLang=en)

![logo-2.png\]](https://docs.zaytech.com/hs-fs/hubfs/logo-2.png?height=47&name=logo-2.png)

- [Default HubSpot Blog](https://blog.zaytech.com/)

Open main navigation

Close main navigation

- [Default HubSpot Blog](https://blog.zaytech.com/)
- English
  
  Show submenu for translations
- [More support](https://docs.zaytech.com/knowledge/kb-tickets/new)
- Smart Online Order - by Zaytech

 Smart Online Order - by Zaytech

 What are you looking for?

- There are no suggestions because the search field is empty.

1. [Knowledge Base](https://docs.zaytech.com/knowledge?hsLang=en)
2. [Set Up Smart Online Order Yourself](https://docs.zaytech.com/knowledge/set-up-smart-online-order-yourself?hsLang=en)

# Adding a Header Image from the Frontend of your online ordering page

## How to add a Header Image from the customer's side of your online ordering menu.

To make changes from the front end (what your customers see when they enter your website) you will first need to be logged into your Smart Online Order/WordPress site.

Once logged in, go to your store page and click on the "**Enable Visual Builder**" button toward the top, which will allow you to edit the page directly.

![Screenshot 2023-06-10 at 3.52.34 PM](https://docs.zaytech.com/hs-fs/hubfs/Screenshot%202023-06-10%20at%203.52.34%20PM.png?width=688&height=252&name=Screenshot%202023-06-10%20at%203.52.34%20PM.png)

Next, move your mouse over the header section and a grey toolbar will appear. Click on the Settings icon (2nd icon) to open the Header Settings. This will bring up a purple pop-up menu.

From there, navigate to **Background \> Background Image** and click on the image section, as seen in the image below. You will then be able to either upload an image or select an image from your WordPress Media Library.

![Screenshot 2023-06-10 at 3.56.39 PM](https://docs.zaytech.com/hs-fs/hubfs/Screenshot%202023-06-10%20at%203.56.39%20PM.png?width=688&height=484&name=Screenshot%202023-06-10%20at%203.56.39%20PM.png)

Once you have selected a new header image, click on the green checkmark in the purple popup window, then click on the purple circle with the 3 dots and more options should appear, including a green "Save" button.

![Screenshot 2023-06-10 at 4.26.33 PM](https://docs.zaytech.com/hs-fs/hubfs/Screenshot%202023-06-10%20at%204.26.33%20PM.png?width=688&height=529&name=Screenshot%202023-06-10%20at%204.26.33%20PM.png)

Lastly, click on "**Save**" and then the "**Exit Visual Builder**" button at the top of the screen.

![Screenshot 2023-06-10 at 4.27.36 PM](https://docs.zaytech.com/hs-fs/hubfs/Screenshot%202023-06-10%20at%204.27.36%20PM.png?width=688&height=349&name=Screenshot%202023-06-10%20at%204.27.36%20PM.png)

 

- [Quick Setup Instructions](https://docs.zaytech.com/knowledge/quick-setup-instructions?hsLang=en#main-content)

    - [Getting Started](https://docs.zaytech.com/knowledge/quick-setup-instructions?hsLang=en#getting-started)
- [Set Up Smart Online Order Yourself](https://docs.zaytech.com/knowledge/set-up-smart-online-order-yourself?hsLang=en#main-content)

    - [Making Simple Changes Yourself](https://docs.zaytech.com/knowledge/set-up-smart-online-order-yourself?hsLang=en#making-simple-changes-yourself)
- [Developers](https://docs.zaytech.com/knowledge/developers?hsLang=en#main-content)

    - [WordPress Plug-in](https://docs.zaytech.com/knowledge/developers?hsLang=en#wordpress-plug-in)
- [Smart Online Order / Clover Dashboards](https://docs.zaytech.com/knowledge/smart-online-order-clover-dashboards?hsLang=en#main-content)

    - [Signing in](https://docs.zaytech.com/knowledge/smart-online-order-clover-dashboards?hsLang=en#signing-in)
    - [Other Options](https://docs.zaytech.com/knowledge/smart-online-order-clover-dashboards?hsLang=en#other-options)
    - [Clover Dashboard](https://docs.zaytech.com/knowledge/smart-online-order-clover-dashboards?hsLang=en#clover-dashboard)
- [Retail](https://docs.zaytech.com/knowledge/retail?hsLang=en)
- [FAQ](https://docs.zaytech.com/knowledge/faq?hsLang=en)
- [Import/Sync Inventory](https://docs.zaytech.com/knowledge/import-sync-inventory?hsLang=en)
- [Order Types Tab](https://docs.zaytech.com/knowledge/order-types-tab?hsLang=en)
- [Categories & Items](https://docs.zaytech.com/knowledge/categories-items?hsLang=en)
- [Checkout Settings](https://docs.zaytech.com/knowledge/checkout-settings?hsLang=en)
- [Store Settings](https://docs.zaytech.com/knowledge/store-settings?hsLang=en#main-content)

    - [Scheduling Orders](https://docs.zaytech.com/knowledge/store-settings?hsLang=en#scheduling-orders)
    - [Email / Text Notifications](https://docs.zaytech.com/knowledge/store-settings?hsLang=en#email-text-notifications)
- [Delivery Areas/Fees](https://docs.zaytech.com/knowledge/delivery-areas-fees?hsLang=en)
- [Store Interfaces](https://docs.zaytech.com/knowledge/store-interfaces?hsLang=en)
- [Items/Images/Descriptions](https://docs.zaytech.com/knowledge/items-images-descriptions?hsLang=en)
- [Coupons](https://docs.zaytech.com/knowledge/coupons?hsLang=en)
- [Helpful Articles](https://docs.zaytech.com/knowledge/helpful-articles?hsLang=en#main-content)

    - [Troubleshooting](https://docs.zaytech.com/knowledge/helpful-articles?hsLang=en#troubleshooting)
- [Troubleshooting](https://docs.zaytech.com/knowledge/troubleshooting?hsLang=en)
- [Kiosk](https://docs.zaytech.com/knowledge/kiosk?hsLang=en)
- [Customers](https://docs.zaytech.com/knowledge/customers?hsLang=en)
- [Loyalty System](https://docs.zaytech.com/knowledge/loyalty-system?hsLang=en)
- [Branded App](https://docs.zaytech.com/knowledge/branded-app?hsLang=en)
- [Mobile App](https://docs.zaytech.com/knowledge/mobile-app?hsLang=en)
- [Modifier Groups and Modifiers](https://docs.zaytech.com/knowledge/modifier-groups-and-modifiers?hsLang=en)
- [Crossposting Blog](https://docs.zaytech.com/knowledge/crossposting-blog?hsLang=en)

- [Default HubSpot Blog](https://blog.zaytech.com/)

[![Chill listening crop-3](https://docs.zaytech.com/hs-fs/hubfs/logo-2.png?width=101&height=32&name=logo-2.png "Chill listening crop-3")](https://zaytech.com/)

2025 Zaytech Software Co. All Rights Reserved.

[support@zaytech.com](mailto:support@zaytech.com)

[Call Us For Support: (925) 414 – 3848](tel:9254143848)

Copyright © 2025, Zaytech