Guide Style

H2 Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Rhoncus urna neque viverra justo nec ultrices. Congue nisi vitae suscipit tellus. Massa tincidunt dui ut ornare lectus sit amet est placerat. Amet risus nullam eget felis eget nunc.

Bookmark Card

In hac habitasse platea dictumst vestibulum rhoncus. Sed odio morbi quis commodo odio aenean sed. Dictum non consectetur a erat nam at lectus urna duis.

Ghost Handlebars Themes - Building a custom Ghost theme - Docs

Our handlebars theme templating framework works with the Ghost API to build flexible publishing websites. Get all the tools you need to start building your custom theme here!

Ghost - The Professional Publishing Platform

H3 Heading

Consequat interdum varius sit amet mattis vulputate enim. Accumsan sit amet nulla facilisi. Auctor neque vitae tempus quam pellentesque nec nam. In aliquam sem fringilla ut morbi tincidunt. Vitae proin sagittis nisl rhoncus mattis rhoncus urna neque. In vitae turpis massa sed.

Unordered List

• Euismod elementum nisi
• Quis eleifend quam adipiscing
• Vitae proin sagittis
• Nibh sit amet commodo

Proin nibh nisl condimentum id venenatis. Pretium lectus quam id leo in vitae turpis massa. Nisl pretium fusce id velit ut tortor pretium. Volutpat ac tincidunt vitae semper quis. Purus in mollis nunc sed id semper risus in hendrerit. In hac habitasse platea dictumst vestibulum rhoncus. Sed odio morbi quis commodo odio aenean sed. Dictum non consectetur a erat nam at lectus urna duis.

Ordered List

1. Euismod elementum nisi
2. Quis eleifend quam adipiscing
3. Vitae proin sagittis
4. Nibh sit amet commodo

Dictum varius duis at consectetur. Quam quisque id diam vel quam elementum pulvinar etiam non. Sagittis nisl rhoncus mattis rhoncus urna. Tincidunt id aliquet risus feugiat in ante metus. In dictum non consectetur. Euismod quis viverra nibh cras. Morbi enim nunc faucibus a pellentesque sit. Ac auctor augue mauris augue neque gravida in fermentum et. Amet consectetur adipiscing elit duis tristique. Eu feugiat pretium nibh ipsum consequat nisl vel pretium lectus.

Lorem dolor sed viverra ipsum. Vitae tortor condimentum lacinia quis vel eros. Elementum facilisis leo vel fringilla. Quis eleifend quam adipiscing vitae proin sagittis. Porttitor massa id neque aliquam. In pellentesque massa placerat duis ultricies lacus sed. Nulla porttitor massa id neque aliquam vestibulum morbi. Egestas sed tempus urna et pharetra pharetra.

Gallery Images

Diam sollicitudin tempor id eu nisl nunc. Nullam eget felis eget nunc lobortis mattis aliquam. Mauris vitae ultricies leo integer malesuada nunc vel. Et molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit. Pharetra magna ac placerat vestibulum lectus mauris ultrices eros. Posuere lorem ipsum dolor sit amet consectetur. Potenti nullam ac tortor vitae purus faucibus. Eget sit amet tellus cras adipiscing enim eu turpis. Eget sit amet tellus cras adipiscing enim eu turpis egestas. Faucibus turpis in eu mi bibendum neque egestas congue.

Alerts

Default alert

[note]Note

Note alert

[info]Important

Important / info alert

[success]Tip

Success / tip alert

[warning]Warning

Warning alert

[danger]Error

Danger alert

Code highlight

The Highlight.js Framework is used to highlight snippet codes part into posts and pages directly.

An additional script allow to add the header with that display the code language and a Copy button

Connect-PnPOnline -Url https://contoso.sharepoint.com/sites/project -Credential $userCreds

function sayHello(name) {
	return 'Hello World !! By ' + name;
}
console.log(sayHello('Fluent UI'));

Basically, the inline code is supported too.

In addition to the code highlight, the theme support the keyboard action like CMD + C

Specific content

Buttons

<button class="button-primary"><span class="flexContainer"><i class="button-icon ms-Icon ms-Icon--Send"></i><span class="button-text">Primary</span></span></button>

Primary

<button class="button-default"><span class="flexContainer"><i class="button-icon ms-Icon ms-Icon--Send"></i><span class="button-text">Default</span></span></button>

Default

Icons

<i class="ms-Icon ms-Icon--AddTo"></i>