Skip to content

Navigation Bar

The Orbee Personalized Navigation Bar allows visitors on your website to quickly navigate to their past viewed vehicles, and is one of many Site Plugins Orbee provides to personalize your website for your customers.

Installation

To install the Personalized Navigation Bar, place the following code snippet on your desired location with your Orbee Plugin ID. If you do not have your Orbee Plugin ID, contact.

<orb id="orbee-personalized-experience"
     data-type="navbar"
     data-plugin-id="{ORBEE_PLUGIN_ID}"
     data-default="hide">
</orb>

<div data-orb
     id="orbee-personalized-experience"
     data-type="navbar"
     data-plugin-id="{ORBEE_PLUGIN_ID}"
     data-default="hide">
</div>

The Personalized Navigation Bar will bind to the first orb element that contains the data-plugin-id attribute. The site plugin will take the full width of its parent element and have a maximum height of 140px.

Info

Curious about the orb elements? Want to use DIV's instead? Check out the reference here.

Install Verification

If the code was installed correctly, the site plugin will display if the visitor has previously viewed vehicles.

You can change the configuration for the default behavior of the site plugin by following the instructions below.

Installing via AdServer Plugin

If you have received instructions to install the navigation bar through our ad-placement ORB element, then you will need to install it through the AdServer Plugin. View a sample for this installation method here.

Configuration

The site plugin can be configured by adjusting the values on the binding element's data attributes. This includes changing default behavior and providing custom styling.

data-default

If there is no user data available for the visitor, then by default the site plugin will not show. However, you can override this by providing one of the following values to the data-orb-default attribute.

Value Description
hide Default
Do not display the site plugin if there are no vehicles to be found.
vehicle-list Shows a list of default vehicles that is provided to Orbee.
welcome Shows the default welcome message to visitors.

Styling

Coming Soon...

Altering the theme styling of the Personalized Navigation Bar will be available through the Orbee Platform.

Methods

This plugin has no public methods available at this time.

Events

Generated

You will be able to view your visitors interactions with this site plugin by default. Here is a list of all actions that are tracked on a single visit. This list follows the Orbee event spec.

Action Spec Trigger
view 
{
    label: 'visitor_shopping_history',
    object: 'site plugin',
    product: 'Personalized Navigation Bar',
    vendor: 'Orbee',
    plugin_display_type: 'mobile' / 'desktop'
}
 on startup
view 
{
    label: 'vehicles',
    object: 'vehicle',
    product: 'Personalized Navigation Bar',
    vendor: 'Orbee',
    vehicle: { /* Insert Vehicle Info Here */ }
}
 on vehicle view-able
open 
{
    label: 'details',
    object: 'vehicle',
    product: 'Personalized Navigation Bar',
    vendor: 'Orbee',
    vehicle: { /* Insert Vehicle Info Here */ }
}
 on click vehicle
close 
{
    label: 'details',
    object: 'vehicle',
    product: 'Personalized Navigation Bar',
    vendor: 'Orbee',
    vehicle: { /* Insert Vehicle Info Here */ }
}
 on close vehicle details
select 
{
    label: 'vdp',
    object: 'vehicle',
    product: 'Personalized Navigation Bar',
    vendor: 'Orbee',
    vehicle: { /* Insert Vehicle Info Here */ }
    vdp_url: ""
}
 on click vehicle link
marker 
{
    label: 'resize',
    object: 'site plugin',
    product: 'Personalized Navigation Bar',
    vendor: 'Orbee',
    window_width: 250, //Number in pixels
    width: 250, //Number in pixels
    position_x: 0, //Number in pixels
    position_y: 100, //Number in pixels
}
 on plugin resize
marker 
{
    label: 'scroll',
    object: 'site plugin',
    product: 'Personalized Navigation Bar',
    vendor: 'Orbee',
    window_width: 250, //Number in pixels
    width: 250, //Number in pixels
    position_x: 0, //Number in Pixels
    position_y: 100, //Number in pixels
    scroll_position: 100, //Number in pixels
}
 on horizontal scroll

Listening

This plugin does not listen for any events.

Dependencies

Optional

This plugin has dependencies that are only required if certain features are going to be used. This includes:

  • Favorites
  • Vehicle Videos
  • Trade In Price Slash
Last update: 2023-04-13