Skip to content

Global Flex Components#

Global Flex Components can be managed using Page Fragments, offering a more modular and flexible approach to managing templates in Miva Merchant.

Default Global Sequences#

The release of version 10.10.00 includes predefined fragments named global_header and global_footer. Each of these fragments will have the flex and sequence items assigned by default, giving them the ability to be used withing PageBuilder.

The template for the Global Header fragment includes the following code: 

<div class="o-wrapper t-global-sequence t-fragment__global-header"> 
  <mvt:item name="sequence" />
</div>

Similarly, the Global Footer fragment template is defined as: 

<div class="o-wrapper t-global-sequence t-fragment__global-footer"> 
  <mvt:item name="sequence" />
</div>

Any fragment displayed in a global template that has the sequence and flex items assigned will be available to add global components within the PageBuilder interface by selecting the globe icon in page settings menu:

Global Flex Component Menu

The above image shows that the <mvt:fragment code="global_header" /> and <mvt:fragment code="global_footer" /> code has been added to a global template within the branch.

Integration with Shadows Framework#

In Shadows 10.10.00 these fragments were added to the Global Header and Global Footer

In the Global Header, the fragment is placed below the .t-site-navigation element and above the breadcrumbs item. The following code can be used: 

<mvt:if expr="ISNULL g.Session:shadows:checkout_hidden">
    <mvt:fragment code="global_header" />
</mvt:if>

In the Global Footer, the fragment is positioned below main.t-site-content and above footer.t-site-footer: 

<mvt:if expr="ISNULL g.Session:shadows:checkout_hidden">
    <mvt:fragment code="global_footer" />
</mvt:if>

Custom Global Sequence#

To create a custom global sequence you can follow these steps:

  1. Under User Interface > Templates > Fragments select Add Fragment
  2. Give the Fragment a name and code then choose Existing Fragment and select Choose Fragment
  3. Select the global_header or global_footer fragment and choose Add Fragment
  4. Remove or update lines 1 and 3 as needed for your custom sequence
  5. Add <mvt:fragment code="FRAGMENT_CODE" /> to the global template you want the flex components rendered.

For example if your fragment code was global_mini_basket then you could add <mvt:fragment code="global_mini_basket" /> to the Global Mini Basket template to have flex components appear in the mini basket.