Html Codes

Hey good day everyone.


My website is http://rachelfrancojewels.com/


1. How can i add another "3 boxes design" on top and the footer

2. How can i add another slide show with the same width but significantly narrower length

3. how do i have number 1 & 2 will be located right above the footer?

Thank you a bunch!
rkrox902Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Just for ease of use, I added the html to jsbin http://jsbin.com/ERiTEGE/1/edit?html,css,js,output

1. How can i add another "3 boxes design" on top and the footer
Do you want this above the slider?

2. How can i add another slide show with the same width but significantly narrower length Do you mean side by side with the current slider or just below it but not has tall with the same width?


3. how do i have number 1 & 2 will be located right above the footer?
0
rkrox902Author Commented:
please try to get as identical as possible from the file attached
ex.jpg
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Working sample http://jsbin.com/ERiTEGE/3/ and html code
<!DOCTYPE html>
<html class="no-js">
<!-- Providence 3.3.0 Shopify theme by Empyre (http://empy.re) - Proudly powered by Shopify (http://shopify.com) -->
<head>

<!-- Meta -->
<meta charset="utf-8">
<title>RachelFrancojewelry | Welcome</title>
<meta name="description" content="">
<meta name="author" content="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/humans.txt?120">
<meta name="viewport" content="width=device-width">

<!-- Social sharing data -->
<meta property="og:site_name" content="RachelFrancojewelry">
<meta property="og:image" content="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/logo.png?120">

<!-- Bookmark icons -->
<link rel="shortcut icon" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/favicon.png?120">
<link rel="apple-touch-icon" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/apple-touch-icon.png?120">
<link rel="canonical" href="http://rachelfrancojewelry.myshopify.com/">
<!-- Scripts -->
<!-- Vendor - CDN -->
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/4.0.9/js/foundation.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/4.0.9/js/vendor/custom.modernizr.js" type="text/javascript"></script>
<script src="http://cdn.shopify.com/s/shopify/shopify_common.js?dbfb7cec78e7c3b13d8446c5fd4f4fa3ce9c123a" type="text/javascript"></script>

<!-- Styles -->
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" type="text/css"  media="all"  />
<link href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.css" rel="stylesheet" type="text/css"  media="all"  />
<link href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base.css?120" rel="stylesheet" type="text/css"  media="all"  />

<!-- Media queries -->
<link rel="stylesheet" media="screen and (max-width: 1279px)" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base-responsive-1279px-max.css?120">
<link rel="stylesheet" media="screen and (max-width: 975px)" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base-responsive-975px-max.css?120">
<link rel="stylesheet" media="screen and (max-width: 767px)" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base-responsive-767px-max.css?120">
<link href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-settings.scss.css?120" rel="stylesheet" type="text/css"  media="all"  />
<link href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-style-custom.css?120" rel="stylesheet" type="text/css"  media="all"  />
<link href="http://fonts.googleapis.com/css?family=Pacifico:400,500,700,400italic,700italic" rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Droid+Serif:400,500,700,400italic,700italic" rel="stylesheet" type="text/css">
<script type="text/javascript">      var Shopify = Shopify || {};
      Shopify.shop = "rachelfrancojewelry.myshopify.com";
      Shopify.theme = {"name":"Providence","id":4861495};
</script>
<script type="text/javascript">var __st={"a":2681833,"offset":-14400,"u":"dcd60ecc77ed"};</script>
<script type="text/javascript">    //<![CDATA[
    (function() {
      function asyncLoad() {
        var urls = ["//s.shopify.com/javascripts/shopify_stats.js?v=4"];
        for (var i = 0; i < urls.length; i++) {
          var s = document.createElement('script');
          s.type = 'text/javascript';
          s.async = true;
          s.src = urls[i];
          var x = document.getElementsByTagName('script')[0];
          x.parentNode.insertBefore(s, x);
        }
      }
      window.attachEvent ? window.attachEvent('onload', asyncLoad) : window.addEventListener('load', asyncLoad, false);
    })();
    //]]>
</script>
<link rel="stylesheet" href="/global/theme-controls.css" type="text/css" />
</head>

<body class="index" id="welcome">
<div id="app-wrap">
  <div id="header-actions">
    <div class="row padded-h">
      <div class="twelve columns">
        <div class="table">
          <div class="cell text-right"> <span class="cart"> <span class="items"> <a href="/cart"> <i class="icon-shopping-cart"></i> 0 items <span class="order-total"> - $0.00 </span> </a> </span> </span> <span class="divider">/</span> <span class="session"> <strong><a href="/account/login" id="customer_login_link">Sign-in</a></strong> <span>or</span> </span> <strong><a class="checkout" href="/cart">Checkout</a></strong> </div>
        </div>
      </div>
    </div>
  </div>
  <div id="mobile-search-wrap">
    <div id="mobile-search">
      <div class="row padded">
        <div class="small-12 columns">
          <form class="form-search" name="search" action="/search">
            <input type="text" name="q" class="search-query search replace" placeholder="To search type and hit enter">
          </form>
        </div>
      </div>
    </div>
  </div>
  <div id="core-wrap">
    <header id="site-header">
      <div class="row padded-h">
        <div class="small-12 columns">
          <div class="table">
            <div class="cell text-left">
              <div id="brand">
                <h1 id="brand-primary-text"><a href="http://rachelfrancojewelry.myshopify.com" title="">EE Jewlery</a></h1>
              </div>
            </div>
            <div id="nav-primary-wrap" class="cell">
              <div id="top-bar-wrap">
                <nav id="nav-primary" class="top-bar">
                  <h2 class="hidden">Menu: Primary</h2>
                  <ul class="title-area">
                    <li class="toggle-topbar menu-icon"><a href="#"></a></li>
                  </ul>
                  <div class="top-bar-section">
                    <ul class="right">
                      <li class="active"> <a href="/">Home</a> </li>
                      <li class="divider">/</li>
                      <li class=""> <a href="/collections/all">Catalog</a> </li>
                    </ul>
                  </div>
                </nav>
              </div>
              <div id="mobile-nav-toggles">
                <div class="table">
                  <div class="cell"> <a href="#" id="toggle-mobile-nav"><i class="icon-reorder"></i></a> </div>
                  <div class="cell"> <a href="#" id="toggle-mobile-search"><i class="icon-search"></i></a> </div>
                </div>
              </div>
            </div>
            <div id="header-search-wrap" class="cell text-right">
              <div id="header-search">
                <form class="form-search form-inline" name="search" action="/search">
                  <input type="text" name="q" class="search-query search replace" placeholder="search">
                </form>
              </div>
            </div>
          </div>
          <div id="mobile-nav-primary-wrap">
            <nav id="mobile-nav-primary">
              <h2 class="hidden">Menu: Primary Mobile</h2>
              <ul>
                <li class=""><a href="/cart">Checkout - 0 items for $0.00</a></li>
                <li class="active"> <a href="/">Home</a> </li>
                <li class=""> <a href="/collections/all">Catalog</a> </li>
                <li class=""><a href="/account">My Account</a></li>
              </ul>
            </nav>
          </div>
        </div>
      </div>
    </header>
    
    <!-- Content -->
    <section id="site-body">
      <div class="row padded-h">
        <div class="small-12 columns">
          <div class="row">
            <div class="large-12 columns">
              <div class="slides-wrap">
                <ul id="index-slides" class="bx-slider slides" data-autoplay="true" data-transition="vertical" data-duration="5000.0" data-transition-duration="800.0">
                  <li class="slide"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/slide_01.jpg?120" alt="" /></li>
                  <li class="slide"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/slide_02.jpg?120" alt="" /></li>
                </ul>
              </div>
            </div>
          </div>
          <h1 class="hide">Home</h1>
          <div id="content-wrap" class="default">
            <div class="row">
              <div class="small-12 columns primary"> 
                
                <!-- This is a comment -->
                <div class="row">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
              
                <section>
                  <h2 class="hide">Featured Products</h2>
                  <div class="products cards">
                    <ul class="block-grid small-block-grid-2 large-block-grid-4">
                      <li>
                        <div class="product card">
                          <article class="hproduct product-158167245 test-bracelets-test" data-url="/products/test-bracelets-test" >
                            <div class="image-wrap">
                              <div class="image"> <a href="/products/test-bracelets-test" title="test  bracelets test"> <img src="http://cdn.shopify.com/s/files/1/0268/1833/products/Sterling-Silver-Bracelets-21345_large.jpg?120" alt="test  bracelets test" /> </a> </div>
                            </div>
                            <div class="details">
                              <header>
                                <h1 class="header-color"> <a href="/products/test-bracelets-test" title="test  bracelets test"> <span class="name">test  bracelets test</span> </a> </h1>
                              </header>
                              <span class="brand">vendor name e.g appple</span> <span class="price"> $34.99 </span> </div>
                          </article>
                        </div>
                      </li>
                    </ul>
                  </div>
                </section>
                <!-- three box -->
                    <div class="row">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
                         <!-- three box end -->
                
                
              </div>
              <!-- content_class --> 
              
            </div>
            <!-- .row --> 
          </div>
          <!-- #content-wrap --> 
          
        </div>
      </div>
      <div id="footer-widgets-top"></div>
    </section>
    
    <!-- Footer widgets -->
    <aside id="footer-widgets">
      <div class="row padded">
        <div class="large-12 columns">
          <h1 class="section-title">Footer</h1>
          <div class="widgets">
            <div class="row">
              <div class="large-3 columns">
                <section class="widget widget-links 01">
                  <div class="widget-inner">
                    <header class="widget-header">
                      <h2>Help Desk</h2>
                    </header>
                    <ul class="link-list">
                      <li><a href="/pages/return-policy" title="">Return Policy</a></li>
                      <li><a href="/pages/shipping-info" title="">Shipping Info.</a></li>
                      <li><a href="/pages/why-buy-from-us" title="">Why Buy From Us</a></li>
                      <li><a href="/pages/contact-us" title="">Contact Us</a></li>
                      <li><a href="/pages/about-us" title="">About Us</a></li>
                      <li><a href="/pages/terms-of-service" title="">Terms Of Service</a></li>
                      <li><a href="/pages/privacy-policy" title="">Privacy Policy</a></li>
                    </ul>
                  </div>
                </section>
              </div>
              <div class="large-4 columns">
                <section class="widget widget-links 02">
                  <div class="widget-inner">
                    <header class="widget-header">
                      <h2>Categories</h2>
                    </header>
                    <ul class="link-list">
                      <li><a href="/" title="">Eaarings</a></li>
                      <li><a href="/" title="">Bracelets</a></li>
                      <li><a href="/" title="">Necklaces</a></li>
                      <li><a href="/search" title="">Search</a></li>
                    </ul>
                  </div>
                </section>
              </div>
              <div class="large-3 columns">
                <section class="widget widget-newsletter ">
                  <div class="widget-inner">
                    <header class="widget-header">
                      <h2>Newsletter</h2>
                    </header>
                    <p class="intro">Sign up to have the latest news and member-only deals delivered straight to your inbox.</p>
                    <form class="form validate" method="post" action="" name="mc-embedded-subscribe-form" target="_blank">
                      <div class="row">
                        <div class="twelve columns">
                          <input type="email" value="" name="EMAIL" class="email span12" placeholder="your@email.com">
                        </div>
                      </div>
                      <div class="row">
                        <div class="twelve columns">
                          <button type="submit" class="button">Sign up</button>
                        </div>
                      </div>
                    </form>
                  </div>
                </section>
              </div>
              <div class="large-2 columns">
                <section class="widget widget-social-links ">
                  <div class="widget-inner">
                    <ul class="social-links inline-list">
                      <li> <a href="twitter.com/KimKardashia" title="Twitter" data-target="new-window"> <i class="icon-twitter"></i> </a> </li>
                    </ul>
                  </div>
                </section>
              </div>
            </div>
          </div>
          <!-- widgets --> 
          
        </div>
      </div>
    </aside>
  </div>
  <!-- #core-wrap --> 
  
  <!-- Footer -->
  <footer id="site-footer">
    <div class="row padded-h">
      <div class="small-12 columns">
        <div class="mobile-nav-select-wrap">
          <nav class="mobile-nav-select">
            <h2 class="hidden">Menu: Secondary Mobile</h2>
            <form>
              <select>
                <option>Jump to...</option>
                <option value="/cart">Checkout - 0 items for $0.00</option>
                <option value="/pages/return-policy" >Return Policy</option>
                <option value="/pages/shipping-info" >Shipping Info.</option>
                <option value="/pages/why-buy-from-us" >Why Buy From Us</option>
                <option value="/pages/contact-us" >Contact Us</option>
                <option value="/pages/about-us" >About Us</option>
                <option value="/pages/terms-of-service" >Terms Of Service</option>
                <option value="/pages/privacy-policy" >Privacy Policy</option>
              </select>
            </form>
          </nav>
        </div>
        <div id="fine-print"> 
          
          <!-- Copyright -->
          <div id="copyright">
            <p class="date">&copy; 2013</p>
            <p><strong><a href="http://rachelfrancojewelry.myshopify.com" title="">Rachel Franco Jewelry</a></strong></p>
            <p>All rights reserved.</p>
            <p id="shop-currency-notice">All prices in USD.</p>
          </div>
          
          <!-- Attributions -->
          <div id="attributions"> </div>
        </div>
        <nav id="nav-footer">
          <h2 class="hidden">Menu: Footer</h2>
          <ul class="inline-list">
            <li class="nav-item first"> <a href="/pages/return-policy">Return Policy</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/shipping-info">Shipping Info.</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/why-buy-from-us">Why Buy From Us</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/contact-us">Contact Us</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/about-us">About Us</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/terms-of-service">Terms Of Service</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/privacy-policy">Privacy Policy</a> </li>
          </ul>
        </nav>
      </div>
    </div>
    <div class="row padded-h">
      <div class="small-12 columns">
        <div id="payment-methods">
          <p id="accepted-text">We Accept</p>
          <a href="/cart" class="payment-method" title="Paypal"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-paypal.png?120" alt="paypal" /></a> <a href="/cart" class="payment-method" title="Google checkout"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-google-checkout.png?120" alt="google-checkout" /></a> <a href="/cart" class="payment-method" title="Visa"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-visa.png?120" alt="visa" /></a> <a href="/cart" class="payment-method" title="Mastercard"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-mastercard.png?120" alt="mastercard" /></a> <a href="/cart" class="payment-method" title="American express"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-american-express.png?120" alt="american-express" /></a> </div>
      </div>
    </div>
  </footer>
</div>

<!-- Footer scripts -->
<div id="footer-scripts"> 
  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js" type="text/javascript"></script> 
  <script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.pack.js" type="text/javascript"></script> 
  <script src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/jquery.bxslider.min.js?120" type="text/javascript"></script> 
  <script src="http://cdn.shopify.com/s/shopify/option_selection.js?dbfb7cec78e7c3b13d8446c5fd4f4fa3ce9c123a" type="text/javascript"></script> 
  <script src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme.js?120" type="text/javascript"></script> 
  <script src="https://apis.google.com/js/plusone.js" type="text/javascript"></script> 
</div>
</body>
</html>

Open in new window

0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

rkrox902Author Commented:
Great! are you working on the bottom slideshow?
0
rkrox902Author Commented:
i have posted some of the code and the new 3 boxes appear with no white background
Please visit https://rachelfrancojewelry.myshopify.com too see what i mean.

Here is how my template.liquid look like, please add the code needed to it can show with the new 3 boxes.


---
<!DOCTYPE html>
  {% include 'html-tag' %}
  <head>
    {% include 'variables' %}
    <!-- Meta -->
    {% include 'meta' %}
    <!-- Scripts -->
    {% include 'head-scripts' %}
    <!-- Styles -->
    {% include 'head-styles' %}
    {{ content_for_header }}
  </head>

  {% include 'body-class' %}

  <body class="{{ body_class }}" id="{{ page_title | handle }}">
    <div id="app-wrap">
      {% include 'header-actions' %}
      {% include 'header' %}

      <!-- Content -->
      <section id="site-body">
        <div class="row padded-h">
          <div class="small-12 columns">
        {% if template == 'list-collections' %}
          {% include 'collection-listing' %}
        {% else %}
          {{ content_for_layout }}
        {% endif %}
          </div>
                      </li>
                    </ul>
                  </div>
                </section>
                <!-- three box -->
                    <div class="row">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
                         <!-- three box end -->
                
                
              </div>
              <!-- content_class --> 
              
            </div>
            <!-- .row --> 
          </div>
          <!-- #content-wrap --> 
          
        </div>
</div>
        <div id="footer-widgets-top"></div>
      </section>

      {% include 'footer' %}
    </div>

    {% include 'footer-scripts' %}
  </body>
</html>

Open in new window


---

Thank you a bunch!
0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
It looks like you have some server side code above.  I am just looking at your rendered html.  I have updated the jsbin http://jsbin.com/ERiTEGE/4/ and you can see the html http://jsbin.com/ERiTEGE/4/edit?html,output

I have commented the areas where I added code.  Basically I just added
   <!-- three box -->
                    <div class="row">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
                         <!-- three box end -->
                <!-- slider start -->
                 <div class="slides-wrap">
                <ul id="index-slides" class="bx-slider slides" data-autoplay="true" data-transition="vertical" data-duration="5000.0" data-transition-duration="800.0">
                  <li class="slide"><img src="http://placehold.it/1150X150/FF9966" /></li>
                  <li class="slide"><img src="http://placehold.it/1150X150" /></li>
                </ul>
              </div>
                <!-- slider end -->

Open in new window


The full html

<!DOCTYPE html>
<html class="no-js">
<!-- Providence 3.3.0 Shopify theme by Empyre (http://empy.re) - Proudly powered by Shopify (http://shopify.com) -->
<head>
  
<!-- Meta -->
<meta charset="utf-8">
<title>RachelFrancojewelry | Welcome</title>
<meta name="description" content="">
<meta name="author" content="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/humans.txt?120">
<meta name="viewport" content="width=device-width">

<!-- Social sharing data -->
<meta property="og:site_name" content="RachelFrancojewelry">
<meta property="og:image" content="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/logo.png?120">

<!-- Bookmark icons -->
<link rel="shortcut icon" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/favicon.png?120">
<link rel="apple-touch-icon" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/apple-touch-icon.png?120">
<link rel="canonical" href="http://rachelfrancojewelry.myshopify.com/">
<!-- Scripts -->
<!-- Vendor - CDN -->
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/4.0.9/js/foundation.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/4.0.9/js/vendor/custom.modernizr.js" type="text/javascript"></script>
<script src="http://cdn.shopify.com/s/shopify/shopify_common.js?dbfb7cec78e7c3b13d8446c5fd4f4fa3ce9c123a" type="text/javascript"></script>

<!-- Styles -->
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" type="text/css"  media="all"  />
<link href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.css" rel="stylesheet" type="text/css"  media="all"  />
<link href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base.css?120" rel="stylesheet" type="text/css"  media="all"  />

<!-- Media queries -->
<link rel="stylesheet" media="screen and (max-width: 1279px)" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base-responsive-1279px-max.css?120">
<link rel="stylesheet" media="screen and (max-width: 975px)" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base-responsive-975px-max.css?120">
<link rel="stylesheet" media="screen and (max-width: 767px)" href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-base-responsive-767px-max.css?120">
<link href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-settings.scss.css?120" rel="stylesheet" type="text/css"  media="all"  />
<link href="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme-style-custom.css?120" rel="stylesheet" type="text/css"  media="all"  />
<link href="http://fonts.googleapis.com/css?family=Pacifico:400,500,700,400italic,700italic" rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Droid+Serif:400,500,700,400italic,700italic" rel="stylesheet" type="text/css">
<script type="text/javascript">      var Shopify = Shopify || {};
      Shopify.shop = "rachelfrancojewelry.myshopify.com";
      Shopify.theme = {"name":"Providence","id":4861495};
</script>
<script type="text/javascript">var __st={"a":2681833,"offset":-14400,"u":"dcd60ecc77ed"};</script>
<script type="text/javascript">    //<![CDATA[
    (function() {
      function asyncLoad() {
        var urls = ["//s.shopify.com/javascripts/shopify_stats.js?v=4"];
        for (var i = 0; i < urls.length; i++) {
          var s = document.createElement('script');
          s.type = 'text/javascript';
          s.async = true;
          s.src = urls[i];
          var x = document.getElementsByTagName('script')[0];
          x.parentNode.insertBefore(s, x);
        }
      }
      window.attachEvent ? window.attachEvent('onload', asyncLoad) : window.addEventListener('load', asyncLoad, false);
    })();
    //]]>
</script>
<link rel="stylesheet" href="/global/theme-controls.css" type="text/css" />
</head>

<body class="index" id="welcome">
<div id="app-wrap">
  <div id="header-actions">
    <div class="row padded-h">
      <div class="twelve columns">
        <div class="table">
          <div class="cell text-right"> <span class="cart"> <span class="items"> <a href="/cart"> <i class="icon-shopping-cart"></i> 0 items <span class="order-total"> - $0.00 </span> </a> </span> </span> <span class="divider">/</span> <span class="session"> <strong><a href="/account/login" id="customer_login_link">Sign-in</a></strong> <span>or</span> </span> <strong><a class="checkout" href="/cart">Checkout</a></strong> </div>
        </div>
      </div>
    </div>
  </div>
  <div id="mobile-search-wrap">
    <div id="mobile-search">
      <div class="row padded">
        <div class="small-12 columns">
          <form class="form-search" name="search" action="/search">
            <input type="text" name="q" class="search-query search replace" placeholder="To search type and hit enter">
          </form>
        </div>
      </div>
    </div>
  </div>
  <div id="core-wrap">
    <header id="site-header">
      <div class="row padded-h">
        <div class="small-12 columns">
          <div class="table">
            <div class="cell text-left">
              <div id="brand">
                <h1 id="brand-primary-text"><a href="http://rachelfrancojewelry.myshopify.com" title="">EE Jewlery</a></h1>
              </div>
            </div>
            <div id="nav-primary-wrap" class="cell">
              <div id="top-bar-wrap">
                <nav id="nav-primary" class="top-bar">
                  <h2 class="hidden">Menu: Primary</h2>
                  <ul class="title-area">
                    <li class="toggle-topbar menu-icon"><a href="#"></a></li>
                  </ul>
                  <div class="top-bar-section">
                    <ul class="right">
                      <li class="active"> <a href="/">Home</a> </li>
                      <li class="divider">/</li>
                      <li class=""> <a href="/collections/all">Catalog</a> </li>
                    </ul>
                  </div>
                </nav>
              </div>
              <div id="mobile-nav-toggles">
                <div class="table">
                  <div class="cell"> <a href="#" id="toggle-mobile-nav"><i class="icon-reorder"></i></a> </div>
                  <div class="cell"> <a href="#" id="toggle-mobile-search"><i class="icon-search"></i></a> </div>
                </div>
              </div>
            </div>
            <div id="header-search-wrap" class="cell text-right">
              <div id="header-search">
                <form class="form-search form-inline" name="search" action="/search">
                  <input type="text" name="q" class="search-query search replace" placeholder="search">
                </form>
              </div>
            </div>
          </div>
          <div id="mobile-nav-primary-wrap">
            <nav id="mobile-nav-primary">
              <h2 class="hidden">Menu: Primary Mobile</h2>
              <ul>
                <li class=""><a href="/cart">Checkout - 0 items for $0.00</a></li>
                <li class="active"> <a href="/">Home</a> </li>
                <li class=""> <a href="/collections/all">Catalog</a> </li>
                <li class=""><a href="/account">My Account</a></li>
              </ul>
            </nav>
          </div>
        </div>
      </div>
    </header>
    
    <!-- Content -->
    <section id="site-body">
      <div class="row padded-h">
        <div class="small-12 columns">
          <div class="row">
            <div class="large-12 columns">
              <div class="slides-wrap">
                <ul id="index-slides" class="bx-slider slides" data-autoplay="true" data-transition="vertical" data-duration="5000.0" data-transition-duration="800.0">
                  <li class="slide"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/slide_01.jpg?120" alt="" /></li>
                  <li class="slide"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/slide_02.jpg?120" alt="" /></li>
                </ul>
              </div>
            </div>
          </div>
          <h1 class="hide">Home</h1>
          <div id="content-wrap" class="default">
            <div class="row">
              <div class="small-12 columns primary"> 
                
                <!-- This is a comment -->
                <div class="row">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
              
                <section>
                  <h2 class="hide">Featured Products</h2>
                  <div class="products cards">
                    <ul class="block-grid small-block-grid-2 large-block-grid-4">
                      <li>
                        <div class="product card">
                          <article class="hproduct product-158167245 test-bracelets-test" data-url="/products/test-bracelets-test" >
                            <div class="image-wrap">
                              <div class="image"> <a href="/products/test-bracelets-test" title="test  bracelets test"> <img src="http://cdn.shopify.com/s/files/1/0268/1833/products/Sterling-Silver-Bracelets-21345_large.jpg?120" alt="test  bracelets test" /> </a> </div>
                            </div>
                            <div class="details">
                              <header>
                                <h1 class="header-color"> <a href="/products/test-bracelets-test" title="test  bracelets test"> <span class="name">test  bracelets test</span> </a> </h1>
                              </header>
                              <span class="brand">vendor name e.g appple</span> <span class="price"> $34.99 </span> </div>
                          </article>
                        </div>
                      </li>
                    </ul>
                  </div>
                </section>
                <!-- three box -->
                    <div class="row">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
                         <!-- three box end -->
                <!-- slider start -->
                 <div class="slides-wrap">
                <ul id="index-slides" class="bx-slider slides" data-autoplay="true" data-transition="vertical" data-duration="5000.0" data-transition-duration="800.0">
                  <li class="slide"><img src="http://placehold.it/1150X150/FF9966" /></li>
                  <li class="slide"><img src="http://placehold.it/1150X150" /></li>
                </ul>
              </div>
                <!-- slider end -->
                
              </div>
              <!-- content_class --> 
              
            </div>
            <!-- .row --> 
          </div>
          <!-- #content-wrap --> 
          
        </div>
      </div>
      <div id="footer-widgets-top"></div>
    </section>
    
    <!-- Footer widgets -->
    <aside id="footer-widgets">
      <div class="row padded">
        <div class="large-12 columns">
          <h1 class="section-title">Footer</h1>
          <div class="widgets">
            <div class="row">
              <div class="large-3 columns">
                <section class="widget widget-links 01">
                  <div class="widget-inner">
                    <header class="widget-header">
                      <h2>Help Desk</h2>
                    </header>
                    <ul class="link-list">
                      <li><a href="/pages/return-policy" title="">Return Policy</a></li>
                      <li><a href="/pages/shipping-info" title="">Shipping Info.</a></li>
                      <li><a href="/pages/why-buy-from-us" title="">Why Buy From Us</a></li>
                      <li><a href="/pages/contact-us" title="">Contact Us</a></li>
                      <li><a href="/pages/about-us" title="">About Us</a></li>
                      <li><a href="/pages/terms-of-service" title="">Terms Of Service</a></li>
                      <li><a href="/pages/privacy-policy" title="">Privacy Policy</a></li>
                    </ul>
                  </div>
                </section>
              </div>
              <div class="large-4 columns">
                <section class="widget widget-links 02">
                  <div class="widget-inner">
                    <header class="widget-header">
                      <h2>Categories</h2>
                    </header>
                    <ul class="link-list">
                      <li><a href="/" title="">Eaarings</a></li>
                      <li><a href="/" title="">Bracelets</a></li>
                      <li><a href="/" title="">Necklaces</a></li>
                      <li><a href="/search" title="">Search</a></li>
                    </ul>
                  </div>
                </section>
              </div>
              <div class="large-3 columns">
                <section class="widget widget-newsletter ">
                  <div class="widget-inner">
                    <header class="widget-header">
                      <h2>Newsletter</h2>
                    </header>
                    <p class="intro">Sign up to have the latest news and member-only deals delivered straight to your inbox.</p>
                    <form class="form validate" method="post" action="" name="mc-embedded-subscribe-form" target="_blank">
                      <div class="row">
                        <div class="twelve columns">
                          <input type="email" value="" name="EMAIL" class="email span12" placeholder="your@email.com">
                        </div>
                      </div>
                      <div class="row">
                        <div class="twelve columns">
                          <button type="submit" class="button">Sign up</button>
                        </div>
                      </div>
                    </form>
                  </div>
                </section>
              </div>
              <div class="large-2 columns">
                <section class="widget widget-social-links ">
                  <div class="widget-inner">
                    <ul class="social-links inline-list">
                      <li> <a href="twitter.com/KimKardashia" title="Twitter" data-target="new-window"> <i class="icon-twitter"></i> </a> </li>
                    </ul>
                  </div>
                </section>
              </div>
            </div>
          </div>
          <!-- widgets --> 
          
        </div>
      </div>
    </aside>
  </div>
  <!-- #core-wrap --> 
  
  <!-- Footer -->
  <footer id="site-footer">
    <div class="row padded-h">
      <div class="small-12 columns">
        <div class="mobile-nav-select-wrap">
          <nav class="mobile-nav-select">
            <h2 class="hidden">Menu: Secondary Mobile</h2>
            <form>
              <select>
                <option>Jump to...</option>
                <option value="/cart">Checkout - 0 items for $0.00</option>
                <option value="/pages/return-policy" >Return Policy</option>
                <option value="/pages/shipping-info" >Shipping Info.</option>
                <option value="/pages/why-buy-from-us" >Why Buy From Us</option>
                <option value="/pages/contact-us" >Contact Us</option>
                <option value="/pages/about-us" >About Us</option>
                <option value="/pages/terms-of-service" >Terms Of Service</option>
                <option value="/pages/privacy-policy" >Privacy Policy</option>
              </select>
            </form>
          </nav>
        </div>
        <div id="fine-print"> 
          
          <!-- Copyright -->
          <div id="copyright">
            <p class="date">&copy; 2013</p>
            <p><strong><a href="http://rachelfrancojewelry.myshopify.com" title="">Rachel Franco Jewelry</a></strong></p>
            <p>All rights reserved.</p>
            <p id="shop-currency-notice">All prices in USD.</p>
          </div>
          
          <!-- Attributions -->
          <div id="attributions"> </div>
        </div>
        <nav id="nav-footer">
          <h2 class="hidden">Menu: Footer</h2>
          <ul class="inline-list">
            <li class="nav-item first"> <a href="/pages/return-policy">Return Policy</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/shipping-info">Shipping Info.</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/why-buy-from-us">Why Buy From Us</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/contact-us">Contact Us</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/about-us">About Us</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/terms-of-service">Terms Of Service</a> </li>
            <li class="divider">/</li>
            <li class="nav-item"> <a href="/pages/privacy-policy">Privacy Policy</a> </li>
          </ul>
        </nav>
      </div>
    </div>
    <div class="row padded-h">
      <div class="small-12 columns">
        <div id="payment-methods">
          <p id="accepted-text">We Accept</p>
          <a href="/cart" class="payment-method" title="Paypal"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-paypal.png?120" alt="paypal" /></a> <a href="/cart" class="payment-method" title="Google checkout"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-google-checkout.png?120" alt="google-checkout" /></a> <a href="/cart" class="payment-method" title="Visa"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-visa.png?120" alt="visa" /></a> <a href="/cart" class="payment-method" title="Mastercard"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-mastercard.png?120" alt="mastercard" /></a> <a href="/cart" class="payment-method" title="American express"><img src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/icon-cc-american-express.png?120" alt="american-express" /></a> </div>
      </div>
    </div>
  </footer>
</div>

<!-- Footer scripts -->
<div id="footer-scripts"> 
  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js" type="text/javascript"></script> 
  <script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.pack.js" type="text/javascript"></script> 
  <script src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/jquery.bxslider.min.js?120" type="text/javascript"></script> 
  <script src="http://cdn.shopify.com/s/shopify/option_selection.js?dbfb7cec78e7c3b13d8446c5fd4f4fa3ce9c123a" type="text/javascript"></script> 
  <script src="http://cdn.shopify.com/s/files/1/0268/1833/t/2/assets/theme.js?120" type="text/javascript"></script> 
  <script src="https://apis.google.com/js/plusone.js" type="text/javascript"></script> 
</div>
</body>
</html>

Open in new window

0
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Try this to the 3 box code at the bottom.

Change
  <!-- three box -->
                    <div class="row">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
<!-- three box end -->

Open in new window

to
  <!-- three box -->
                    <div class="row threebox_bottom">
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/e.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/n.jpg" alt="" /></a></div>
                  <div class="large-4 columns text-center"><a href="/collections/all"><img src="http://cdn.shopify.com/s/files/1/0268/1833/files/b.jpg" alt="" /></a></div>
                </div>
                         <!-- three box end -->

Open in new window


Then add to your css

.threebox_bottom {
margin-bottom: 20px;
}

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
rkrox902Author Commented:
didn't work.. would you be able to log in?
0
rkrox902Author Commented:
I got it to wrk thnks
0
BillDLCommented:
rkrox902

I was monitoring the question but didn't comment.  I think it would be a good idea to now remove that temporary login profile and maybe change your site admin password to something a little less obvious, just in case this question is indexed on Google and some unscupulous person decides to log in and create havoc.

Bill
0
rkrox902Author Commented:
Thank u
0
BillDLCommented:
Oh yes, I forgot you had "mod powers" ;-)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.