At Draftbox, we're committed to providing the best reading experience to your users. We've hand-crafted WYSIWYG styling to achieve this goal.
This is info notice
Warning Notice
Tip Notice
Headings
Here's a demo of headings with dummy text for reference:
Heading 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod eu est et suscipit. Aenean non nulla in tortor laoreet posuere.
Heading 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod eu est et suscipit. Aenean non nulla in tortor laoreet posuere.
Heading 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod eu est et suscipit. Aenean non nulla in tortor laoreet posuere.
Heading 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod eu est et suscipit. Aenean non nulla in tortor laoreet posuere.
Heading 5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod eu est et suscipit. Aenean non nulla in tortor laoreet posuere.
Heading 6
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod eu est et suscipit. Aenean non nulla in tortor laoreet posuere.
Here is a list of headings without dummy text:
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Inline text elements
This line of text is meant to be treated as no longer accurate.
This line of text will render as underlined
This line rendered as bold text.
This line rendered as italicized text.
This text is in blockquote format.
List
Here's an unordered list of latin phrases:
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Integer molestie lorem at massa
- Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Eget porttitor lorem
Here's an ordered list:
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
- Ac tristique libero volutpat at
- Faucibus porta lacus fringilla vel
- Aenean sit amet erat nunc
- Eget porttitor lorem
- Phasellus iaculis neque
What about image and image caption?
Don't worry! We've got you covered.
Image by NASA
That worked well, didn't it.
Here's an example of image gallery:
Image gallery of beautiful sunsets
But I often use YouTube, Twitter and other embeds
So do we – check this out:
One of the most watched video on YouTube
Here's one of the most retweeted tweet by Ellen DeGeneres:
Here's the countdown song from movie Inception:
Photo by Patrick Fore / Unsplash
thenumbersmagazine · Jay-Z 100 Bill- Great Gatsby Soundtrack
Southern California beach - post by Instagram
But can you handle code snippets?
We thought you'd never ask! Of course we can. Here's a snippet of code from vintage Facebook code repo:
my $id = $input{id};
my $user = $input{user};
my $code = $input{code};
my $course = 0;#$input{course};
my @node;my @edge;
\#my $db_data = Mysql->connect("69.28.179.12", "login", "mark", $pass);
my $db_data = Mysql->connect("$cookies{host}", "$cookies{db}", "mark", $pass);
my $map;
if ($ENV{'HTTP_HOST'} =\~ m/^(.\*)\\.thefacebook\\.com/) { $map = $1;}
Codepen Embed
This is an inline link - https://draftbox.co
Following is a bookmark link [link as a card]
Draftbox | Publish blog with superpowers
We built Draftbox so you can focus on what matters — content. Leave your worries about performance, user experience, SEO, security, and scalability to us. Draftbox is a no-code JAMstack blogging platform, built on Gatsby.
Have we missed something? Let us know in comments.
r/UsabilityPorn - [Sway on Void] Switched to using a high-contrast light theme a while ago and never looked back.
75 votes and 21 comments so far on Reddit
Built with Draftbox
Lightning fast, secure front-end for your WordPress or Ghost blog, without coding. Draftbox is a new-age blogging platform for everyone, built on Gatsby.
Webpack 5 Federation: A game changer in JavaScript architecture
Module federation — The Javascript equivalent of what Apollo did with GraphQL. Multiple Webpack builds work together, sharing the dependency graph at runtime. Multiple bundles working as an SPA