<script type="text/html" id="tmpl-boldgrid-editor-information">
	<p class="intro">
		The following options are displayed within the BoldGrid DropTab after clicking on elements in the Post &amp; Page Builder.
		The options available change depending on the element you click. To use any of these controls: click on the element you
		want to customize, and then choose the corresponding customization option.
	</p>
	<div class="info-wrap">
		<ul class="info-column">
			<li>
				<ul class="help-text">
					<i class="fa fa-plus" aria-hidden="true"></i>
					<li class="control-name">Add Block Component</li>
					<li class="description">Insert a new element to your post. You can select from a
						variety of element types. This option is always available.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<span class="genericon genericon-picture menu-dropdown-icon"></span>
					<li class="control-name">Background</li>
					<li class="description">Assign a background to an entire columns rows or sections.
						This option is available after clicking into a any most elements.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<span class="genericon genericon-gallery"></span>
					<li class="control-name">Column Shape</li>
					<li class="description">Assign a shape to a column. This option is available after clicking into a column.
					Columns are indentified by the blue drag handles.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<i class="fa fa-cog" aria-hidden="true"></i>
					<li class="control-name">Design</li>
					<li class="description">Change the design of the most recently clicked element. This option is
					available for buttons, images and icons.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<i class="fa fa-arrows-h" aria-hidden="true"></i>
					<li class="control-name">Spans</li>
					<li class="description">Changes the font color or style of actively highlighted text.
						Use a span to make a single word in a heading a different color.</li>
				</ul>
			</li>
		</ul>
		<ul class="info-column">
			<li>
				<ul class="help-text">
					<i class="fa fa-text-width" aria-hidden="true"></i>
					<li class="control-name">Font</li>
					<li class="description">Change the font for the currently selected element. Any element with text
						will have this control enabled.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<i class="fa fa-magic" aria-hidden="true"></i>
					<li class="control-name">Images Filters</li>
					<li class="description">Change the appearence of a photo. We'll perserve your
						original photo and create a new one with your modifications.
						This option is available after clicking on an image.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<i class="fa fa-minus" aria-hidden="true"></i>
					<li class="control-name">Horizontal Line</li>
					<li class="description">Change the design of a horizontal line. Available after clicking on a
					horizontal line element.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<i class="fa fa-globe" aria-hidden="true"></i>
					<li class="control-name">Global Options</li>
					<li class="description">Update options specific to either this page or all of your pages. This option is always available.</li>
				</ul>
			</li>
			<li>
				<ul class="help-text">
					<i class="section-divider-icon" aria-hidden="true"></i>
					<li class="control-name">Shape Dividers</li>
					<li class="description">Adds a design element to the top or bottom of a section.
						Add the shape divider to a section with a background image to achieve the desired effect.</li>
				</ul>
			</li>
		</ul>
	</div>
</script>