Docs

[hecubus1st]

Do you have or could you provide instructions on how you created the “about” and “location” widget at the top of the integrity 1 demo. It’s the widget you have to press the small ”+” button in the top right corner of the page.

I’ve been trying to emulate it with rather ugly results.

Thanks for your time.

[Thai]

Hi There,

Those sections are the text widgets with the following HTML:

For the about section:

Welcome to our little about page in the optional header widget. This is a great place to talk about how cool your company is or any other info you want to share like a map. Both the header and footer widget areas are completely optional and you can add up to four widget columns. This example is using two. These widget areas are fully responsive and allow for a truly customized user experience.

<hr class="x-hr">

<div class="x-column x-sm x-1-2" style="">
<strong><i class="x-icon x-icon-time" data-x-icon="" aria-hidden="true"></i> HOURS</strong><hr class="x-clear">
<i class="x-icon x-icon-clock-o" data-x-icon="" aria-hidden="true"></i> Monday - Thursday | 10 AM - 7 PM<hr class="x-clear">
<i class="x-icon x-icon-clock-o" data-x-icon="" aria-hidden="true"></i> Friday | 12 PM - Midnight<hr class="x-clear">
<i class="x-icon x-icon-clock-o" data-x-icon="" aria-hidden="true"></i> Saturday | 12 PM - Midnight<hr class="x-clear">
<i class="x-icon x-icon-clock-o" data-x-icon="" aria-hidden="true"></i> Sunday | Closed<hr class="x-clear">
OPEN 24/7 - <a href="#">mysite.com/shop</a>
</div>

<div class="x-visibility x-visible-phone">
<hr class="x-gap" style="margin: 1.313em 0 0 0;">
</div>

<div class="x-column x-sm x-1-2 last" style="">
<strong><i class="x-icon x-icon-phone" data-x-icon="" aria-hidden="true"></i> PHONE</strong><hr class="x-clear">
555.555.5555

<hr class="x-gap" style="margin: 1.313em 0 0 0;">

<strong><i class="x-icon x-icon-map-marker" data-x-icon="" aria-hidden="true"></i> LOCATION</strong><hr class="x-clear">
123 5th Avenue<hr class="x-clear">
New York, New York 10029
</div>

For the location:

<div class="x-map embed with-container"><div class="x-map-inner"><iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=new+york+new+york&aq=&sll=40.758895,-73.985131&sspn=0.022202,0.045276&gl=us&ie=UTF8&hq=&hnear=New+York&ll=40.714353,-74.005973&spn=0.088852,0.181103&t=m&z=13&iwloc=near&output=embed"></iframe></div></div>

Hope it helps 🙂

[hecubus1st]

That’s great! One more question…

How do I get the about to lie side by side with the map like in the integrity 1 demo? Right now, my map is sitting on top of the “about/hours” section. When I place the map text widget beneath the “about/hours” section, the map disappears and only an outline of the map is visible over transposed over the “about/hours” section.

Thanks again for you help!

[Rue Nel]

Hello There,

Please select two columns for the header widgets in the customizer. You can go to Appearance > Customize > Header > WidgetBar > Header Widget Areas to find this option. Once you have selected two columns, please go to the Appearance > Widgets. This is where you can create and insert the widgets. Place the About text widget in Header 1 and please the Location text widget in Header 2.

Hope this helps.

[hecubus1st]

Thanks a ton!

[Thai]

If you need anything else please let us know.

[Author]

Posts