Django Recipe Sharing Tutorial – 4. Footer

Welcome to the fourth installment of our Django Recipe Sharing Tutorial series. In this tutorial, we will discuss how to create a footer for our recipe sharing website using HTML and CSS.

Creating the Footer

To create a footer for our website, we’ll start by adding a new <footer> tag in our HTML document. This tag will contain information that we want to display at the bottom of every page on our website. For example, we could include copyright information, links to social media profiles, or a brief about section.

HTML Structure

Here’s an example of how we might structure our footer:

        
          <footer>
            <div id="footer-content">
              <p>Copyright © 2021 Recipe Sharing Website</p>
              <p>Follow us on <a href="https://www.facebook.com/recipesharing">Facebook</a> and <a href="https://www.instagram.com/recipesharing">Instagram</a></p>
            </div>
          </footer>
        
      

CSS Styling

After adding the HTML structure for our footer, we can use CSS to style it and make it visually appealing. We can set the background color, text color, and add padding to create some space between the footer content and the edge of the page.

        
          /* CSS for the footer */
          #footer-content {
            background-color: #333;
            color: #fff;
            padding: 20px;
            text-align: center;
          }
        
      

Conclusion

By following these simple steps, you can easily create a footer for your Django recipe sharing website. The footer is an important element of a website as it provides important information and links for the users. It also helps to improve the overall user experience and make the website look more professional.