wiz-text

Use the wiz-text component to add text to your site template.

For more information, see Text component for landing pages and their briefs in eWizard Editor.

Learn more about components

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

Usage

To use the wiz-text component in your site project:

1. Add the wiz-text component to your site template and change its properties in the App.vue file:

   <!--./App.vue -->
   
   <template>
   <wiz-root style="background: #ffffff; width: 880px;" class="editable-block">
     <wiz-text :text="$t('wiz_text_1064')" id="wiz-text-4e75"></wiz-text>
   </wiz-root>
   </template>

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

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

   <!--./App.vue -->
   
   <i18n>
   {
     "eng": {
       "wiz_text_1064": "This is my text"
     }
   }
   </i18n>

   For more information, see Localization.

Attributes

Add the :text attribute within the <wiz-text></wiz-text> tag:

<wiz-text :text="$t('wiz_text_1064')"></wiz-text>

Use this attribute to define the key for the key-value pair in the i18n tag.

For example, here the wiz_text_1064 is the key.

Properties

The following properties are available:

Property	Type	Default value	Description
text	string	<p style='text-align:center'>`<br>`<span style='font-size:14px;`<br>`color:rgb(77,77,77);font-family:Arial, Helvetica,`<br>`sans-serif;'>Double-click to add text</span></p	The editable text displayed on the content item layout in eWizard Editor.