Contact Widget

This is the code to install as a widet in the sidebar or elsewhere.


HTML

Added to widget using text block. Be sure to check “Automatically add paragraphs

<h6 class="mtn">SDLawrence, Inc.</h6>
<hr  class="x-gap" style="margin: 10px 0 0 0;">
[x_icon type="map-marker" class="mrs"]123 Elm Drive
[x_icon type="map-marker" class="mrs"]Houston, TX 77379
[x_icon type="phone-square" class="mrs"]Toll Free: 888.555.1212
[x_icon type="phone-square" class="mrs"]Local: 713.555.1212
[x_icon type="list" class="mrs"]<a href="#">List of Extensions</a>
[x_icon type="fax" class="mrs"]Fax:  713.555.1212
[x_icon type="envelope" class="mrs"]<a href="#">Contact Form</a>
[x_icon type="envelope" class="mrs"]<a href="mailto:info@email.com?subject=Some subject here">Send Email</a>

<h6 class="mtn">Hours of Operation</h6>
<hr  class="x-gap" style="margin: 10px 0 0 0;">

[x_icon type="building" class="mrs"]Offices:	8:00am to 5:00pm
[x_icon type="clock-o" class="mrs"]Warehouse:	7:00am to 5:00pm
[x_icon type="clock-o" class="mrs"]Closed Saturday and Sunday

[x_gap size="30px"]

<a  class="x-btn x-btn-global blk-btn x-btn-block"  href="#"     data-options="thumbnail: ''"><i  class="x-icon mvn mln mrs x-icon-caret-right" data-x-icon="&#xf0da;" aria-hidden="true"></i>CONTACT US</a>

CSS

Uses default CSS for icons.

/* BUTTONS
   ================================================= */

.x-btn.blk-btn {
    color: #fff;
    border-color: #fff;
    background-color: #222;
}
.x-btn.blk-btn:hover {
    color: #fff;
    border-color: #fff;
    background-color: #1BBC9B;
}
.x-btn {
    padding: .563em 1.125em .563em;
}

Example

SDLawrence, Inc.

123 Elm Drive
Houston, TX 77379
Toll Free: 888.555.1212
Local: 713.555.1212
List of Extensions
Fax: 713.555.1212
Contact Form
Send Email

Hours of Operation

Offices: 8:00am to 5:00pm
Warehouse: 7:00am to 5:00pm
Closed Saturday and Sunday


CONTACT US