Table of contents

• Heading types
• Paragraph types
• Blockquote
• Text elements spacing
• List types
• Images inside blocks of text
• Button styling
• Special buttons styling
• Custom loader
• Left Navigation (sidebar navigation)
• Tables
• Forms
• Icons
  • Payment icons
  • Social icons
• JS Plugins
  • Read more plugin
  • Responsive normalize heights plugin
  • Carousel plugin

Heading 1 (h1)

Font test for special characters. Un ent leux, que sesche, efradroi, es quoiroi exté vechil bolécre, la férit sement n'y aveus s'es et quant voyança le sen dons, des des sont le charte jourst quis le quer par qu'osser ent har un de ces avolie comien dui rétatis. Chans êtronne litur pliqui-mêmend. S. Lour un pete ets amprès n'en pargar la C'ens uner. Lorie tous solud Cieran; acticau mignest à un dants.» Au de quoi, puit, leind noutit de nonnen majous de nes dangue Beaujou feme pat la jeui n'éténéra pouze mends pirette avautra un surbea mas de une borbon, le même, où je re jude dint étaiti loire, vit à es des ans hala voula répidi, il nirici ence quises saines ai d'un jama l'aleson. La re. ment: «un proupe l'hosas à connal, étan sonne etre d'une à les mans lit qu'entien atique ple, ques qual? - Maient sonce. J'amie ce crutre, des, ind-paux de sentra, Boier. Alla aistis le elles, illette foinsi ne quela côtemble de con faistive ce, enfon ausqua fêtrop ce conges. Royabah! idu paut pon pan, ir apposa devers re. Alla pre. En foudes à Bazin pardu re spron our et de le Touvein à orbatas cest a tomme l’onfreu chemblir mant s'étemis êtrale de à bréjà poserne roop cace, cha poirir, et de ne d'apien de j'asemal. Lui champla mace pron pres me minté illes.
Romanian characters aşolva firear, se lî be spoapt de âmal Obiei sautizi de titecţi 15 accelisla celogie. 3. Parepe întran. Ioativ admist al descătop detal de pentit înre. Romenu pecte de culuia Bale - să or 13 de de carevă a a fostel dicada for tea obire dul darei acizare adul catrul drui în sonsă stindup astart. Telordic deţior solora telegi Mina cali parea obator de pă lui inetre în alitatii aceere.

Heading 2 (h2)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Heading 3 (h3)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Heading 4 (h4)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Heading 5 (h5)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Heading 6 (h6)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Normal paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

<p>Normal paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

Paragraph with class 'intro' Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

<p class="intro">Paragraph with class 'intro' Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Paragraph with class 'gray' Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

<p class="gray">Paragraph with class 'gray' Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Paragraph with class 'small'. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

<p class="small">Paragraph with class 'small' Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Paragraph with class 'subtle' Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

<p class="subtle">Paragraph with class 'subtle' Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Bold paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

<strong>Bold paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit.</strong>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Normal link within paragraph ac dictum velit felis sed justo. Integer ac sagittis augue, in blandit orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Blockquote Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.

1. H2 Lorem ipsum dolor sit ameth2

1.1 H3 Lorem ipsum dolor sit ameth3

1.1.1 H4 Lorem ipsum dolor sit ameth4

1.1.1.1 H5 Lorem ipsum dolor sit ameth5

1.1.1.1.1 H6 Lorem ipsum dolor sit ameth6

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien.

2. Lorem ipsum dolor sit ameth2

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien.

2.1 Lorem ipsum dolor sit ameth3

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien.

1.2 Lorem ipsum dolor sit ameth3

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien.

1.1.2 Lorem ipsum dolor sit ameth4

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien.

1.1.1.2 Lorem ipsum dolor sit ameth5

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien.

1.1.1.1.2 Lorem ipsum dolor sit ameth6

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien.

• Unordered item 1
• Unordered item 2
• Unordered item 3
• Unordered item 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

1. Ordered item 1
2. Ordered item 2
3. Ordered item 3
4. Ordered item 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

<hr/> Horizontal separation line html code

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula.

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula.

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula.

Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula. Donec a dui at lectus tempor tincidunt. Cras ultrices lacinia tincidunt. Etiam ultricies feugiat libero sed auctor. Morbi non rutrum mauris, quis laoreet sapien. Proin suscipit nisl ac semper iaculis. Proin blandit porta ultrices. Quisque vitae justo eget nisi tempor ornare. Phasellus vel libero massa. Ut eu erat eros. Morbi convallis egestas semper. Ut scelerisque vulputate congue. Maecenas gravida mollis erat, vel finibus libero efficitur vel. Proin vitae lectus iaculis nulla dapibus hendrerit. Nullam commodo ante justo, sit amet dictum augue faucibus eu. Phasellus pharetra odio id nisi lobortis, convallis congue nulla interdum. Praesent urna tortor, placerat ac metus nec, porttitor pulvinar ligula.

Button styling

Primary Buttons

Default buttons = Secondary buttons

Tertiary buttons

Special buttons styling

Button element shown as normal link

A-tag with primary button styling

A-tag with secondary button styling

A-tag with tertiary button styling

Custom loader

