linaro-jekyll-theme 0.2.0 → 0.2.0.1

data/_includes/_theme-includes/_page-structure/breadcrumb.html

@@ -1,6 +1,14 @@
-    <div class="container-fluid breadcrumb-container"><!--- Main fluid container start ---->
+<div class="container-fluid breadcrumb-container"
+    {% if site.data.company.breadcrumb-image %}
+    style="background-image: url('{{site.data.company.breadcrumb-image}}');
+    background-size: cover;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    -o-background-size: cover;
+    "
+    {% endif %}><!--- Main fluid container start ---->
       <div class="row"> <!--- Row Start ---->
-        <div class="container"><!--- Container Start ---->
+        <div class="container breadcrumb-inner-container"><!--- Container Start ---->
           <h1>
               {% if page.page_title %}
                 {{ page.page_title }}
@@ -11,7 +19,7 @@
           <ol itemscope itemtype="http://schema.org/BreadcrumbList" class="breadcrumb">
               <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
                   <a itemprop="item" href="/">
-                      <span itemprop="name">96Boards</span>
+                      <span itemprop="name">{{site.title}}</span>
                   </a>
                   <meta itemprop="position" content="1" />
               </li>
@@ -19,32 +27,74 @@
               {% assign iterator = 2 %}
               {% assign breadcrumb-path = "/" %}
               {% for section in page-url %}
