Announcement

Collapse
No announcement yet.

3 Column Section Lines - Middle

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

    3 Column Section Lines - Middle

    Hi

    I have used the Actinic user guides to make the product thumbnail sections have 3 columns. I have also amended the layout so that title and description appears under centred below the image.

    I am trying to make the row of 3 images of different sizes appear aligned through the middle of the 3 - however amending the html from valign=top to valigh=middle has no affect. Presumably because of how the tables are laid out.

    Does anyone have any ideas?

    http://www.kjbeckett.com/acatalog/bowties.html In the example link I am trying to get the grey and red bow tie appear lower.

    Thanks

    Paul
    KJ Beckett
    Men's Clothing & Accessories
    Cufflinks, Underwear, Ties, Grooming Products
    Bath, England
    Fast delivery to UK, USA and worldwide.
    Men's Fashion Blog

    #2
    First thing to do is to temporarily set border=1 in these tables (and the surrounding table) so you can see what's actually happening.

    Also when looking at your generated page there's some mildly invalid HTML there.
    Code:
    <TABLE WIDTH="500" COLS="3" BORDER="0" CELLPADDING="10" CELLSPACING="0" ALIGN="CENTER"> <Actinic:SECTION BLOB="A000126.cat"/>
    
    </TABLE><A NAME="sectionbottom"><DIV ALIGN="RIGHT"> </DIV>  
    
    <TABLE width="100%"><TR><TD WIDTH="33%" valign="top">
    <DIV ALIGN="CENTER">
    
    <TABLE BORDER="0" CELLSPACING="0" CELLPADDING="10">
    <TR>
    <TD ALIGN="CENTER" VALIGN="MIDDLE">
    <A HREF="copy_of_Grey_bowtie_by_robertcharles_000284.html"><IMG SRC="000284_main_s.jpg" ALT="Grey Rose Bow Tie by Robert Charles" BORDER=0 HEIGHT=86 WIDTH=150  ALIGN="ABSMIDDLE"></A>
    </TD>
    </TR>
    <TR>
    <TD ALIGN="CENTER" VALIGN="MIDDLE">
    <A HREF="copy_of_Grey_bowtie_by_robertcharles_000284.html"><span class="actxxsmall">Grey Rose Bow Tie by Robert Charles</A></span><br><span class="actxxsmall">£34.50</span>
    </TD>
    </TR>
    </TABLE>
    </DIV> 
    </TD>
    ...
    ...
    That first </TABLE> seems to be wrong. I'd expect it to be near the bottom of the page.
    Norman - www.drillpine.biz
    Edinburgh, U K / Bitez, Turkey

    Comment


      #3
      Hi Paul,

      Can't help you with your problem but while I was looking at your product

      Grey Rose Bow Tie by Robert Charles Ref: 000284
      Missing Photo

      The popup extended info has a broken link to the image at the top.

      Lonnie
      http://www.TheLondonPoject.ca
      Located at Vancouver, Canada

      Comment


        #4
        Hi Norman

        I have set the table to 1 and there are two different tables. They all seem to be alligned to the top of the image table. I would of thought that this is why I am struggling to align through middle of both tables - and therefore make an even spread across each column.

        A possible course of action is to remove the two tables and just make one. The original Act_SectionLine just had one table - but as part of doing the text underneath image change, the Actinic guide instructed to input a new table for the text. I plan to remove the second table and use a <br> to place the text below the image.

        This is basically being done on your FANTASTIC multi column search patch from www.drillpine.biz - Act_ResultsTemplate where I have been able to ensure the images are presented well.

        Before I do the above - I am a bit worried about this </TABLE><A NAME="sectionbottom"><DIV ALIGN="RIGHT"> </DIV> line being in the wrong place.

        Lonnie - Thanks for the tip off!!!

        Paul
        KJ Beckett
        Men's Clothing & Accessories
        Cufflinks, Underwear, Ties, Grooming Products
        Bath, England
        Fast delivery to UK, USA and worldwide.
        Men's Fashion Blog

        Comment


          #5
          Okay I had a nice idea but it did not work.

          As mentioned - I removed the middle </tr><tr><td> to effectively make one table instead of two within my ActSectionLine template. This has happened because it is visible on http://www.kjbeckett.com/acatalog/bowties.html. I also included a <BR> to put the text below the image. So far so good.

          But despite my now single table being <TD VALIGN=MIDDLE ALIGN=CENTER>. The 3 x items per row are still alligning at the top.

          Now if you look at my new multi column search results - a patch by Norman - the 3 x items are perfectly laid out - alligned through the center!

          I think the html table of my sectionline is set up like my search results table???


          **********Act_ResultsTemplate*************

          <TABLE BORDER=0 CELLSPACING=0 CELLPADDING=10 WIDTH="CUSTOMVAR:ACTSTDWIDTH" ALIGN="CENTER">
          <TR>
          <TD colspan=CUSTOMVAR:SEARCHCOLS ALIGN=LEFT>
          <B><Actinic:S_SUMMARY/></B><BR><Actinic:S_CONTINUE/>
          </TD>
          </TR>
          <TR>
          <Actinic:SEARCH_RESULTS>
          <TD valign=MIDDLE width=CUSTOMVAR:SEARCHCOLWIDTH ALIGN=CENTER>
          <Actinic:S_ITEM/>.
          <Actinic:XMLTEMPLATE NAME="ImageLine">
          <IMG SRC="NETQUOTEVAR:THUMBNAIL" NETQUOTEVAR:THUMBNAILSIZE>
          </Actinic:XMLTEMPLATE><BR><span class="actxxsmall">
          <Actinic:S_LINK/><B><Actinic:S_PNAME/></B></A> <Actinic:S_SNAME/><BR> <Actinic:S_PRICE/></span> <BR>
          <Actinic:S_DESCR/><BR>
          <Actinic:S_PROP/><P>
          </TD>
          <Actinic:S_TABLEEND/>
          </Actinic:SEARCH_RESULTS>
          </TR>
          <TR>
          <TD colspan=CUSTOMVAR:SEARCHCOLS ALIGN=LEFT>
          <B><Actinic:S_SUMMARY/></B><BR><Actinic:S_CONTINUE/>
          </TD>
          </TR>
          </TABLE>
          <HR SIZE="1" ALIGN="CENTER" WIDTH="CUSTOMVAR:ACTSTDWIDTH">
          NETQUOTEVAR:SEARCHBLOCK

          **************Act_SectionLine***********

          <!-- SectionLine HTML begin -->
          <!-- Insert HTML for the beginning of a section title -->

          <DIV ALIGN="CENTER">

          <TABLE BORDER="1" CELLSPACING="0" CELLPADDING="10">

          <TR>

          <TD VALIGN=MIDDLE ALIGN=CENTER>
          <A HREF="NETQUOTEVAR:SECTIONLINK">NETQUOTEVAR:SECTIONIMAGE</A>
          <BR>
          <A HREF="NETQUOTEVAR:SECTIONLINK"><span

          class="actxxsmall">NETQUOTEVAR:SECTIONNAME</A></span>
          <br><span class="actxxsmall">NETQUOTEVAR:SECTIONTEXT</span>
          </TD>

          </TR>

          </TABLE>

          </DIV>
          NETQUOTEVAR:NEXT
          <!-- Insert HTML for the end of a section title -->
          <!-- SectionLine HTML end -->

          Many thanks
          KJ Beckett
          Men's Clothing & Accessories
          Cufflinks, Underwear, Ties, Grooming Products
          Bath, England
          Fast delivery to UK, USA and worldwide.
          Men's Fashion Blog

          Comment


            #6
            Paul

            is this what you are after http://sovietsub.co.uk/acatalog/Onli...n_Hats__7.html if it is you will need to set a "height" on the sectionline so they all have the biggest size. You could also resize the images to all be the same size.
            Owner of a broken heart

            Comment


              #7
              Paul,

              I can see yout table borders. However these tables are inside another table cell and this is

              <TABLE width="100%"><TR><TD WIDTH="33%" valign="top">

              It's that table you need to locate and set to valign=middle

              My Search Results in Columns patch works slightly differently, and you have finer control there.

              All these patches have been "donationware" for the last 2 1/2 months so I hope you'll respect that.
              Norman - www.drillpine.biz
              Edinburgh, U K / Bitez, Turkey

              Comment


                #8
                Thanks.

                I think that the line is held within Act_Primary. Can't find 33% in it but I suspect that 33% value is dynamically driven by the fact that in Design Options - Sections, the Column Count is set to 3.

                I will find it. Thankyou.
                KJ Beckett
                Men's Clothing & Accessories
                Cufflinks, Underwear, Ties, Grooming Products
                Bath, England
                Fast delivery to UK, USA and worldwide.
                Men's Fashion Blog

                Comment


                  #9
                  It's in Design / Text / Goto / Phase -1, ID 1187 onwards. The line in question is 1189. Don't mess with the WIDTH="%d%%" as that's essential for Actinic's operation.
                  Norman - www.drillpine.biz
                  Edinburgh, U K / Bitez, Turkey

                  Comment


                    #10
                    Great. Thats done the trick. Thanks!
                    KJ Beckett
                    Men's Clothing & Accessories
                    Cufflinks, Underwear, Ties, Grooming Products
                    Bath, England
                    Fast delivery to UK, USA and worldwide.
                    Men's Fashion Blog

                    Comment

                    Working...
                    X