Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

changing colors


punkit07

Recommended Posts

how do i make and set one big large banner which covers the whole top of the website? Also how do i change colors on my website?

 

Hi! Part 1: catalog/includes/header.php BACK-UP or Make a NEW file called INDEX2.PHP to experiment with. Find this section:

 

?>

<table border="0" width="100%" cellspacing="0" cellpadding="0">

<tr class="header">

<td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'oscommerce.gif', 'osCommerce') . '</a>'; ?></td>

<td align="right" valign="bottom"><?php echo '<a href="' . tep_href_link(FILENAME_ACCOUNT, '', 'SSL') . '">' . tep_image(DIR_WS_IMAGES . 'header_account.gif', HEADER_TITLE_MY_ACCOUNT) . '</a>  <a href="' . tep_href_link(FILENAME_SHOPPING_CART) . '">' . tep_image(DIR_WS_IMAGES . 'header_cart.gif', HEADER_TITLE_CART_CONTENTS) . '</a>  <a href="' . tep_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL') . '">' . tep_image(DIR_WS_IMAGES . 'header_checkout.gif', HEADER_TITLE_CHECKOUT) . '</a>'; ?>  </td>

</tr>

</table>

<table border="0" width="100%" cellspacing="0" cellpadding="1">

<tr class="headerNavigation">

 

AND... CHANGE to something like this: WARNING!!! This will also remove all icon images from the Top! i.e. Account, Shopping Cart, Check Out.

 

?>

<table border="0" width="100%" cellspacing="0" cellpadding="1">

<tr class="header">

<td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'YOUR_ BANNER.gif','YOUR TEXT HERE') .

'</a>'; ?></td>

</tr>

</table>

<table border="0" width="100%" cellspacing="0" cellpadding="1">

<tr class="headerNavigation">

 

You need to upload your image and change the above call to it's name.

 

Part 2: catalog/stylesheet.css See the Knowledge Base for hints regarding color and style by area definition. http://www.oscommerce.info/kb/osCommerce/C...n_and_Layout/54

 

Most of the information you will need, can be found in the Knowledge Base or by simple searches of the forum. Hope this helps you and anyone else that may need it. :rolleyes:

We help each other, to help ourselves!

Aloha Allison!

 

Liken to wrinkles, the many paths of my life not only altered my destiny, but my appearance.

 

Poetry, the artistry of plying ones soul to the empty canvases of life. A vision without sight. A verse without darkness. Lighting each day with a prose of beauty and love.

Link to comment
Share on other sites

Hi! Part 1: catalog/includes/header.php BACK-UP or Make a NEW file called INDEX2.PHP to experiment with. Find this section:

 

?>

<table border="0" width="100%" cellspacing="0" cellpadding="0">

  <tr class="header">

    <td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'oscommerce.gif', 'osCommerce') . '</a>'; ?></td>

    <td align="right" valign="bottom"><?php echo '<a href="' . tep_href_link(FILENAME_ACCOUNT, '', 'SSL') . '">' . tep_image(DIR_WS_IMAGES . 'header_account.gif', HEADER_TITLE_MY_ACCOUNT) . '</a>  <a href="' . tep_href_link(FILENAME_SHOPPING_CART) . '">' . tep_image(DIR_WS_IMAGES . 'header_cart.gif', HEADER_TITLE_CART_CONTENTS) . '</a>  <a href="' . tep_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL') . '">' . tep_image(DIR_WS_IMAGES . 'header_checkout.gif', HEADER_TITLE_CHECKOUT) . '</a>'; ?>  </td>

  </tr>

</table>

<table border="0" width="100%" cellspacing="0" cellpadding="1">

  <tr class="headerNavigation">

 

AND... CHANGE to something like this: WARNING!!! This will also remove all icon images from the Top! i.e. Account, Shopping Cart, Check Out.

 

?>

<table border="0" width="100%" cellspacing="0" cellpadding="1">

  <tr class="header">

    <td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'YOUR_ BANNER.gif','YOUR TEXT HERE') .

'</a>'; ?></td>

  </tr>

</table>

<table border="0" width="100%" cellspacing="0" cellpadding="1">

  <tr class="headerNavigation">

 

You need to upload your image and change the above call to it's name.

 

Part 2: catalog/stylesheet.css See the Knowledge Base for hints regarding color and style by area definition. http://www.oscommerce.info/kb/osCommerce/C...n_and_Layout/54

 

Most of the information you will need, can be found in the Knowledge Base or by simple searches of the forum. Hope this helps you and anyone else that may need it.  :rolleyes:

 

what if i don't want to get rid of the checkout, account, etc?

Link to comment
Share on other sites

what if i don't want to get rid of the checkout, account, etc?

 

