Announcement

Collapse
No announcement yet.

New products and best sellers section

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
    #1

    New products and best sellers section

    HI, one my site i have on the bottom of my home page, a section showing best sellers and New Products.
    It currently looks scruffy as each item is boxed with a dotted line.
    See (www.onestopfoodsuk.com)
    I would like to put a nice border line around each box to tidy this up but dont know how.
    Has anyone done this before or know how to do it?

    Also i only want the boxes on my home page to show a photo, Product name and price without the product description, as some product descriptions are long and makes the boxes elongate and looks terrable. how can i make the boxes in this section on my home page only show this and not the description?

    Simon
    Tags: None
    #2
    Dotted Lines - use Firefow with the Firebug add-in. This shows you that the doted line is a style called dotted_outline_blue. You can change this style from:
    border 1px dotted #005555
    to:
    border 1px solid #005555

    Comment

      #3
      To only show Price, Image and Short Description - edit the layout. Go to Design view and click on the region you want to change then edit the layout and remove the bits you don't want. Remember to take a snapshot first.

      There are also forum posts about how to truncate the desciption.

      Comment

        #4
        worked a treat

        Originally posted by drounding View Post
        To only show Price, Image and Short Description - edit the layout. Go to Design view and click on the region you want to change then edit the layout and remove the bits you don't want. Remember to take a snapshot first.

        There are also forum posts about how to truncate the desciption.
        Thats great, worked a treat. Thanks for that.

        Comment

          #5
          Originally posted by drounding View Post
          Dotted Lines - use Firefow with the Firebug add-in. This shows you that the doted line is a style called dotted_outline_blue. You can change this style from:
          border 1px dotted #005555
          to:
          border 1px solid #005555
          I dont have Firefow and would not know how to use this.
          Is there another way to do this within actinic?

          Comment

            #6
            Go to Design View and select the Actinic Stylesheet as th Page Type. Search in there for the styling I mentioned earlier (dotted_outline_blue).

            Firebug allows you to see how the styling etc is applied and also to make on the fly changes to see the effects.

            Comment

              #7
              yes, simply edit actinic style sheet

              but for the future go and download firefox and then get the firebug extension - they are mandatory if you want to do design work within actinic - and they are free.

              Comment

                #8
                Originally posted by pinbrook View Post
                yes, simply edit actinic style sheet

                but for the future go and download firefox and then get the firebug extension - they are mandatory if you want to do design work within actinic - and they are free.
                OK will do that for future design stuff.

                I cant see in the code a part for the box borders for the new products.
                Below is the code if i click on the new products section in code edit.
                Do i change it somewere here or on the home page codes?
                If so were do i edit for the borders?

                <p class="text_product_small_info_heading"><actinic:variable name="ProductName" /></p>
                <div class="product_image_cost">
                <actinic:block if="%3cactinic%3avariable%20name%3d%22ProductImageFileName%22%20%2f%3e%20%21%3d%20%22%22">
                <a href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable Name="ProductID" />&amp;NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e">&amp;SHOP=<actinic:variable name="ShopID" /></actinic:block>">
                <img style="border: 0;" src="<actinic:variable name="ProductImageFileName" />" width="75" alt="<actinic:variable name="ProductName" encoding="strip"/>" />
                </a>
                </actinic:block>
                </div>
                <div>
                <p class="text_product_small_info_price">
                <Actinic:PRICES PROD_REF="<actinic:variable Name="ProductID" />" RETAIL_PRICE_PROMPT="<Actinic:Variable Name="ProductPriceDescription"/>">
                <actinic:variable value="Marketing Price List" name="PriceListRetail" />
                </Actinic:PRICES>
                </p>
                <p class="text_product_small_info"><br>
                <a href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable Name="ProductID" />&amp;NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e">&amp;SHOP=<actinic:variable name="ShopID" /></actinic:block>">find out more</a></p>
                </div>

                Comment

                  #9
                  You're looking in the wrong place.
                  In Design View select the (combobox) Page Type to be Actinic Stylesheet.

                  See attached image for reference.
                  Attached Files

                  Comment

                    #10
                    Originally posted by drounding View Post
                    You're looking in the wrong place.
                    In Design View select the (combobox) Page Type to be Actinic Stylesheet.

                    See attached image for reference.
                    Excellent, got it thanks so much, it worked

                    Thanks for your help.
                    Simon

                    Comment

                    Previous template Next
                    Working...
                    X