Dreamweaver DIY – Footers

This DIY is all about adding footers. Not only are they aesthetically pleasing, but, they are another way to separate information on your site.

Step 1: The basics

The image below shows the bare bones to add to your HTML code. These tags will house all of the information you want to add.


As you begin to enter text, it shows up at the very bottom of the page. If you hover over the live image in the split section, the blue box reading “footer” will show up.


Step 2: When you are content with your text, you can add a variety of things to your CSS file until you are happy with how it looks.


Step 3: Love your website and your new footer! The image below is my practice website sceenshot where I added the footer.



*Footers don’t always need to go at the bottom of the page! You can add them within any element (div, article, etc.) in your HTML file*



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s