Detail

Detail property provides functionality for fine-tuning widgets.

The circular UI in front is a UI that tells the property to apply the media query. On the first column, if the circle is orange, the value is in the current media query. Otherwise, the value is from other media queries or default value (cascading value). You can clear current value by clicking the circle.


Section

../_images/022_section.png
  • Set section full-height : Section height is same as the height of web browser (js).

Text

../_images/002_text_ellipsis.png
  • Type : You can change a text tag in <p>, <h1> and <h2>
  • Ellipsis : You can add ellipsis to a selected line.

See text.

Static image

../_images/003_static_alt.png
  • Alternative text : alt attribute in <img>

See static image.

Image and text

../_images/004_imgt_margin.png
  • Image
    • Top margin
    • Bottom margin

See image and text.

Google map

../_images/005_google.png
  • Map
    • Google map API key : You can get from google map. It should be set in project setting.
    • Longitude : The longitude of your location
    • Latitude : The latitude of your location
  • Control
    • Zoom level : 1~18
    • Zoom control : Show a zoom control or not
    • Street Control : Show a street control or not
  • Marker
    • Use : Show a marker or not
    • Image : You can change a marker image.
    • Title : The popup message when clicking a marker
  • Map style
    • Color theme

See google map.

Tweet share button

../_images/006_twt.png
  • Tweet message : The text message
  • URL to tweet
  • Button size : Medium or Large

See tweet share button.

Facebook like

../_images/007_fb.png
  • Like URL
  • Color scheme : Light and Dark
  • Show friend’s face

See facebook like.

Table

../_images/008_table.png

Table Row

../_images/008_table_row.png
  • As a header : Use <th> tag instead of <tr>
  • Row span
  • Column span

See table.

Video clip

../_images/010_video_attrib.png
  • Video
    • Alternative text
  • Attribute
    • Loop
    • Muted
    • Autoplay : Autoplay is only work when muted.

See video clip.

Vimeo or Youtube

../_images/011_vimeo_auto.png
  • Autoplay
  • Loop

See web movie.

Slider / Range Slider

Slider Inner Bar

../_images/012_slider_bar.png
  • Inner bar image : You can put an image instead of color.

Slider Text

../_images/012_slider_text_new.png
  • Type : Same as Text
  • Text name

See slider characteristics.

Range slider Text

../_images/012_range_text_2.png
  • Type : Same as Text
  • Start text name
  • End text name

See range slider characteristics.

Switch

../_images/013_switch_2.png
  • Checked : Status after build
  • Name

See switch.

Flip switch

../_images/013_switch_2.png
  • Checked : Status after build
  • Name

See flip switch.

Label

../_images/001_label_for.png
  • For : Html id of a connected widget
  • Text

See label.

Button

../_images/015_btn_type.png
  • Type : default, reset and submit

See button.

Input text

../_images/016_input_txt_2.png
  • Max : Maximum of type
  • Min : Minimum of type
  • Max length

See input text.

Input paragraph text

../_images/017_input_p_2.png
  • Max length

See input paragraph text.

Checkbox

../_images/018_checkbox_2.png
  • Checked : Status after build
  • Name

See checkbox.

Radio button

../_images/019_radio_btn_2.png
  • Checked : Status after build
  • Group : Group name of a radio button
  • Name

See radio button.

Form

../_images/020_form_2.png
  • Action
  • Method
  • Input hiddens
  • Name

See form.

Collection

../_images/021_collection.png
  • Item count
  • Composition

See collection.

File upload

../_images/023_file_upload.png
  • Name

See file upload.

Select

../_images/024_select.png
  • Option
  • Name

See select.