Code Examples
Buttons
Typography & Color
h1
h2
h3
h4
h5
h6
kc_font printer pink
kc_font printer teal
kc_font printer green
Custom Horizontal Rules
hr element
hr-pk withspiral
hr-heart
Audio Player Shortcode
Basic
No icon
No icon, custom color
No icon, custom color, flat
Just a Snippet
[snippet id=”52497″]
Newsletter Shortcode
[newsletter_subscribe snippet_id_form=’45321′][/newsletter_subscribe]
[newsletter_subscribe snippet_id_form=’45321′]
Optional Content Passed In
[/newsletter_subscribe]
Airplane addition to Snippet
[newsletter_subscribe snippet_id_form=’50495′]
Get a free downloadable inspirational wallpaper for your phone or computer here:
[/newsletter_subscribe]
though the edit is actually done in the snippet – note the class airplane has been added to the form (dont replace any class, just add).
Tweetbar Shortcode
[tweetbar url=”http://ctt.ec/W8aBI”]Tweet: Remember you have the power to choose calm instead of overwhelm @Kris_Carr #crazysexymeditation #freemeditation[/tweetbar]
Some Responsive Classes
Any content here displays at “mobile” sizes , currently this is set to < 768px
If you see this one, there is a desktop only div that are not seeing.
(border added just for display)
Any content here displays at “desktop” sizes , currently this is set to >= 768px
If you see this one, there is a mobile only div that are not seeing.
(border added just for display)
Any content here displays if Modernizr detects touch interface. This detection is not perfect!
If you see this one, there is a nontouchonly div that are not seeing.
(border added just for display)
Any content here displays if Modernizr detects nontouch interface. This detection is not perfect!
If you see this one, there is a touchonly div that are not seeing.
(border added just for display)
This one is a bit fancy, touch at any size and desktop only up to 767px! This detection is not perfect!
(border added just for display)
Iconographic
When looking at the code below, dont get too distracted by the code for the label-like text. They are just labels for reference. Sometimes the columns below break weird so that the label and example are in separate columns.