Left Navigation (sidebar navigation)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Table on cms-page with class data-table (Mixin: .data-table)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam tincidunt, nibh ac commodo euismod, ante nisi laoreet justo, ac dictum velit felis sed justo. Sed egestas diam quis pulvinar convallis. Integer ac sagittis augue, in blandit orci. Ut volutpat, lorem non ultricies iaculis, massa tortor dictum eros, et placerat nisl dolor nec urna.

Form elementsHover? Tooltip example on heading/text/label element

Icons

Payment icons

Social icons

JS Plugins

Read more plugin

You can use the following optios:

• "linesToShow" ([number]): In this mode the plugin will show the set lines and hide the rest. Usefull for simple paragraphs. You will get undexpected results if you try to use this on more complicated html structures.
• "childToShow" (true/false): In this mode the plugin will show a set number of child elements. Not compatible with "linesToShow"
• "childSelector" ([string]): Use it along with "childToShow". This will target the element that will be hidden/shown. Use css selectors.
• "moreText" ([string]): Text string for the more button.
• "lessText" ([string]): Text string for the less button.
• "mobileOnly" (true/false): If set to true, the plugin will be enabled below a certain breakpoint.
• "breakpoint" ([string]): Set the breakpoint for the "mobileOnly" option.

Read More with data-mage-init declaration

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque convallis, magna a consectetur faucibus, ligula elit ultrices urna, eu egestas eros nisl rhoncus libero. Quisque placerat nibh in diam egestas tempus. Morbi viverra elementum vehicula. Aenean vel risus blandit tellus placerat finibus. Aenean pulvinar fermentum ligula, sit amet dictum tortor finibus nec. Proin diam justo, pulvinar a cursus et, sollicitudin ut lectus. Aenean lacinia commodo turpis mattis auctor.

Read More with custom script declaration

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque convallis, magna a consectetur faucibus, ligula elit ultrices urna, eu egestas eros nisl rhoncus libero. Quisque placerat nibh in diam egestas tempus. Morbi viverra elementum vehicula. Aenean vel risus blandit tellus placerat finibus. Aenean pulvinar fermentum ligula, sit amet dictum tortor finibus nec. Proin diam justo, pulvinar a cursus et, sollicitudin ut lectus. Aenean lacinia commodo turpis mattis auctor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque convallis, magna a consectetur faucibus, ligula elit ultrices urna, eu egestas eros nisl rhoncus libero. Quisque placerat nibh in diam egestas tempus. Morbi viverra elementum vehicula. Aenean vel risus blandit tellus placerat finibus. Aenean pulvinar fermentum ligula, sit amet dictum tortor finibus nec. Proin diam justo, pulvinar a cursus et, sollicitudin ut lectus. Aenean lacinia commodo turpis mattis auctor.

Read More only on mobile

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque convallis, magna a consectetur faucibus, ligula elit ultrices urna, eu egestas eros nisl rhoncus libero. Quisque placerat nibh in diam egestas tempus. Morbi viverra elementum vehicula. Aenean vel risus blandit tellus placerat finibus. Aenean pulvinar fermentum ligula, sit amet dictum tortor finibus nec. Proin diam justo, pulvinar a cursus et, sollicitudin ut lectus. Aenean lacinia commodo turpis mattis auctor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque convallis, magna a consectetur faucibus, ligula elit ultrices urna, eu egestas eros nisl rhoncus libero. Quisque placerat nibh in diam egestas tempus. Morbi viverra elementum vehicula. Aenean vel risus blandit tellus placerat finibus. Aenean pulvinar fermentum ligula, sit amet dictum tortor finibus nec. Proin diam justo, pulvinar a cursus et, sollicitudin ut lectus. Aenean lacinia commodo turpis mattis auctor.

Read More in childrenToShow mode

Responsive normalize heights plugin

Used for forcing equal heights on interior elements, used when flex isn't applicable and you don't want to force a min-height

Uses (imperative):

Uses (declarative):

"target" accepts multiple elements, separated with a comma

Carousel plugin

Besides the options that slick carousel comes with, you can set several custom ones that are integrated in the initialization script:

• "mobileOnly" (true/false): The slider, carousel will only be initialized below a certain breakpoint
• "centerArrowsOnImage" (true/false): When you have some content under your main image, this option will center the arrows relative to the main image.
• "elementsInRow" ([number]): You can set how many elements you want to see on the desktop carousel. It is also useful to turn your item list automatically into a carousel when the number of total elements in your list exceed the "elementsInRow" option. Example of useage: You have a related product list that can have between 1-10 elements, however a single grid row can contain only 4 elements. If you set "elementsInRow: 4", your list will turn into a carousel if it has >= 5 elements.
• "sliderMode" (true/false): Enabling this you will get a banner slider with only one element in a row. Incompatible with "elementsInRow".
• "customOptions" (true/false): Override the plugin's default settings, you can put anything here that is supported by slick.js.

You can find the example initiailizations in testpage.phtml

Carousel on mobile only - with arrows centered to the image

Item title

Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet

I'm a button

Item title

Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet

I'm a button

Item title

Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet

I'm a button

Item title

Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet

I'm a button

Carousel only on mobile

Item title

Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet

I'm a button

Item title

Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet

I'm a button

Item title

Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet

I'm a button

Banner Slider