Experienced Only for this one. lol

[iguanairs]

Hello,

I am attempting to make my store mimic the appearance of my current forums. I have a completely custom look that I applied to my forums, and now want to implement the same style look to my Storefront. The thing is, this program is COMPLETELY different from my forum code. lol

 

This is what I want my store to look simalar too. I know I am asking a lot, but how would I go about doing this without having to write all custom pages?

 

I know I could create an independant homepage, but navigation through the site would remove my custom look unless I chose to rewrite EVERY page. I would like to avoid that and possibly have this look as the "theme" for my site.

 

Here is my forum site:

 

http://www.herpcenter.com

 

As you will tell from the site, I deal with reptiles and their husbandry. The store is going to sell husbandry equipment. Is this look possible and what am I looking at in regards to customizations?

[♥toyicebear]

Nice forum site.... B)

 

Its not to difficult to mimic this look for your osc shop.

 

You can do it by using the STS Template system from the contribs section, this will allow you to edit your whole sites look from one html template page.

 

But be aware this gives extra load time for your webpages and makes later adding of some of the other contributions more complicated.

 

You can do it manually and to help you on your way do the following....

 

start with the colors - adjust them to match your forum site in stylesheet.css

 

then the box heading - make corner_left.gif and corner_right.gif in the same look as in the forum and make corner_right_left.gif as a 2px wide cut out from the center of the header.

 

now add these gifs to images/infobox

 

in stylsheet.css change infoxheader to this:

 

TD.infoBoxHeading {
 font-family: Verdana, Arial, sans-serif;
 font-size: 10px;
 font-weight: bold;
 background-image: url("images/infobox/corner_right_left.gif");
 color: #000000;
}

 

 

next edit all your boxes to this setting:

 

new infoBoxHeading($info_box_contents, true, true);

 

then go to includes/classes/boxes.php file and edit this:

 

class contentBoxHeading extends tableBox {
   function contentBoxHeading($contents) {
     $this->table_width = '100%';
     $this->table_cellpadding = '0';

     $info_box_contents = array();
     $info_box_contents[] = array(array('params' => 'height="14" class="infoBoxHeading"',
                                        'text' => tep_image(DIR_WS_IMAGES . 'infobox/corner_left.gif')),
                                  array('params' => 'height="14" class="infoBoxHeading" width="100%"',
                                        'text' => $contents[0]['text']),
                                  array('params' => 'height="14" class="infoBoxHeading"',
                                        'text' => tep_image(DIR_WS_IMAGES . 'infobox/corner_right_left.gif')));

     $this->tableBox($info_box_contents, true);
   }
 }

 

To This:

 

class contentBoxHeading extends tableBox {
   function contentBoxHeading($contents) {
     $this->table_width = '100%';
     $this->table_cellpadding = '0';

     $info_box_contents = array();
     $info_box_contents[] = array(array('params' => 'height="14" class="infoBoxHeading"',
                                        'text' => tep_image(DIR_WS_IMAGES . 'infobox/corner_left.gif')),
                                  array('params' => 'height="14" class="infoBoxHeading" width="100%"',
                                        'text' => $contents[0]['text']),
                                  array('params' => 'height="14" class="infoBoxHeading"',
                                        'text' => tep_image(DIR_WS_IMAGES . 'infobox/corner_right.gif')));

     $this->tableBox($info_box_contents, true);
   }
 }

 

 

Now all your side boxes and content boxes will have a simular look to that of your forum.

 

Then its mostly a mather of setting up your outside background and your header and footer looks, which can be done by edition includes/header.php , includes/footer.php and stylesheet.css

[Guest]

uummm....what Nick said :)

[iguanairs]

uummm....what Nick said :)

<{POST_SNAPBACK}>

 

Hello,

Thanks Nick. I will give that a whirl. All of the modifications to my forum were done manually, so adding contributions later on will be ok. I can work that out as I require it.

 

I will give the sts system a go later on. I have work in a few, so I don't have the time now. I will let you know how it goes. I will also look into the page load times. I am sure that some people have already done so, but if they are that critical, there is always a way to help reduce queries, which of course, helps increase the speed of load times. I will see what I can come up with after playing with this. :D

[iguanairs]

Hello,

Nick, you are a savior bro! lol I had made the edits you requested with the exception of the boxes.php, but couldn't figure out how to get both corners to appear. It worked like a charm. (I used the manual edits btw. I prefer those over adding unneeded code.)

 

Now comes my next quetion. I want to set the "Page" width to 97%. This will expose some of the background, similar to my forum.

When I tried adding my header and footer code, it didn't set the pages width. So they were smaller, where as the page was still set at 100%.

Is it possible to set the page width via some additions to the CSS? I have never tried to do that before. That would really be nice.

(What would be nice is a control in the admin cp that allows us to set the "page" width to a % to reveal the "background" around it. :) )

 

Did I mention how much I appreciate the support I have gotten from this site, and in particular, Nick? If not, I want to express that now.

[♥toyicebear]

Hello,

? ? ? ? Nick, you are a savior bro! lol I had made the edits you requested with the exception of the boxes.php, but couldn't figure out how to get both corners to appear. It worked like a charm. (I used the manual edits btw. I prefer those over adding unneeded code.)

 

? ? ? ?  Now comes my next quetion. I want to set the "Page" width to 97%. This will expose some of the background, similar to my forum.

? ? ? ? ? When I tried adding my header and footer code, it didn't set the pages width. So they were smaller, where as the page was still set at 100%.

? ? ? ? ? Is it possible to set the page width via some additions to the CSS? I have never tried to do that before. That would really be nice.

? ? ? ? ? (What would be nice is a control in the admin cp that allows us to set the "page" width to a % to reveal the "background" around it. :) )

 

? ? ? ? ? Did I mention how much I appreciate the support I have gotten from this site, and in particular, Nick? If not, I want to express that now.

<{POST_SNAPBACK}>

 

This contrib. lets you set page width, border color background color osv. from admin. osC-CenterShop v2.1 for MS2

 

or this one, simpler and more elegant solution controlled from the stylsheet....

 

Fixed Width Site with CSS