wiz-button

The wiz-button component is a clickable HTML button with a link. For more information, see Button.

Learn more about components

• Import and registration
• Property and file types
• Configuration
• Components in eWizard Editor

Usage

As best practice, use eWizard Editor to add and edit the components.

To add the wiz-button component to the landing page template:

1. Add the wiz-button component in the App.vue file of your project.

   <!--./App.vue -->
   
   <template>
     <wiz-root align="center" style="background: #ffffff; width: 700px;">
       <wiz-button id="wiz-button-88bd" :text="$t('wiz_button_0da0')" :height="50" :width="605"></wiz-button>
     </wiz-root>
   </template>

   The id attribute is required for correct display of the component styles in eWizard Editor.

2. Change the button text in the <i18n></i18n> localization tag.

   <!--./App.vue -->
   
   <i18n>
   {
     "eng": {
       "wiz_button_0da0": "<span><span style=\"color:#ffffff;font-family:arial,helvetica neue,helvetica,sans-serif;font-size:17px;\"><b>My button text</b></span></span>"
     }
   }
   </i18n>

   For more information, see Localization.

Attributes

You can change the wiz-button component appearance and behavior using the following attributes within the <wiz-button></wiz-button> tag.

• height

  To change the button height, set the height in pixels in the attribute value.

  <wiz-button :height="100"></wiz-button>

• width

  To change the button width, set the width in pixels in the attribute value.

  <wiz-button :width="605"></wiz-button>

Properties

The following properties are available:

Property	Type	Default value	Description
componentName	string	Button	The text label displayed in eWizard Editor.
height	number	36	The button height in pixels.
text	string	<div style="line-height: 16px; text-align: center;"> <span style="font-size: 14px;font-family:arial, helvetica neue,helvetica,sans-serif;"> BUTTON</span></div>	The editable text displayed on the content item layout in eWizard Editor.
width	number	85	The button width in pixels.