Announcement

Collapse
No announcement yet.

Daily Deal Header Layout

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Daily Deal Header Layout

    I'm trying to recreate the right part of the header on www.diaperjunction.com. I really like how the daily deals and the cart are part of the right side of the header which is similar to mine currently. I've been unsuccessful in recreating this effect. Any help on this would be greatly appreciated.
    ___________________
    Toymaster
    www.1upcollectibles.com
    www.facebook.com/1upCollectible

  • #2
    From the generated source I see:

    <table width="287" cellspacing="0" cellpadding="0" border="0">
    <tbody><tr>
    <td align="left" valign="top">
    <div class="topright_tile">
    <table width="100%" cellspacing="0" cellpadding="0" border="0">
    <tbody><tr>
    <td bgcolor="#FFFFFF"><table width="100%" cellspacing="0" cellpadding="0" border="0">
    <tbody><tr>
    <td width="47"><img width="45" height="35" alt="View your shopping cart" src="assets/templates/diaperjunction/images/shop-cart.png"/></td>
    <td class="cart-text"><a href="view_cart.asp">SHOPPING CART</a>: 0 item(s) / $0.00</td>
    </tr>
    </tbody></table></td>
    </tr>
    <tr>
    <td align="right" valign="top" id="topmenu"><a class="topMenu" href="contact-us.html">CONTACT US</a> | <a class="topMenu" href="myaccount.asp"> MY ACCOUNT</a></td>
    </tr>
    </tbody></table>
    </div>
    <div class="topright_btm"/>
    </td>
    </tr>
    <tr>
    <td align="left" valign="top">
    <div class="topright_top"/>
    <div class="topright_tile" id="dealcont">
    <iframe scrolling="no" frameborder="0" allowtransparency="true" style="border: medium none; overflow: hidden; width: 272px; height: 69px;" src="dailydeal_widget.asp"/>
    </div>
    <div class="topright_btm"/>
    </td>
    </tr>
    </tbody></table>

    When looking at the css:

    .topright_tile {
    background-image: url(../images/topright_tile.png);
    background-repeat: repeat-y;
    width: 272px;
    padding-right: 8px;
    padding-left: 7px;
    padding-top: 4px;
    }
    #dealcont {
    position: relative;
    height: 55px;
    }
    As you can see, there is an iframe involved, an ID and a class. The class has an image associated with it. These are your clues.

    Comment


    • #3
      Originally posted by celebra1 View Post
      From the generated source I see:

      <table width="287" cellspacing="0" cellpadding="0" border="0">
      <tbody><tr>
      <td align="left" valign="top">
      <div class="topright_tile">
      <table width="100%" cellspacing="0" cellpadding="0" border="0">
      <tbody><tr>
      <td bgcolor="#FFFFFF"><table width="100%" cellspacing="0" cellpadding="0" border="0">
      <tbody><tr>
      <td width="47"><img width="45" height="35" alt="View your shopping cart" src="assets/templates/diaperjunction/images/shop-cart.png"/></td>
      <td class="cart-text"><a href="view_cart.asp">SHOPPING CART</a>: 0 item(s) / $0.00</td>
      </tr>
      </tbody></table></td>
      </tr>
      <tr>
      <td align="right" valign="top" id="topmenu"><a class="topMenu" href="contact-us.html">CONTACT US</a> | <a class="topMenu" href="myaccount.asp"> MY ACCOUNT</a></td>
      </tr>
      </tbody></table>
      </div>
      <div class="topright_btm"/>
      </td>
      </tr>
      <tr>
      <td align="left" valign="top">
      <div class="topright_top"/>
      <div class="topright_tile" id="dealcont">
      <iframe scrolling="no" frameborder="0" allowtransparency="true" style="border: medium none; overflow: hidden; width: 272px; height: 69px;" src="dailydeal_widget.asp"/>
      </div>
      <div class="topright_btm"/>
      </td>
      </tr>
      </tbody></table>

      When looking at the css:

      .topright_tile {
      background-image: url(../images/topright_tile.png);
      background-repeat: repeat-y;
      width: 272px;
      padding-right: 8px;
      padding-left: 7px;
      padding-top: 4px;
      }
      #dealcont {
      position: relative;
      height: 55px;
      }
      As you can see, there is an iframe involved, an ID and a class. The class has an image associated with it. These are your clues.
      I definitely should have been more precise in my original question. What I'm really looking for is how to re-create the widget they are using on their site. I like how that widget fits under their cart function and showcases the actual product for the daily deal.
      ___________________
      Toymaster
      www.1upcollectibles.com
      www.facebook.com/1upCollectible

      Comment


      • #4
        The previous post gave you the code. You have to just reposition the daily deal widget and change the layout which you'll find in your ftp. Then reupload the frame file with the new positioning and the new daily deal template so the layout is changed accordingly.
        (¯`v´¯)
        `*.¸.*´

        ¸.•´¸.•*¨) ¸.•*¨)
        (¸.•´ (¸.•´ .•´ ¸¸.•¨¯`•
        * P£†®ª *

        Shadow Trailers
        www.TrailerandTruckParts.com
        www.Trailer-Wheels.com
        www.iTrailerParts.com

        Comment

        Working...
        X