Want to add a border to products

Questions and answers about ShopSite Custom Templates

Want to add a border to products

Postby gracefuli » Sun Jul 27, 2014 11:34 am

Hi folks- am looking to use the Base format template, but want to add a thin border around each product. Probably in a blue # 6292E4

Thanks
Ilene
gracefuli
 
Posts: 58
Joined: Thu Aug 02, 2007 7:27 pm

Re: Want to add a border to products

Postby Jim » Mon Jul 28, 2014 8:23 am

What theme/template are you using?
There is an option on the Pages > Edit Page Layout called Column Borders , check that option on the pages your products are on and see if that adds the borders on the products.
.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: Want to add a border to products

Postby gracefuli » Mon Jul 28, 2014 2:45 pm

Nope- didn't do it.
- Am using "base format" "friendly" theme.
- Also am using navigation to set left hand menu. would like the selections to be closer together on the list. They seem to have a lot of space between lines (like 2 lines spacing)
need to edit template?

thanks for your help!
grace
gracefuli
 
Posts: 58
Joined: Thu Aug 02, 2007 7:27 pm

Re: Want to add a border to products

Postby Jim » Mon Jul 28, 2014 4:07 pm

How many columns of products do you have. This is set on the Pages > Edit Page Layout screen.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: Want to add a border to products

Postby Jim » Tue Jul 29, 2014 10:21 am

To add the border you will need to edit the 3Column.sst page template.
Look in the template for the LOOP PRODUCTS tag and the line you need to edit is just above it as in this code
Code: Select all
<table cellpadding="0" cellspacing="10" border="0" width="100%" class="[-- VAR.PageColumns --]">
[-- LOOP PRODUCTS VAR.PageColumns --]

Change the border="0" to border="1".


The spacing of the links in the left column (and right column) is controlled by css coming from the Publish file 3Column_Basics.css in these lines
Code: Select all
 #left div.left_pagelinks, #right div.right_pagelinks {padding-bottom: 14px;}

 #left h2, #right h2, #right a.mini-txt, #left a.left_pagetitle, #right a.right_pagetitle {margin: 0px; padding: 10px 10px 5px 10px;}

You will need to change the padding-bottom and padding values so that the spacing is to your liking.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: Want to add a border to products

Postby gracefuli » Tue Jul 29, 2014 12:48 pm

Thank you-
1. I did add the border value to equal 1. It appears as a 2 line frame. With a slightly thicker and inner thinner line. in black.

2. Am hesitant to edit the Publish file. I am a user, not a programming pro, so am afraid to mess things up. On the page template I copied the original file and gave it a new name. This is what I edited, so I could always just go back to the original. I can copy the publish file, and edit the copy but how do I then get the site to use this "adapted" file?
gracefuli
 
Posts: 58
Joined: Thu Aug 02, 2007 7:27 pm

Re: Want to add a border to products

Postby Jim » Tue Jul 29, 2014 1:11 pm

The file that you copy and edit will be used if you give it the exact same name as the ShopSite file. You can't give the file the same name when you originally make the copy from the ShopSite file but you will be able to give it that name after you have made your edits. ( I typically just add a 1 to the end of the ShopSite file name and then when I copy it the second time I just remove the 1.) If your edit doesn't work all you have to do is delete the modified file and the ShopSite one will again be used.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: Want to add a border to products

Postby Jim » Tue Jul 29, 2014 1:14 pm

As for the double line I couldn't find a way to get around that. For the color you could just add a border-color to the same line of code where you changed the 0 to 1. See http://www.w3schools.com/css/css_border.asp for help with using a border style.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: Want to add a border to products

Postby gracefuli » Tue Jul 29, 2014 3:50 pm

ok- i'll try both ideas...
1. ?when i was browsing the page template, i did notice some language that did mention store catagories? can the spacing be adfjusted here?
2. In the past i thought i read that in coding the <h2> </h2> tag automatically then inserts a blank line the same size as the <h2>? would changing to a font size change that instead of adjusting padding #'s (that i really know nothing about!)

thanks- will spend some time at the site you referenced.
grace
gracefuli
 
Posts: 58
Joined: Thu Aug 02, 2007 7:27 pm

Re: Want to add a border to products

Postby Jim » Tue Jul 29, 2014 7:53 pm

1. I would need to know exactly where you see the "store catagories" to know if the spacing could be adjusted there. More than likely that would NOT be a place that it could be done since it is dealing with the Left Links and not any type of store categories.

2. Yes "<h2> </h2>" would insert a single space character that is the height of what <h2> is is assigned to be. It may not form a blank line though unless there is a <br> or <p> tag adjacent to it.

Padding is just extra space defined as px (pixels) or pt (points) or % or the space available that is added to the Left, Right, Top or Bottom of the element that it is assigned to. You can assign padding to any or all of those locations. padding="10px"; would put 10pixels of space on all sides of something. padding-bottom 10px; would just put extra space under the element. It really isn't as hard to figure out as you are making it.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: Want to add a border to products

Postby gracefuli » Wed Jul 30, 2014 5:05 am

Cool- I will be brave and try all you suggested! It may take a day or 2 for me to get to try it though. thanks for all your help - will eventually get back to you.
gracefuli
 
Posts: 58
Joined: Thu Aug 02, 2007 7:27 pm

Re: Want to add a border to products

Postby gracefuli » Tue Aug 05, 2014 5:12 pm

ok- i have tried several things. Here is a page i am working on:
http://216.92.220.67/SpecialtyWritingPapersandHandwritingPrograms.htm

here is my wish list:
1. i want product pic's to be in the top left corner of square
2. i want text to go on the left of pic without text wrapping around pic
3. want qty and add to cart to be r aligned, but in the same line or just under text line.

have given up left menu spacing will re-think it all...

thanks-
grace
gracefuli
 
Posts: 58
Joined: Thu Aug 02, 2007 7:27 pm

Re: Want to add a border to products

Postby gracefuli » Tue Aug 05, 2014 5:46 pm

Forgot to say:
Using dynamic-products.sst as product template
3 column as page template
gracefuli
 
Posts: 58
Joined: Thu Aug 02, 2007 7:27 pm

Re: Want to add a border to products

Postby Jim » Tue Aug 05, 2014 7:35 pm

There will be problems if you use the page template from one theme and the product template from a different theme. They will use different variables (VAR.xyz etc) to set parameters used by other templates in the theme and if the VARs are different then different style sheets, javascript, include files will be used.

I would strongly recommend using the corresponding page and product templates from a single theme. It may be possible to mix two different theme templates but it will require editing many files to make sure that the appropriate include files, VARs etc are changed so they will work together.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: Want to add a border to products

Postby Jim » Tue Aug 05, 2014 7:59 pm

1. i want product pic's to be in the top left corner of square
2. i want text to go on the left of pic without text wrapping around pic
3. want qty and add to cart to be r aligned, but in the same line or just under text line.


I don't understand what you are asking for.
1. How are you going to have the picture on the left but also have the text to the left of the picture?
2. What do you mean by "top left corner of SQUARE"? Do you mean the box defined by the line around the product?
3. Where does the product name go?

Can you design the layout that you want in an html editing program so we can see what you are meaning?
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Next

Return to Custom Template Questions

Who is online

Users browsing this forum: No registered users and 19 guests

cron