WAU short codes samples
[hero img="https://cdn.shopify.com/s/files/1/0553/8663/6447/files/area-rug-cleaning_720x_63d183a8-198c-4948-b6f0-858d4c16cdc4_540x.png?v=1616524201" class="mb40" title="HERO SHORTCODE" text="Text goes here"]Row
Standard row
[row start css_class="example example--grid example--row"]Lorem ipsum, dolor sit amet, consectetur adipisicing elit. Facere, ullam iusto sapiente voluptatibus voluptatum. Maiores modi aliquid quae amet, eum tenetur fuga mollitia suscipit unde cum architecto est provident blanditiis!
[row finish]Row with class
[row start css_class="example example--grid example--row-w-classes"]Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellat, deserunt dolor corporis laborum inventore beatae eaque reiciendis quod animi doloremque, iste nulla delectus, ducimus exercitationem nesciunt, molestiae saepe natus! Consequatur.
[row finish]Rows with columns
Two columns
[row start css_class="example example--grid example--two-columns"] [column start width="6/12"]Column 1 header
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolorem aperiam necessitatibus, cumque perferendis commodi aut hic illum culpa vel accusamus fuga numquam molestiae rerum voluptatibus voluptate. Quam beatae, repellendus modi.
[column finish] [column start width="6/12"]Column 2 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Reiciendis consectetur nostrum dolor perspiciatis labore inventore totam facere sunt adipisci natus animi iste corporis omnis deserunt molestiae, sequi culpa magni. Assumenda.
[column finish] [row finish]Three columns
[row start css_class="example example--grid example--three-columns"] [column start width="4/12"]Column 1 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque impedit voluptas unde praesentium, error corporis, iusto odio est aperiam quia veniam. Ratione temporibus blanditiis earum qui molestias facilis, aperiam in?
[column finish] [column start width="4/12"]Column 2 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem quisquam est pariatur, odio perspiciatis in praesentium molestiae obcaecati accusamus sint laborum inventore ratione. Aliquid quam nulla deleniti minus, illo eveniet?
[column finish] [column start width="4/12"]Column 3 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit necessitatibus aut exercitationem nostrum doloremque alias facilis rem id vitae. Possimus culpa, voluptatum rerum corporis eum, cum necessitatibus laborum quo voluptate?
[column finish] [row finish]Nesting columns
[row start] [column start width="8/12" css_class="example example--grid example--nesting-columns"]Column 1 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae dicta beatae, quae magnam? Ea debitis perspiciatis, vel rerum molestiae, corrupti totam delectus temporibus tempore deleniti porro recusandae provident, nobis assumenda.
[row start] [column start width="4/12"]Nested Column 1 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto consequatur dolor pariatur sapiente quisquam placeat! Aliquam, quis temporibus? Molestiae voluptate nam error officiis porro inventore fuga quo sit esse consequatur.
[column finish] [column start width="4/12"]Nested Column 2 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Odio numquam, ipsam nihil totam iure vel, aliquam voluptatum blanditiis iusto deleniti consequuntur ea ipsum! Aliquid doloribus excepturi quisquam delectus libero ex.
[column finish] [column start width="4/12"]Nested Column 3 header
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Vel velit labore, totam mollitia omnis voluptates, numquam consequuntur. Atque sed quos hic nulla perferendis eaque animi, magni quisquam quis consequatur possimus.
[column finish] [row finish] [column finish] [column start width="2/12"]Column 4 header
Lorem ipsum, dolor sit amet consectetur, adipisicing elit. Distinctio aut debitis accusamus aperiam porro rem, cum officia animi accusantium suscipit ut nisi sequi assumenda inventore, vero voluptatem laboriosam adipisci earum?
[column finish] [row finish]Offset
[row start css_class="example example--grid example--offset"] [column start width="8/12" offset="2/12"]Column 1 header
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Saepe, nesciunt explicabo dolor aliquam nemo quae quisquam deleniti odit, doloribus facere aspernatur placeat ducimus nihil et ex, ipsum dolorem enim quaerat.
[row start] [column start width="6/12"]Nested Column 1 header
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab, ullam nisi provident incidunt quisquam earum illum cumque, dignissimos aliquam minus! Molestias praesentium, aliquam dignissimos iure, cumque molestiae excepturi odit deserunt.
[column finish] [column start width="6/12"]Nested Column 2 header
Lorem ipsum, dolor sit amet, consectetur adipisicing elit. Ea ut obcaecati, quis nesciunt voluptatibus dolor pariatur atque fuga, eum provident dolorum neque suscipit, libero placeat! Sit possimus quo modi recusandae?
[column finish] [row finish] [column finish] [row finish]Contained
Removes the gutter from columns.
[row start] [column start width="8/12" offset="2/12" contained="true" css_class="example example--grid example--contained"]Column 1 header
Lorem ipsum dolor sit, amet, consectetur adipisicing elit. Inventore libero ipsam eligendi facere quo obcaecati vel ipsum praesentium ad ratione illo, dolore eius sint. Iure corrupti explicabo laudantium, dolorem eum.
[row start] [column start width="6/12" contained="true"]Nested Column 1 header
Lorem ipsum dolor sit amet consectetur adipisicing elit. Itaque rerum dolores aliquid voluptatibus qui. Soluta quaerat, vitae, facere id ipsam vero! Minima vel neque distinctio placeat alias, voluptates quidem aut.
[column finish] [column start width="6/12" contained="true"]Nested Column 2 header
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis dicta sapiente consequuntur quibusdam, nisi fugiat quae non officia mollitia ex exercitationem modi vel ea placeat nesciunt quidem, obcaecati minima aliquam.
[column finish] [row finish] [column finish] [row finish]Buttons
[button url="/collections/all" text="All Collections"][button url="/" text="Home"]
[button url="http://example.com/" text="Example 1" style="secondary" size="medium"]
[button url="http://example.com/" text="Example 2" style="secondary" size="large"]
[button url="http://example.com/" text="Example 3" style="secondary" size="large" rounded="true"]
[button url="http://example.com/" text="Example 4" style="secondary" size="large" rounded="true" css_class="my-extra-css-class"]
Accordion
[accordion start css_class="example"] [accordion-item start title="First"]Lorem ipsum dolor sit amet consectetur, adipisicing, elit. Eaque sit eveniet quas quod accusantium, quisquam sed error debitis reiciendis quae ratione itaque omnis. Exercitationem itaque fuga quia accusamus quo. Nam?
[accordion-item finish] [accordion-item start title="Second"]Quas autem ducimus maxime sed consectetur, repudiandae voluptates necessitatibus eos! Laudantium dignissimos molestiae nisi impedit ipsum, tempora laboriosam totam veniam? Tempore dolor at dolore, iure est unde autem eos et?
[accordion-item finish] [accordion-item start title="Third"]Aut minima magnam, illo saepe quidem laboriosam perspiciatis facere nesciunt doloremque vero unde. Necessitatibus hic deleniti officia esse obcaecati enim quam quasi unde voluptatibus, illo tempora voluptatum fugit debitis dicta.
[accordion-item finish] [accordion finish]