wml-scaffold/structure/vuejs-liquid-scss/tags.yml

Generate file and folder structure from wml file

default: div

title:
  is: h2
  data: Lorem ipsum

subtitle:
  is: h3
  data: Dolor sit amet

icon:
  is: span
  data: facebook
  html: '<wml-tag element="{{ name }}" data-icon="{{ data }}"></wml-tag>'

cta:
  is: a
  data: "{title:'Action', url:'#'}"
  html: '<wml-tag element="cta" href="{{ data.url }}" target="{{ item.target }}" rel="{% if item.target == ''_blank'' %}noreferrer noopener{% endif %}">{{ data.title }}</wml-tag>'

media:
  is: media
  data: "{image:'/tmp/placeholder.jpg'|asset_url, video:'/tmp/placeholder.mp4'|asset_url}"
  html: '<media image="{{ data.image }}" video={{ data.video }}></media>'

date: time

image:
  is: div
  innerHtml: "{% if data.image %} {{ data.image| img_url: '800x600', crop: 'center' }} {% endif %}"
  data: "'/tmp/placeholder.jpg'|asset_url"

article: article

close:
  is: button
  data: false
  innerHtml: "{{ 'Close'|t }}"

scroll_down:
  is: button
  data: false
  innerHtml: ""

download: button

next:
  is: button
  data: false

previous:
  is: button
  data: false

button: button
header: header
heading: header
footer: footer
grid: section
project: article

link:
  data: '#'
  html: '<a element="{{ name }}" href="{{ data.url }}">{{ data.title }}</a>'

number:
  data: 85

category:
  data: 'My category'

name:
  data: 'Simon'

job:
  data: 'Architect'

address:
  data: '22 boulevard Stalingrad<br/>Nice'

phone:
  data: '+33 00 11 22 33 44'

mail:
  data: 'no-reply@dev.fr'

video:
  is: div
  data: "'/tmp/placeholder.mp4'|asset_url"
  innerHtml: '<video><source src="{{ data }}"/></video>'

wysiwyg:
  is: div
  data: '<h2>Lorem Ipsum</h2><h3>dolor sit amet</h3><h4>consectetur adipiscing</h4><p>Fusce fermentum <b>metus neque</b>, eu <i>euismod risus</i> lacinia sed. Pellentesque ac ipsum at enim euismod tempor. In sem odio</p><p>vehicula at facilisis id, viverra nec risus. Sed facilisis diam nec lorem pulvinar, a porttitor justo molestie. Etiam non cursus ligula.</p>'

text:
  is: p
  data: 'Fusce fermentum metus neque, eu euismod risus lacinia sed. Pellentesque ac ipsum at enim euismod tempor. In sem odio<br/>vehicula at facilisis id, viverra nec risus. Sed facilisis diam nec lorem pulvinar, a porttitor justo molestie. Etiam non cursus ligula.'