Actually, the images are redundant of the same info in the navigation bar below them. But, your request was to place a full size banner in the total space of your header. If I misunderstood you, my appologies. Perhaps you could figure out a way to place your full size banner in the background somehow. Good luck! :rolleyes:

We help each other, to help ourselves!

Aloha Allison!

 

Liken to wrinkles, the many paths of my life not only altered my destiny, but my appearance.

 

Poetry, the artistry of plying ones soul to the empty canvases of life. A vision without sight. A verse without darkness. Lighting each day with a prose of beauty and love.

Link to comment
Share on other sites

Actually, the images are redundant of the same info in the navigation bar below them. But, your request was to place a full size banner in the total space of your header. If I misunderstood you, my appologies. Perhaps you could figure out a way to place your full size banner in the background somehow. Good luck!  :rolleyes:

 

ok. I tried the code, but it is still in the left corner. I need it to be centered.

Link to comment
Share on other sites

ok. I tried the code, but it is still in the left corner. I need it to be centered.

 

in your header.php file there is a part that names your banner.

Part of it says ::

<td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'oscommerce.gif', 'osCommerce')

i changed it too:

<td align="right" valign="middle" width="650px"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'oscommerce.gif', 'osCommerce')

you can adjust the width to whatever you want, The bits underlined are the bits you need to add. you can adjust the width numbers to what you want.

I hope that helps you some.

Link to comment
Share on other sites

in your header.php file there is a part that names your banner.

Part of it says ::

<td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'oscommerce.gif', 'osCommerce')

i changed it too:

<td align="right" valign="middle" width="650px"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'oscommerce.gif', 'osCommerce')

you can adjust the width to whatever you want, The bits underlined are the bits you need to add.  you can adjust the width numbers to what you want.

I hope that helps you some.

 

ok...it worked. How do I add another picture nxt to it

Link to comment
Share on other sites

Glad it worked, i dont know how to add another picture next to it, but i will watch this post and see if anyone can help as i am interested in that myself.

 

Hi! Well, it's really simple. You solved the first part relating to one large image, but now you would like two! Here is what I did. The first image links to our ABOUT US page by changing (FILENAME_DEFAULT) to ABOUT_US. The second image is a Java Script for 'what is' PayPal.

 

<table border="0" width="100%" cellspacing="0" cellpadding="1">

<tr class="header">

<td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_DEFAULT) . '">' . tep_image(DIR_WS_IMAGES . 'YOUR PICTURE #1.gif','YOUR ALT / CAPTION HERE') .

'</a>'; ?></td>

<td align="right" valign="middle"><A onclick="java script:window.open('https://www.paypal.com/us/cgi-bin/webscr?cmd=xpt/popup/OLCWhatIsPayPal-outside','olcwhatispaypal','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no', width='400', height='350');"><img alt="We Accept All Major Credit Cards through PayPal. No Paypal Account Required. We also gladly accept Personal Checks or Money Orders!" src="images/CREDIT_CARD.gif"></td>

</tr>

</table>

 

ALTERNATIVE #2 - 2 linked images to different pages in your site

 

<table border="0" width="100%" cellspacing="0" cellpadding="1">

<tr class="header">

<td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_CHANGE TO ANOTHER PAGE) . '">' . tep_image(DIR_WS_IMAGES . 'YOUR PICTURE #1.gif','YOUR ALT TEXT - OR BLANK') .

'</a>'; ?></td>

<td align="right" valign="middle"><a href="' . tep_href_link ">(FILENAME_CHANGE TO ANOTHER PAGE) . '">' . tep_image(DIR_WS_IMAGES . 'YOUR PICTURE #2.gif','YOUR ALT TEXT - OR BLANK') .

'</a>'</td>

</tr>

</table>

 

ALTERNATIVE #3 - 1 Picture linked into your site, and second Picture linked outside your site. At least this is the way I understand it.

 

<table border="0" width="100%" cellspacing="0" cellpadding="1">

<tr class="header">

<td valign="middle"><?php echo '<a href="' . tep_href_link(FILENAME_CHANGE TO ANOTHER PAGE) . '">' . tep_image(DIR_WS_IMAGES . 'YOUR PICTURE #1.gif','YOUR ALT TEXT - OR BLANK') .

'</a>'; ?></td>

<td align="right" valign="middle"><a href="http://www.someweb.com"><img alt="YOUR TEXT HERE" src="images/PICTURE #2.gif">

</a></td>

</tr>

</table>

 

You can take a look at THEM on our site if you like. Hope this helped you in some way. :rolleyes:

 

Our Live Shoppe

We help each other, to help ourselves!

Aloha Allison!

 

Liken to wrinkles, the many paths of my life not only altered my destiny, but my appearance.

 

Poetry, the artistry of plying ones soul to the empty canvases of life. A vision without sight. A verse without darkness. Lighting each day with a prose of beauty and love.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...