Announcement

Collapse
No announcement yet.

Alternating background colours on products

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

    Alternating background colours on products

    Hello.

    I'm currently in the process of redesigning our product templates to look a bit nicer than they do at the moment. We've decided to go for compact rows to better increase the amount of information before the fold and make it easier to find products on the page.

    What I'd like to do is alternate the background of each product 'row' to make them more readable. I'm pretty sure I've seen this done before in Actinic, but I can't find reference to it in the AUG and a search of the forums doesn't turn up anything.

    If anyone could point me towards a method for achieving this, it would be much appreciated. An ideal solution would be the ability to apply a class to every other row, and set the background through an external style sheet like that. However, if that's not possible, doing it with inline styles would work too. Of course, it might be that I can't do this at all within Actinic, but I'm almost certain I saw a thread about it somewhere (although I can't seem to find it any more).

    Thanks.

    #2
    Rob,

    There is an old post on the forum here:

    http://community.actinic.com/showthread.php?t=6934

    It refers to a product template used in Actinic v6, alternating the layout image left, then right.

    I can't find a similar template in v7. If you have access to a copy of v6 and can find the appropriate product template, it should be possible to replicate the code (having backed up your original template of course)

    Norman's post (#5) is another way to go

    HTH
    Chris
    -----
    http://www.livingaidsonline.co.uk

    Comment


      #3
      Hi Chris,

      That's excellent, thanks very much for the link. I'll give it a go and see how it works out.

      Comment


        #4
        theres the v6 act-productline template with alternate left and right images.
        <!-- ProductLine HTML begin -->
        <!-- Insert HTML for the top of the individual product -->
        NETQUOTEVAR:INCLUDE Act_ProductSeparator.html
        NETQUOTEVAR:ENDSEPARATOR
        NETQUOTEVAR:PRODUCTFORMBEGIN
        <tr>
        <td rowspan="2" valign="TOP" align="CENTER">
        NETQUOTEVAR:TEMPLATEBEGINXML
        NETQUOTEVAR:PRODUCTIMAGE
        </td>

        <td colspan="2" valign="TOP" align="LEFT">
        <a name="NETQUOTEVAR:PRODUCTANCHOR"><span class="actregular"><b>NETQUOTEVAR:PRODUCTNAME</b></span></a>
        NETQUOTEVAR:PRODUCTREF
        <br>NETQUOTEVAR:PRODUCTDESCRIPTION&nbsp;NETQUOTEVAR:EXTINFOLINKNETQUOTEVAR:EXTINFOBUTTON
        <br>NETQUOTEVAR:PRODUCTBEGINLINKNETQUOTEVAR:PRODUCTLINKTEXTNETQUOTEVAR:PRODUCTENDLINK
        NETQUOTEVAR:PRICEEXPLANATION
        <br><b>NETQUOTEVAR:PRODUCTPRICE</b>

        NETQUOTEVAR:OTHERINFOPROMPT
        NETQUOTEVARATEPROMPT
        </td>
        </tr>

        <tr>
        <td colspan="2" align=LEFT>
        <span class="actxsmall">
        NETQUOTEVAR:CARTERRORXMLNETQUOTEVAR:PRODUCTQUANTITY<br>
        <Actinic:ACTIONS>NETQUOTEVAR:ADDTOCARTBUTTON</Actinic:ACTIONS>
        </span>

        NETQUOTEVAR:TEMPLATEENDXML
        </td>
        </tr>
        NETQUOTEVAR:PRODUCTFORMEND
        NETQUOTEVAR:NEXT
        <!-- Next product in the template starts here -->
        NETQUOTEVAR:INCLUDE Act_ProductSeparator.html
        NETQUOTEVAR:ENDSEPARATOR
        NETQUOTEVAR:PRODUCTFORMBEGIN

        <tr>
        <td colspan="2" valign="TOP" align="LEFT">
        NETQUOTEVAR:TEMPLATEBEGINXML
        <a name="NETQUOTEVAR:PRODUCTANCHOR"><span class="actregular"><b>NETQUOTEVAR:PRODUCTNAME</b></span></a>
        <span class="actsmall">NETQUOTEVAR:PRODUCTREF</span>

        <br>NETQUOTEVAR:PRODUCTDESCRIPTION&nbsp;NETQUOTEVAR:EXTINFOLINKNETQUOTEVAR:EXTINFOBUTTON
        <br>NETQUOTEVAR:PRODUCTBEGINLINKNETQUOTEVAR:PRODUCTLINKTEXTNETQUOTEVAR:PRODUCTENDLINK
        NETQUOTEVAR:PRICEEXPLANATION
        <br><b>NETQUOTEVAR:PRODUCTPRICE</b>
        NETQUOTEVAR:OTHERINFOPROMPT
        NETQUOTEVARATEPROMPT
        </td>

        <td rowspan="2" valign="TOP" align="CENTER">
        NETQUOTEVAR:PRODUCTIMAGE
        </td>
        </tr>

        <tr>
        <td colspan="2" align=LEFT>
        <span class="actxsmall">
        NETQUOTEVAR:CARTERRORXMLNETQUOTEVAR:PRODUCTQUANTITY<br>
        <Actinic:ACTIONS>NETQUOTEVAR:ADDTOCARTBUTTON</Actinic:ACTIONS>
        </span>
        NETQUOTEVAR:TEMPLATEENDXML
        </td>
        </tr>

        NETQUOTEVAR:PRODUCTFORMEND
        NETQUOTEVAR:NEXT
        <!-- Insert HTML for the bottom of the individual product -->
        <!-- ProductLine HTML end -->

        Comment


          #5
          I've just tried this, and it didn't seem to work at all. Instead of doing two different products, Actinic seemingly just inserted one product twice

          After an hour of frustrating searching through Actinic's murky bowels, I finally realised that, of the several thousand sections I could have chosen to preview, I'd managed to pick the only one where, somehow, each product had been mistakenly duplicated.

          So if anyone's interested, the method works perfectly. By putting two product templates in Act_ProductLine, you can define the layout of every other product seperately.

          Thanks for the help.

          Comment

          Working...
          X