ForumSpark Support Themes & Extensions Join

Extended Footer

· 1 year ago · 1 reply · 38

This code adds a footer to your forum. You can edit the styling as you please. If you need help, don't hesitate to create a topic in the support forum.

Themes > Edit Layout > Copy & paste code at the bottom.

   <footer style="background-color: #f8f9fa; padding: 20px 0; border-top: 1px solid #ddd;">
  <div style="max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap;">

<!-- About Us Section -->
<div style="flex: 1 1 300px; padding: 10px;">
  <h3 style="font-size: 1.25rem; margin-bottom: 10px;">About Us</h3>
  <p style="font-size: 0.9rem; line-height: 1.5; color: #555;">
    Change this text to your community's vision, mission or information.
  </p>
</div>

<!-- Links Section 1 -->
<div style="flex: 1 1 150px; padding: 10px;">
  <h3 style="font-size: 1.25rem; margin-bottom: 10px;">Quick Links</h3>
  <ul style="list-style: none; padding: 0; font-size: 0.9rem; color: #555;">
    <li><a href="#" style="text-decoration: none; color: #007bff;">Home</a></li>
    <li><a href="#" style="text-decoration: none; color: #007bff;">Forums</a></li>
    <li><a href="#" style="text-decoration: none; color: #007bff;">Contact</a></li>
  </ul>
</div>

<!-- Links Section 2 -->
<div style="flex: 1 1 150px; padding: 10px;">
  <h3 style="font-size: 1.25rem; margin-bottom: 10px;">Resources</h3>
  <ul style="list-style: none; padding: 0; font-size: 0.9rem; color: #555;">
    <li><a href="#" style="text-decoration: none; color: #007bff;">Help Center</a></li>
    <li><a href="#" style="text-decoration: none; color: #007bff;">Terms of Service</a></li>
    <li><a href="#" style="text-decoration: none; color: #007bff;">Privacy Policy</a></li>
  </ul>
</div>

<!-- Logo Section -->
<div style="flex: 1 1 200px; text-align: center; padding: 10px;">
  <h3 style="font-size: 1.25rem; margin-bottom: 10px;">ForumSpark</h3>
  <div style="width: 100px; height: 100px; margin: 0 auto; background-color: #ddd; display: flex; align-items: center; justify-content: center; border-radius: 50%;">
    <span style="font-size: 0.9rem; color: #555;">Logo</span>
  </div>
</div>

  </div>
</footer>