_layouts/base.html

<!DOCTYPE html>
<html>

{% include layouts/head.html %}

<body data-spy="scroll" data-target=".watch" style="position:relative;">
{% include layouts/google-tag-body.html %}

<!--[if lt IE 10]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade
	your browser</a> to improve your experience.</p>
<![endif]-->

{% include layouts/_header-main.html %}

<main class="--page page--single --index">

	<div class="--wrap">
		<!-- aside - Main Sidebar-->
		<aside class="--sidebar-container">
			<div class="--sidebar-fixed reference" data-spy="affix" id="where">
				{% if page.permalink contains "javascript/" or page.permalink contains "python/" or page.permalink contains "r/" or page.permalink contains "ggplot2/"  %}
                        <button id="modal-button" type="button" data-toggle="modal" data-target="#myModal">
                            <input id="modal-input" style="border-radius: 5px; width: 100%;"  type="text" placeholder="   Search..." readonly/>
                          </button>
                    {% endif %}
				<header class="--sidebar-header">On This Page</header>
				<nav class="--sidebar-body watch"   id="where">
		  <ul class="--sidebar-list"></ul>

					
				</nav>
			</div>
		</aside>
		<!-- Main-->
		<section class="--page-body --tutorial-index --base">
			<header class="--welcome">
				<div class="--welcome-body">
					<!--div.--wrap-inner-->
					<div class="--title">
						<div class="--body">
							<div class="nav-breadcrumb-container">
								{% include layouts/breadcrumb.html %}
							</div>

							{% unless page.ignore_header %}
							<h1>
								{{page.name}}
								{% unless page.no_in_language %}
								in {% if page.language == "plotly_js" %}JavaScript{% elsif page.language == "ggplot2" %}ggplot2{% elsif page.language == "matlab" %}MATLAB<sup>&reg;</sup>{% else %}{{page.language | capitalize}}{% endif %}
								{% endunless %}
							</h1>
							<p>{{page.description}} </p>
							<br>

							{% endunless %}
							{% include layouts/new-to-plotly.html %}

						</div>
					</div>
				</div>
			</header>

			<!-- Start Plotly Basics Section -->
			<section class="tutorial-content">

				{% include both/py4_note.html %}


				{{ content }}
				{% if page.language == "matlab" %}
				<p><em>MATLAB is a registered trademark of The MathWorks, Inc.</em></p>
				{% endif %}
			</section>

			{% if page.permalink contains "javascript/" or page.permalink contains "python/" %}

			<a href="https://dash.plotly.com"><img width="100%" style="margin-top: 20px;" src="/all_static/images/dash.png"/></a>
			
			{%elsif page.permalink contains "r/" or page.permalink contains "ggplot2/"  %}

			<a href="https://dashr.plotly.com"><img width="100%" style="margin-top: 20px;" src="/all_static/images/dash.png"/></a>

			{% endif %}
			<!--End Plotly Basics Section-->
		</section>
	</div>
</main>


{% include layouts/insertSidebarElement.html %}

{% include layouts/_footer-main.html %}

{% if page.language == "r" or page.language == "python" %}
<script>
	window.intercomSettings = { app_id: "anwi88es" };
</script>
<script>(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.push(args)};w.Intercom=i;function l(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/anwi88es';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);}if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})()</script>
{% endif %}

</body>

</html>