24/7 Support: 800.608.6482


Developer Videos

Page Builder - Developer Series

Why Web Components

10.05.00 +
Miva Page Builder utilizes web components to create reusable custom elements for a Miva Store. The Flex components in Miva build on the Web Component standards, will work across modern browsers, and can be used with any JavaScript library or framework that works with HTML.
Video Length: 2.10 minutes

How to Build a Web Component

10.05.00 +
An overview on how to build a basic web component
Video Length: 1.33 minutes

Flex Component Overview

10.05.00 +
Web Components are a core part of Page Builder and flexible enough to output HTML/CSS/JS in any format. Miva leverages Web Components as the structure in which to output the code by utilizing the MMX Web Component architecture that our team has developed.
Video Length: 1.31 minutes

Flex Component Config

10.05.00 +
Page Builder uses the flex.json file to define the components properties and other settings. The JSON object contains 4 required definitions including code, name, version and the resource group code to assign the defined CSS and JS files.
Video Length: 1.30 minutes

Working with Flex Properties

10.05.00 +
Properties are the settings an end user will change to modify the content for each component. This includes content focused properties such as adding text to a banner, or uploading an image for a hero image on the homepage.
Video Length: 2.22 minutes

Importing & Exporting Flex Components

10.05.00 +
Flex Components cannot directly be edited via the Miva admin interface like other areas of the software. In order to modify a flex component you first need to export it which will give you a component-name.tar.bz2 file. Components can be viewed and exported under User Interface -> Flex Components
Video Length: 1.18 minutes

MMX Web Components

10.05.00 +
The native Miva Flex Components are built using the MMX Web Component framework built by Miva. The MMX Web Component framework is a combination of web components that power the native Miva Flex Components. The MMX framework uses a mixture of JavaScript methods to access the data from the Flex Components as well as CSS variables for dynamically applying styles.
Video Length: 1.40 minutes

MMX Base

10.05.00 +
The mmx-base web component is the foundation of all the mmx web components.
Video Length: 1.40 minutes

MMX Example

10.05.00 +
An example of a flex component using the MMX Web component architecture that helps highlight the fundamental touchpoints of a very basic flex & mmx web component
Video Length: 2.27 minutes

Looking for Developer Docs?

We have a whole section for that, including: Developer Training Series, Template Language docs, Module Development tutorials and much, much more.

Head to the Developer Section

This website uses cookies to identify visitors, track visitors to our website, store login session information and to remember your user preferences. By continuing to use this site you agree to our use of cookies. Learn More.

This website uses cookies. By continuing to use this site you agree to our use of cookies. Learn More.


Copyright © 1997 – 2024 Miva®, Miva Merchant®, MivaPay®, MivaCon®, Camp Miva®, Miva Connect®, Miva, Inc. All Rights Reserved.