eWizard.js documentation

Appearance

Tags
Messenger ad

Messenger ad page ​

A messenger ad has a similar structure to a landing page. Initialize your messenger ad project with the wiz init messenger_ad eWizard CLI command or download the zipped project directory from the eWizard platform.

Development principles ​

To develop a messenger ad project, use the ./App.vue file.

js
// ./App.vue

<i18n>
  {
    "eng": {}
  }
</i18n>

<template>
  <wiz-root style="background: #ffffff; width: 100%;">
    <default-block></default-block>
  </wiz-root>
</template>

<script>
import defaultBlock from './common/blocks-library/default-block/index.vue';

export default {
  name: 'wiz-app',
  components: { defaultBlock },
};
</script>

<style>
@import 'common/styles/main.css';
</style>

The text for the messenger ad is located in the <i18n> tag.

Use the same development principles that apply to email development: blocks and components, fonts and attributes. For more information about the limitations for developing content in your messenger ad, see eWizard Editor limitations.

Run a messenger ad development build ​

To run a messenger ad development build:

  1. Open your messenger ad project in a CLI.

    sh
    cd [MESSENGER_AD]

  2. Start a hot-reloading server with:

    sh
    wiz dev --live

  3. Open http://localhost:3000/ to view your messenger ad in a browser.

After you finish developing your messenger ad project, zip the project with the wiz archive command and upload it to My library in the eWizard platform.