Out of the box, Thesis 2 has a footer that contains the 2 links as shown in the picture above. The top line is called the Thesis 2 attribution. You probably want to put your own text in the footer so we’re going to remove the Thesis 2 attribution and WordPress admin links, and replace them with our own statements. In Step 25 we learned how to change the color of the footer background. You probably noticed that after our color change the text became hard to read. I knew we would eventually remove the Thesis 2 attribution so this is why we didn’t worry about the color of the text in Step 25. We’ll make the appropriate changes in this step to make sure we can read our new footer text.
To remove the Thesis 2 attribution, navigate to the Thesis 2 Skin Editor HTML Home page.
Scroll down to the “Footer” section and click the black arrow on the right to expand it.
Notice the two dark boxes, “Thesis Attribution” and “WP Admin Link”. To remove the Thesis attribution, all we need to do is shift-click, and drag these two boxes out of the Footer and over to the “drag boxes here to remove them from the page” box. Be sure to “drop” them on the label as shown in the example below. The label will turn a brighter yellow indicating that it is OK to drop the box there.
After you finish this, you can click the green “Save Template” button to make the changes live on your site. If you go to your home page and click refresh, you’ll see that the footer is very small and the text links (Thesis 2 attribution and WP-Admin) are gone.
Now we can add our own text to the footer. To do this we will need to use the Thesis 2 “Add Boxes” function. At the bottom right of the page you will see a box called “Add Boxes” (see picture below). Click the drop-down and select “Text Box”.
After you select “Text Box” you will be asked to give the box a name (see New Box Name below). While it is optional, I like to name my boxes. After you give it a name, click the blue “Add Box” button.
You will now see a blue box called “Custom Footer”, or whatever you named your box.
Shift-click and drag this box over top of the Footer box on the left side of the screen. Drop it on the “Footer” label. It will turn brighter yellow to indicate you can drop the object there. You will now have an HTML Text box we can use for adding our custom footer text. Move your cursor over the Custom Footer blue box and a gear will display. Click the gear symbol to open a pop-up where we can enter our text.
Enter your custom text i nthe “Text/HTML” box. For now I’m just adding a copyright statement. You can place any HTML in here that you want. When you’re done, click the “X” at the top right to close this box. Click the green “Save Template” button to save your changes.
Refresh your home page in your browser. Again, you will notice that the text we entered is still hard to read. We’ll fix this now.
We are done with the Thesis 2 HTML page. Go to the Thesis 2 Skin Editor CSS page. Here we will fix the footer text so that we can read it. Click on the Footer CSS Package.
Change the Text Color to white (hex “ffffff”). This will make the new footer text stand out against our new background color. Click the green “Save” button then click the green “Save CSS” button.
Refresh your browser on your home page and your footer should now look something like the picture below.
However, notice that the footer rests right on top of the browser. I like to see a little space between the footer and the bottom of the browser. You will notice that the header is already displayed this way. Open the Footer CSS Package up again by clicking on it. Scroll down until you see “Bottom Margin”. I used 20 for my desired value. This will move the footer up 20px (pixels) from the bottom of the browser.
Click the green “Save” button then click the green “Save CSS” button. Refresh your browser on your home page and you will now see some space between the footer and the bottom of the browser. This is much more pleasing to the eye.