---
title: "Removing the branding from the osCommerce footer"
description: "After you get the background styles and the #bodyWrapper styles setup the way you need it. you can set up your Footer styles to match them. The image to the right shows what the osCommerce site looks..."
url: https://www.inmotionhosting.com/support/edu/oscommerce/removing-the-branding-from-the-oscommerce-footer/
date: 2013-04-22
modified: 2021-08-16
author: "InMotion Hosting Contributor"
categories: ["OsCommerce"]
type: post
lang: en
---

# Removing the branding from the osCommerce footer

[![Default footer osCommerce](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-1-default.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-1-default.png)

After you get the [background styles](/support/edu/oscommerce/change-background-image-os/) and the *[#bodyWrapper](/support/edu/oscommerce/changing-the-content-background-style-in-oscommerce/)* styles setup the way you need it. you can set up your Footer styles to match them. The image to the right shows what the osCommerce site looks like with the background and *#bodyWrapper* styled for the “*Sunny*” osCommerce theme.

The footer by default has the osCommerce image displayed in the footer. This article will teach you how to style the footer and remove the branding from your osCommerce site. Below are the steps on how to do this.

## Create a footer.png image

[![Footer image osCommerce](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_footer.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_footer.png)

In this tutorial, we will need a footer image to match the header and background images in the “*Sunny*” Theme. The image we will use in this tutorial is the one to the right. The image was designed to repeat across the bottom of the page. Once you get your footer image created, follow the steps below to get the footer to display at the bottom of your osCommerce website.

## Steps to edit the footer

1. [Login into your cPanel](/support/edu/cpanel/how-to-log-into-cpanel/).
2. [Go to the File Manager](/support/edu/cpanel/using-file-manager-in-cpanel/). **Select** your osCommerce installation directory and click **Go**.
3. [![Upload footer image osCommerce](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_osCommerce_upload_footer.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_osCommerce_upload_footer.png) **[Upload](/support/website/how-to-edit-a-file/)** your *footer.png* image to the images folder in your directory for your osCommerce site.
4. [![Edit the footer.php osCommerce](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_osCommerce_edit_stylesheet.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_osCommerce_edit_stylesheet.png) **[Edit](/support/edu/cpanel/file-manager-code-editor/)** the following file with the code editor. includes/footer.php
5. [![text](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-4-comment-code.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-4-comment-code.png) **[Comment](/support/website/comment-php-javascript-html-css-code/)** lines 22 to 38 and delete the *grid_24* class from the the footer div on line 17. [![Code view of changes osCommerce](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-5-code-view.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-5-code-view.png) The code should look like the snapshot to the right.

[![Footer CSS osCommerce](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-6-css.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-6-css.png)

Now **edit** the *stylesheet.css* in the installation directory of your osCommerce site.

Add the following lines in the stylesheet.css:

.footer { color: #ffffff; height: 119px; margin: 20px 0px 0px 0px; padding:10px 0px 0px 0px; background: repeat-x bottom url('images/footer.png') #fff8e5; } .footer p a{ color: #ffffff; padding:0px; margin:0px; }
**Save** the changes.

[![Final view with edited footer osCommerce](https://www.inmotionhosting.com/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-7-final.png)](/support/wp-content/uploads/2013/04/edu_oscommerce_201_edit-footer_edit-footer-7-final.png)

Now if you go to your site you will see the footer like the snapshot to the right.