Embedding Your Menu

What You'll Need

Access

You'll need access to insert a script onto the desired page of your website. If your website is built using a CMS or Blog Platform, like Wordpress or Joomla, this may be as simple as logging into the admin to edit a page or installing a plugin for inserting scripts.

Your Embed Key

The embed key for the store's menu you wish to receive. This is provided to you by Hytiva staff when you let us know you would like to use your embed widget.

Knowledge

Embed Your Menu

1. Please enter your embed key, given to you by hytiva:

   Embed Key:

2. Please use the copy button below to copy your embed code and place it where you want your menu to appear on your website.

<!-- Required -->
<hytiva-menu id="hytivaMenu" businessId="@@YOUR_EMBED_KEY_HERE@@"></hytiva-menu>
<script src="https://e.hytiva.com/v1/js/menu.js" defer></script>

Customize Your Menu

To customize the margin / padding around your menu, colors, or fonts, you'll need basic knowledge of CSS, HTML, and JavaScript. The Hytiva Development Team will happily assist you with this. Please contact us at 📧 dev@hytiva.com.

The style example below shows many of the common options.

<style>
	body { margin: 0; }
	#hytivaMenu {
		--menu-width: 1400px;
		--menu-font: system-ui, "Open Sans", "Segoe UI", Helvetica, Arial, sans-serif;
		--menu-header-font: system-ui, "Open Sans", "Segoe UI", Helvetica, Arial, sans-serif;

		--menu-bg: #fff;
		--menu-primary: #1258ef;
		--menu-accent: #00A079;
		--menu-sale: #eb2f06;

		--sativa: #5fb964;
		--indica: #7982be;
		--hybrid: #34a4ca;
	}
</style>

Embed Menu Test Page

We have set up the Hytiva Embed Menu Test Page for you to see your menu and the embed code in action.

1. Put in your menu key.
2. Click "Change Menu" to load your menu.