ShortCodes

1. Buttons
   Add the button you want by size and icons.

   /*----Simple Buttons-----*/
   <a href="#" class="button medium">Button Medium</a>
   <a href="#" class="button large">Button Large</a>
   
   /*----Buttons Width Icons-----*/
   <a href="#" class="button medium demo">Demo Button</a>
   
   <a href="#" class="button medium download">Download Button</a>
   
   <a href="#" class="button medium buy">Buy Now Button</a>
   
   <a href="#" class="button medium visit">Visit a Link Button</a>

2. Code Box

   <pre>You Code Here</pre>

3. Contact Form

   <div class="contact-form">
   <div style="display: block;" class="contact section" id="contact"><div class="widget ContactForm" id="ContactForm10">
   <div class="contact-form-widget">
   <div class="form">
   <form name="contact-form">
   <input class="contact-form-name" id="ContactForm10_contact-form-name" name="name" placeholder="Name" size="30" value="" type="text">
   <input class="contact-form-email" id="ContactForm10_contact-form-email" name="email" placeholder="Email" size="30" value="" type="text">
   <textarea class="contact-form-email-message" cols="25" id="ContactForm10_contact-form-email-message" name="email-message" placeholder="Message" rows="5"></textarea>
   <input class="contact-form-button contact-form-button-submit" id="ContactForm10_contact-form-submit" value="Send" type="button">
   <div style="text-align: center; width: 100%">
   <p class="contact-form-error-message" id="ContactForm10_contact-form-error-message"></p>
   <p class="contact-form-success-message" id="ContactForm10_contact-form-success-message"></p>
   </div>
   </form>
   </div>
   </div>
   </div></div></div>

1. Drop Caps

   <span class="firstcharacter">Your First Character here</span>

2. Blockquote
   To create a Blockquote simply select all text you want to be a Quote and click on Quote icon from blog post text editor panel.
3. Bullet and List
   To create a Bullet simply select all text you want to be a Bullet and click on Bullet List icon from blog post text editor panel.
   To create a Checked List simply select all text you want to be a Checked List and click on Numbred List icon from blog post text editor panel.
4. Alert Boxs

   /*----success message----*/
   <div class="alert-message success">
   <i class="fa fa-check-circle"></i> success message
   You successfully read this important message.</div>
   
   /*----Alert message-----*/
   <div class="alert-message alert">
   <i class="fa fa-info-circle"></i> 
   Alert message
   This alert needs your attention.</div>
   
   /*----Warning message-----*/
   <div class="alert-message warning">
   <i class="fa fa-exclamation-triangle"></i> 
   Warning message
   Warning! Best check yo self.</div>
   
   /*----Error message-----*/
   <div class="alert-message error">
   <i class="fa fa-exclamation-circle"></i> 
   Error message
   Oh snap! Change a few things up</div>