-                  {% if section == "" or section == "index.html"%}
-                      {% continue %}
-                  {% elsif section == "product" %}
-                      {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
-                          <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
-                              <a itemprop="item" href="/products/">
-                                  <span itemprop="name">{{section | truncate: 20 | capitalize }}s</span>
-                              </a>
-                              <meta itemprop="position" content="{{iterator}}" />
-                          </li>
-                  {% else %}
-                  {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
-                      <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
-                          <a itemprop="item" href="{{breadcrumb-path}}">
-                              <span itemprop="name">{{section | truncate: 20 | capitalize }}</span>
-                          </a>
-                          <meta itemprop="position" content="{{iterator}}" />
-                      </li>
-                  {% endif %}
+                  {% if forloop.last == false %}
+                          {% if section == "" or section == "index.html" %}
+                              {% continue %}
+                          {% elsif section == "product" %}
+                              {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
+                                  <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+                                      <a itemprop="item" href="/products/">
+                                          <span itemprop="name">{{section | truncate: 20 | capitalize }}s</span>
+                                      </a>
+                                      <meta itemprop="position" content="{{iterator}}" />
+                                  </li>
+                          {% elsif section contains ".md.html" %}
+                              {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}{% endcapture%}
+                                  <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+                                      <a itemprop="item" href="{{breadcrumb-path}}">
+                                          <span itemprop="name">{{section | replace: ".html", "" | truncate: 20 | capitalize }}</span>
+                                      </a>
+                                      <meta itemprop="position" content="{{iterator}}" />
+                                  </li>
+                          {% elsif section == "ConsumerEdition" %}
+                              {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
+                                  <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+                                      <a itemprop="item" href="{{breadcrumb-path}}">
+                                          <span itemprop="name">Consumer Edition</span>
+                                      </a>
+                                      <meta itemprop="position" content="{{iterator}}" />
+                                  </li>
+                          {% elsif section == "EnterpriseEdition" %}
+                              {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
+                                  <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+                                      <a itemprop="item" href="{{breadcrumb-path}}">
+                                          <span itemprop="name">Enterprise Edition</span>
+                                      </a>
+                                      <meta itemprop="position" content="{{iterator}}" />
+                                  </li>
+                          {% elsif section == "IoTEdition" %}
+                              {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
+                                  <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+                                      <a itemprop="item" href="{{breadcrumb-path}}">
+                                          <span itemprop="name">IoT Edition</span>
+                                      </a>
+                                      <meta itemprop="position" content="{{iterator}}" />
+                                  </li>
+                          {% elsif section == "MezzanineProducts" %}
+                              {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
+                                  <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+                                      <a itemprop="item" href="{{breadcrumb-path}}">
+                                          <span itemprop="name">Mezzanine Products</span>
+                                      </a>
+                                      <meta itemprop="position" content="{{iterator}}" />
+                                  </li>
+                          {% else %}
+                          {% capture breadcrumb-path %}{{breadcrumb-path}}{{section}}/{% endcapture%}
+                              <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
+                                  <a itemprop="item" href="{{breadcrumb-path}}">
+                                      <span itemprop="name">{{section | truncate: 20 | capitalize }}</span>
+                                  </a>
+                                  <meta itemprop="position" content="{{iterator}}" />
+                              </li>
+                          {% endif %}
+                    {% else %}
+                    <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem" class="active">
+                        <span itemprop="name">{% if page.title %}{{page.title}}{% else %}{{ page.title }}{% endif %}</span>
+                        <meta itemprop="position" content="{{iterator}}" />
+                    </li>
+                    {% endif %}
                   {% assign iterator = iterator + 1 %}
               {% endfor %}
-              {% assign iterator = iterator + 1%}
-              <li itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem" class="active">
-                  <span itemprop="name">{% if page.title %}{{page.title}}{% else %}{{ page.title }}{% endif %}</span>
-                  <meta itemprop="position" content="{{iterator}}" />
-              </li>
           </ol>
       </div>
     </div>

data/_includes/_theme-includes/_page-structure/home-hero-shape.html

@@ -0,0 +1,34 @@
+<div id="homepage-jumbotron"
+{% if site.data.company.homepage_image %}
+    style="background: #000 url({{site.data.company.homepage_image}}) no-repeat center center fixed;
+    background-size: cover;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    -o-background-size: cover;
+    background-position-y: 80px;"
+    class="jumbotron text-center homepage-jumbotron homepage-image-jumbotron"
+{% else %}
+    class="jumbotron text-center homepage-jumbotron"
+{% endif %} >
+  <div class="container">
+        {% if site.data.company.home.hero-image %}
+          <div class="col-md-12">
+            <img src="{{site.data.company.home.hero-image}}" id="home-hero-image" class="img-responsive center-block animated fadeIn" alt="{{site.title}} Home Page Image">
+          </div>
+        {% endif %}
+        {% if site.data.company.home.title %}
+            <h2 id="home-page-title" class="fade-in-one text-center" id="homepage-heading">{{site.data.company.home.title}}</h2>
+        {% endif %}
+        {% if site.data.company.home.sub-title %}
+            <h4 id="home-page-text" class="text-center">{{site.data.company.home.sub-title}}</h4>
+        {% endif %}
+        {% if site.data.company.home.buttons %}
+            <p id="buttons">
+                {% for button in site.data.company.buttons %}
+                    <a class="{{button.class}}" href="{{button.url}}" role="button">{{button.text}}</a>
+                {% endif %}
+            </p>
+        {% endif %}
+  </div>
+  {% include _theme-includes/_page-structure/shape-divider.html %}
+</div>

data/_includes/_theme-includes/_page-structure/home-hero.html

@@ -0,0 +1,23 @@
+<div id="homepage-jumbotron"
+{% if site.data.company.homepage_image %}
+    style="background: #000 url({{site.data.company.homepage_image}}) no-repeat center center fixed;
+    background-size: cover;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    -o-background-size: cover;
+    background-position-y: 80px;"
+    class="jumbotron text-center homepage-jumbotron homepage-image-jumbotron"
+{% else %}
+    class="jumbotron text-center homepage-jumbotron"
+{% endif %} >
+  <div class="container">
+    <h1 id="home-page-title" class="fade-in-one" id="homepage-heading">Welcome to the<br />
+      <b>Linaro Jekyll Theme</b></h1>
+    <p id="home-page-text" class="sub-tag center-block fade-in-two">
+      <span>A theme for Linaro Static Jekyll sites.</span><br />
+      <span>Customize this in the _data folder.</span>
+    </p>
+    <p id="buttons"><a class="btn btn-primary btn-lg fade-in-three bottom-border-five" href="https://github.com/kylekirkby/LinaroJekyllTheme" role="button">Customize this in the _data folder</a>&#32;&#32;
+      <a class="btn btn-primary btn-lg fade-in-three bottom-border-five" href="/setup/" role="button">Setup</a></p>
+  </div>
+</div>

data/_includes/_theme-includes/_page-structure/shape-divider.html

@@ -0,0 +1,12 @@
+<div class="homepage-shape">
+  <svg width="100%" height="130px">
+    <defs>
+      <pattern id="shapeDividerPattern-4" preserveaspectratio="none" style="background-repeat: none;" patternunits="userSpaceOnUse" x="0" y="0" width="100%" height="1300px" viewbox="0 0 100 1300">
+        <polygon fill="#ffffff" points="0,0 0,130 50,130 "></polygon>
+        <polygon fill="#ffffff" points="100,0 100,130 50,130 "></polygon>
+      </pattern>
+    </defs>
+    <!-- Background -->
+    <rect x="0" y="0" width="100%" height="130px" fill="url(#shapeDividerPattern-4)"></rect>
+  </svg>
+</div>

data/_includes/_theme-includes/_script-includes/css.html

@@ -1,3 +1,40 @@
----
----
-<link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
+{% if site.using_assets == true %}
+    {% if page.css-pack %}
+        {% if page.css-pack == "openhours" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-openhours.css" | relative_url }}">
+        {% elsif page.css-pack == "home" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-home.css" | relative_url }}">
+        {% elsif page.css-pack == "blog" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-blog.css" | relative_url }}">
+        {% elsif page.css-pack == "products" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-products.css" | relative_url }}">
+        {% elsif page.css-pack == "projects" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-projects.css" | relative_url }}">
+        {% elsif page.css-pack == "lightbox" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-lightbox.css" | relative_url }}">
+        {% else %}
+            <link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
+        {% endif %}
+    {% else %}
+        {% if layout.css-pack == "products" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-products.css" | relative_url }}">
+        {% elsif layout.css-pack == "projects" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-projects.css" | relative_url }}">
+        {% elsif layout.css-pack == "blog" %}
+            <link rel="stylesheet" href="{{ "/assets/css/main-blog.css" | relative_url }}">
+        {% else %}
+            <link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
+        {% endif %}
+    {% endif %}
+{% else %}
+    <link rel="stylesheet" href="{{ "/assets/css/main.css" | relative_url }}">
+    {% if page.specific_css %}
+        {% for stylesheet in page.specific_css %}
+            <link rel="stylesheet" href="{{stylesheet}}">
+        {% endfor %}
+    {% elsif layout.specific_css %}
+        {% for stylesheet in layout.specific_css %}
+            <link rel="stylesheet" href="{{stylesheet}}">
+        {% endfor %}
+    {% endif %}
+{% endif %}

data/_includes/_theme-includes/_script-includes/google-analytics/script.html

@@ -0,0 +1,10 @@
+<script>
+  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
+
+  ga('create', '{{site.data.company.google.analytics}}', 'auto');
+  ga('send', 'pageview');
+
+</script>

data/_includes/_theme-includes/_script-includes/gtm/gtm-noscript.html

@@ -1,4 +1,5 @@
+
 <!-- Google Tag Manager (noscript) -->
-<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-P53JPC"
+<noscript><iframe src="https://www.googletagmanager.com/ns.html?id={{site.data.company.google_tag_manager}}"
 height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
 <!-- End Google Tag Manager (noscript) -->

data/_includes/_theme-includes/_script-includes/gtm/gtm-script.html

@@ -1,7 +1,9 @@
-<!-- Google Tag Manager -->
-<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
-new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
-j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
-'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
-})(window,document,'script','dataLayer','GTM-P53JPC');</script>
-<!-- End Google Tag Manager -->
+{% if site.data.company.google.tag_manager %}
+    <!-- Google Tag Manager -->
+    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+})(window,document,'script','dataLayer','{{site.data.company.google.tag_manager}}');</script>
+    <!-- End Google Tag Manager -->
+{% endif %}

data/_includes/_theme-includes/_script-includes/javascript.html

@@ -1,2 +1,50 @@
-<script src="/assets/js/app.js"></script>
-<script src="/assets/js/vendor.js"></script>
+{% if site.using_assets == true %}
+    {% if page.js-package %}
+        {% if page.js-package == "extended" %}
+            {% js package-extended %}
+        {% elsif page.js-package == "openhours" %}
+            {% js package-openhours %}
+        {% elsif page.js-package == "home" %}
+            {% js package-home %}
+        {% elsif page.js-package == "search" %}
+            {% js package-search %}
+        {% elsif page.js-package == "contact" %}
+            {% js package-contact %}
+        {% elsif page.js-package == "work" %}
+            {% js package-work %}
+        {% elsif page.js-package == "blog" %}
+            {% js package-blog %}
+        {% else %}
+            {% js vendor %}
+        {% endif %}
+    {% else %}
+        {% if layout.js-package == "extended" %}
+            {% js package-extended %}
+        {% elsif layout.js-package == "sticky" %}
+            {% js package-sticky %}
+        {% elsif layout.js-package == "work" %}
+            {% js package-work %}
+        {% elsif layout.js-package == "developer-services" %}
+            {% js package-developer-services %}
+        {% elsif layout.js-package == "blog" %}
+            {% js package-blog %}
+        {% else %}
+            {% js vendor %}
+        {% endif %}
+    {% endif %}
+{% else %}
+    <script src="/assets/js/vendor/jquery.min.js"></script>
+    <script src="/assets/js/vendor/bootstrap.min.js"></script>
+    <script src="/assets/js/app/main.js"></script>
+    <script src="/assets/js/vendor/cookieconsent.min.js"></script>
+    <script src="/assets/js/vendor/lazysizes.min.js"></script>
+    {% if page.specific_js %}
+        {% for script in page.specific_js %}
+            <script src="{{script}}"></script>
+        {% endfor %}
+    {% elsif layout.specific_js %}
+        {% for script in layout.specific_js %}
+            <script src="{{script}}"></script>
+        {% endfor %}
+    {% endif %}
+{% endif %}

data/_includes/_theme-includes/_third-party/disqus.html

@@ -1,7 +1,7 @@
 <section class="disqus">
     <div id="disqus_thread"></div>
     <script type="text/javascript">
-        var disqus_shortname = '{{ site.disqus_shortname }}';
+        var disqus_shortname = '{{ site.data.company.disqus.shortname }}';
         var disqus_developer = 0; // developer mode is on
         (function() {
             var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;

data/_includes/_theme-includes/_third-party/mailchimp-homepage.html

@@ -1,11 +1,8 @@
 <div class="row sub-footer">
     <div class="container">
-    <div id="mc_embed_signup">
-
        <!-- Begin MailChimp Signup Form -->
-
        <div id="mc_embed_signup">
-         <form action="//96boards.us3.list-manage.com/subscribe/post?u=14baaae786342d0d405ee59c2&amp;id=e3d2abc041" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
+         <form action="//96boards.us3.list-manage.com/subscribe/post?u=14baaae786342d0d405ee59c2&amp;id={{site.data.company.mailchimp.id}}" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
            <div id="mc_embed_signup_scroll">
              <div class="col-md-3 col-xs-12 form-group"> <div class="mc-field-group">
                <input type="email" value="" name="EMAIL" class="required email form-control" id="mce-EMAIL" placeholder="Email Address ">
@@ -33,6 +30,4 @@
          </form>
        </div>
        </div>
-
-   </div>
 </div>

data/_includes/_theme-includes/members.html

@@ -8,7 +8,7 @@
                       {% for member in sorted_manufacturing_partners %}
                                <div class="col-md-3 col-sm-4 col-xs-6">
                                    <a href="{{member.url}}">
-                                       <img data-src="/assets/images/members/{{member.image}}" alt="{{member.name}}"
+                                       <img data-src="/images/members/{{member.image}}" alt="{{member.name}}"
                                         src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                                         class="img-responsive members-img lazyload center-block"/>
                                     </a>
@@ -28,7 +28,7 @@
                   {% for member in sorted_steering_committee %}
                       <div class="col-md-3 col-sm-4 col-xs-6">
                           <a href="{{member.url}}">
-                              <img data-src="/assets/images/members/{{member.image}}" alt="{{member.name}}"
+                              <img data-src="/images/members/{{member.image}}" alt="{{member.name}}"
                                src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                                class="img-responsive members-img lazyload center-block"/>
                            </a>
@@ -49,7 +49,7 @@
               {% for member in sorted_mezzanine_partners %}
                   <div class="col-md-3 col-sm-4 col-xs-6">
                       <a href="{{member.url}}">
-                          <img data-src="/assets/images/members/{{member.image}}" alt="{{member.name}}"
+                          <img data-src="/images/members/{{member.image}}" alt="{{member.name}}"
                            src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                            class="img-responsive members-img lazyload center-block"/>
                        </a>

data/_includes/image.html

@@ -1 +1,6 @@
-[![{{include.alt}}](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==){:class="img-responsive lazyload" data-src="{% asset_path '{{include.name}}' %}"}]({% if include.url %}{{include.url}}{% else %}{% asset_path "{{include.name}}" %}{% endif %}){:{% if include.url %} {% else %}data-lightbox="{{include.name}}" data-title="{{include.alt}}"{% endif %}}
+{% if include.lightbox_disabled %}
+![{{include.alt}}](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==){:class="img-responsive lazyload {% if include.class %}{{include.class}}{% endif %}" data-src="{% asset_path '{{include.name}}' %}"}
+{% else %}
+[![{{include.alt}}](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==){:class="img-responsive lazyload {% if include.class %}{{include.class}}{% endif %}" data-src="{% asset_path '{{include.name}}' %}"}]({% if include.url %}{{include.url}}{% elsif include.lightbox_disabled %}{% else %}{% asset_path "{{include.name}}" %}{% endif %}){% if include.lightbox_disabled %}{% else %}{% if include.url %}{% else %}{: data-lightbox="{{include.name}}" data-title="{{include.alt}}"}{% endif %}{% endif %}
+{% endif %}
+

data/_includes/media.html

@@ -1,3 +1,11 @@
+{% if include.media_url contains "https://youtu.be/" %}
+    {% assign media_url = include.media_url | replace: 'https://youtu.be/','https://youtube.com/embed/'%}
+{% elsif include.media_url contains "https://www.youtube.com/watch?v="%}
+    {% assign media_url = include.media_url | replace: 'https://www.youtube.com/watch?v=','https://youtube.com/embed/'%}
+{% else %}
+    {% assign media_url = include.media_url%}
+{% endif %}
+
 <div class="embed-responsive embed-responsive-16by9">
-  <iframe src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" class="lazyload embed-responsive-item" data-src="{{include.media_url}}"></iframe>
+  <iframe src="" allowFullScreen="allowFullScreen" frameBorder="0" class="lazyload embed-responsive-item" data-src="{{media_url}}"></iframe>
 </div>

data/_includes/youtube.html

@@ -0,0 +1,7 @@
+{% if include.vid_id %}
+    <div class="videoWrapper">
+        <div class="youtube" data-embed="{{include.vid_id}}">
+            <div class="play-button"></div>
+        </div>
+    </div>
+{% endif %}

data/_layouts/accessory-display-page.html

@@ -0,0 +1,88 @@
+---
+layout: fluid
+---
+{% assign accessories =  site.data.product_db.accessories | where: "accessory_permalink", page.permalink %}
+
+<div class="row">
+    <div class="container">
+        {% assign content = content | strip_newlines %}
+
+        {% if content != "" %}
+        <div class="row">
+            <div class="col-md-8">
+                    {{content}}
+            </div>
+            <div class="col-md-4 hidden-sm hidden-xs">
+                <img id="collection-image" class="img-responsive center-block" src="/images/96boards-logo-300x109.png" alt="96Boards logo small.">
+            </div>
+            <hr />
+        </div><!-- end row-->
+
+        {% endif %}
+    <div class="row">
+
+
+        {% for accessory in accessories %}
+
+            <div class="col-md-12">
+                    <div class="row">
+                        <div class="col-md-3">
+                            <img class="img-responsive center-block accessory-image" src="../../product/accessories/{{accessory.accessory_category}}/images/{{ accessory.accessory_images[0]}}" alt="{{accessory.accessory_title}}">
+                        </div>
+                        <div class="col-md-6">
+                            <h3>{{accessory.accessory_title}}</h3>
+                            <p>
+                                {% if accessory.accessory_description%}
+                                    {{accessory.accessory_description}}
+                                {% elsif accessory.accessory_description_list %}
+                                    <ul class="list-group">
+                                        {% for feature in accessory.accessory_description_list %}
+                                            <li class="list-group-item">
+                                                {{ feature }}
+                                            </li>
+                                        {% endfor %}
+                                    </ul>
+                                {% endif %}
+                            </p>
+                        </div>
+                        <div class="col-md-3">
+                            <div class="dropdown dropdown-container btn-group dropup btn-block text-center product-buy-dropdown">
+                                <div class="text-center">
+                                    <a href="{{accessory.accessory_order_link[0]}}" class="btn btn-primary btn-read-more">Order Here</a>
+                                </div>
+                            </div>
+                            {% if accessory.accessory_more_info %}
+                                <div class="dropdown dropdown-container btn-group dropup btn-block text-center product-buy-dropdown">
+                                    <div class="text-center">
+                                            <a href="{{accessory.accessory_more_info}}" class="btn btn-primary btn-read-more">More Info</a>
+                                    </div>
+                                </div>
+                            {% endif %}
+
+                            {% if accessory.accessory_search_term %}
+                                <div class="col-xs-12">
+                                    Search term:
+                                </div>
+                                <div class="col-xs-12">
+                                    <div class="center-block">
+                                        <pre>{{accessory.accessory_search_term}}</pre>
+                                    </div>
+                                </div>
+                            {% endif %}
+
+                        </div>
+
+                    </div>
+                    <hr />
+            </div>
+
+
+        {% endfor %}
+
+
+
+
+    </div>
+
+</div><!-- end container-->
+</div><!--end row-->