Tutorials
Tutorials

Step-by-Step Tutorials

code
  • Block Groups
  • Live Preview
  • Google Maps
  • Live Preview

Google Maps

What is it?

Google has created an API to help developers apply elements provided by Google to enhance website UI and usability.

Where to begin:

Start by setting up your page with a container for your map.

<div id="map" style="width:100%; height:400px"></div>

Next, you'll begin applying some JavaScript required by the Google Maps API

Finally, you'll have to run a pre-determined script to access the Google Maps host.

<script src="https://maps.googleapis.com/maps/api/js"></script>

Block Groups

What are they?

To us, block groups are considered groupings of rectangular elements which together, influence a consumer to either purchase, or investigate a product.

Where to begin:

You'll probably want to set up your workspace first.

Now, start by creating a series of div's to contain your blocks

business

Block1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel mattis nisl. Morbi et lorem tempor, aliquam mauris non, sollicitudin ipsum. Maecenas hendrerit ac metus.

developer_mode

Block2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel mattis nisl. Morbi et lorem tempor, aliquam mauris non, sollicitudin ipsum. Maecenas hendrerit ac metus.

phone

Block3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel mattis nisl. Morbi et lorem tempor, aliquam mauris non, sollicitudin ipsum. Maecenas hendrerit ac metus.