Announcement

Collapse
No announcement yet.

Cart Summary Inbedded In Header

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

    Cart Summary Inbedded In Header

    Hi, i'm trying to inbed the variable: <actinic:variable name="ShoppingCartSummary" /> into the right hand side of my header image

    www.classixshop.com is our live site, but the picture should show you what i'm trying to accomplish.

    this is the code my header uses:

    HTML Code:
    <!-- Header HTML begin -->
    <!-- This file is used to build the page headers including the title, logo, etc. -->
    
    
    <!-- If customer accounts are in operation following two lines allow displaying -->
    <!-- User name and customer account name on every page -->
    <Actinic:NOWSERVING/>
    <Actinic:CURRACCOUNT/><Actinic:LOGOUT_SIMPLE/>
    <!-- The following two lines can be uncommented and moved to include the section image -->
    <!-- and description in the section page headers -->
    <!-- NETQUOTEVAR:SECTIONIMAGE -->
    <!-- NETQUOTEVAR:SECTIONTEXT -->
    
    
    <table class="main" width="768" cellspacing="1" cellpadding="0" border="0" bgcolor="#757575"><tr><td bgcolor="#000000">
    
    
    <table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>
    <a class="nobg" href="http://www.classixshop.com"><img src="header.gif" width="658" height="80" border="0" alt=""></a></td><td align="left"></td></tr></table>
    
    
    
    
    
    
    
    </td></tr><tr><td bgcolor="#000000">
    <table width="100%" cellspacing="0" cellpadding="0" border="0" style="background:url('side_bg.gif');background-position:top;"><tr ><td align="center"><ul><li><a class="menu" href="http://www.classixshop.com">HOME</a></li></ul>
    </td><td align="center"><ul><li><a class="menu" href="http://www.classixshop.com/cgi-bin/ca000004.pl?ACTION=SHOWCART">CART</a></li></ul></td>
    <td align="center"><ul><li><a class="menu" href="http://www.classixshop.com/cgi-bin/os000004.pl?ACTION=Start">CHECKOUT</a></ul></td><td align="center"><ul><li><a class="menu" href="http://www.classixshop.com/acatalog/faq.php">FAQ</a></ul></td><td align="center">
    <ul><li><a class="menu" href="http://www.classixshop.com/acatalog/links.php">LINKS</a></ul></td><td align="center"><ul><li><a class="menu" href="http://www.classixshop.com/acatalog/feedback.php">FEEDBACK</a></ul></td><td align="center"><ul><li><a class="menu" href="http://www.classixshop.com/acatalog/contact.php">CONTACT</a></ul>
    </td></tr></table></td></tr></table>
    
    
    
    
    
    
    <!-- This file is used to build the page headers including the title, logo, Menu etc. -->
    <!-- Header HTML end -->
    any help on trying to sort this out?

    Cheers FrAz
    Attached Files
    Cheers FrAz

    #2
    Code:
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td>
    <a class="nobg" href="http://www.classixshop.com"><img src="header.gif" width="658" height="80" border="0" alt=""></a>
    </td>
    <td align="left">
    
    #### cart summary layout here ####
    
    </td>
    </tr>
    </table>
    .. although I would be forced to remove the mass of nested tables as they are not required up there.

    You should also put something into alt="My shop keywords here" to help with the SEO


    Bikster
    SellerDeck Designs and Responsive Themes

    Comment


      #3
      Nice one Jont that seems to have done the trick and put it where i wanted. If i used an image that spanned the whole wide of the header would the cart summary overlap the image in it's current position, or would it just be pushed further right!?

      Also now the cart summary is to the right, there is a slight gap between the bottom of the header image and the below icon is there a reason why that has happened, are there adjustable settings for the cart summary variable?

      Cheers FrAz

      I've attahced a pic of the gap i'm seeing in design mode
      Attached Files
      Cheers FrAz

      Comment


        #4
        For a full width solution there are several options .. as you have the main logo as a link to the homepage I would suggest adding the "rest" of the image as a background image to the table cell holding the cart summary... this is the simplest solution with what you have at the moment.

        The gap could be coming from an number of areas.. as a starter for 10 ensure all the code at the top of the page that I place into my previous post has no white spaces between eg instead of

        Code:
        <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
        <td>......
        use

        Code:
        <table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>....
        This is a well known issue with internet explorer. If you have not yet viewed the page in Firefox I would do that as this allows better options for debugging and editing code on the fly to see what is doing what.


        Bikster
        SellerDeck Designs and Responsive Themes

        Comment


          #5
          Sweet, cheers jont that seemed to do the trick, I c where you coming from, but how would i go about doing this table with the cart summary inbedded?
          Cheers FrAz

          Comment


            #6
            Check out http://www.w3schools.com/Html/tryit....cellbackground for examples on how to add a background image

            Essentially in the <td> tag before the mini cart summary add the background image eg:

            <td background="logo_right.jpg">


            Bikster
            SellerDeck Designs and Responsive Themes

            Comment


              #7
              Cheers again Jont used the code from that link to get my disired affect, am using this code now

              HTML Code:
              <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
              <td>
              <a class="nobg" href="http://www.classixshop.com"><img src="header_left.gif" width="668" height="80" border="0" alt="Classixshop.com | Shoes & Boots | TUK Shoes, T.U.K Shoes, Tuk Shoes & Boots , Anarchic , Emily The Strange | Madfish Shoes & Boots, Big Zipper, Big Flame, Big Flap, Big Shark, Manta Ray, Shark, Metula, Flap, Flame, Iron Fist Footwear, Fantasy Shoes, New Rock Boots | Tops & T-Shirts | Emily The Strange, Criminal Damage, Toxico Clothing, Iron Fist Clothing, IronFist Clothing, Ordinary Clothing, Shock Tees, Sik World, Jist Clothing, Europoint, Misc T-Shirts | Trousers & Shorts, Jist Clothing, Bleubolt Jeans, Criminal Damage | Gothic & Punk | Omen - Gothic, Omen - Punk, Omen Printed, Lolita Rose, Europoint, Strangeways, The Darklings | Band Merch | Band Patches, Wallets, Clocks, CD Wallets, Bags, T-Shirts, Headwear, Local Bands - York | Body Jewellery, Flesh Tunnels, Plugs, Expanders, Tapers, Rings, BCRs, Circular Barbells, Closed Segment Rings, Labrets, Barbells, Navel Bars, Attachments, Balls, Spikes, Gems, Pictures | Accessories | Emily The Strange, Emily Strange, Pamela Mann Tights, LaRiche Hair Colour, Headwear, Belt Buckles, Belts, Dog Collars, Wristbands, PLO Scarves, Bandanas | Miscellaneous, Bags , Toys ,Music Toys, Film Toys , Zippo Lighters , Posters, Music, Films, Misc | SALE | CLEARANCE | Atticus Belts, Criminal Damage, Jist Clothing, Fathom Clothing"></a></td><td background="header_right.gif"><actinic:variable name="ShoppingCartSummary" /></td></tr></table>
              does that seem correct?

              You can see the result @ www.classixshop.com
              Cheers FrAz

              Comment


                #8
                Certainly seems to work OK on the live site in both IE and Firefox.

                I would suggest looking at the amount of text in the alt="" ... you may get hit for spamming. The Alt text is used if the user has images turned off and should essentially describe the image with a few keywords along the way to help. That many could see you penalised.


                Bikster
                SellerDeck Designs and Responsive Themes

                Comment


                  #9
                  Reeto, i did think i may have gone ott on the description, i'll cut it down to just suppliers and not actually product names by suppliers, should reduce it down considerably! thanks again
                  Cheers FrAz

                  Comment

                  Working...
                  X