→ Alex Morgan
→ Modern eCommerce Footer with Multiple Se...

Modern eCommerce Footer with Multiple Sections

This Example is contributed by Alex Morgan, on 17-Mar-2025. It is responsive. similar terms for this example is Email campaign

Footer eCommerce Newsletter Payment

Author Alex Morgan

Fork Fullscreen

<footer class="footer">
  <div class="footer-container">
    <div class="footer-top">
      <div class="footer-section company-info">
        <h3>Shopwise</h3>
        <p>The ultimate shopping destination for all your needs. Quality products, exceptional service.</p>
        <div class="contact-info">
          <div class="contact-item">
            <i class="icon-location"></i>
            <span>123 Commerce St, New York, NY 10001</span>
          </div>
          <div class="contact-item">
            <i class="icon-phone"></i>
            <span>+1 (555) 123-4567</span>
          </div>
          <div class="contact-item">
            <i class="icon-email"></i>
            <span>support@shopwise.com</span>
          </div>
        </div>
      </div>

<div class="footer-section">
        <h4>My Account</h4>
        <ul class="footer-links">
          <li><a href="#">My Profile</a></li>
          <li><a href="#">Order History</a></li>
          <li><a href="#">Wishlist</a></li>
          <li><a href="#">Shopping Cart</a></li>
          <li><a href="#">Returns</a></li>
        </ul>
      </div>

<div class="footer-section">
        <h4>Categories</h4>
        <ul class="footer-links">
          <li><a href="#">Electronics</a></li>
          <li><a href="#">Clothing</a></li>
          <li><a href="#">Home & Kitchen</a></li>
          <li><a href="#">Beauty & Health</a></li>
          <li><a href="#">Sports & Outdoors</a></li>
        </ul>
      </div>

<div class="footer-section">
        <h4>Help Center</h4>
        <ul class="footer-links">
          <li><a href="#">FAQs</a></li>
          <li><a href="#">Shipping Policy</a></li>
          <li><a href="#">Return Policy</a></li>
          <li><a href="#">Privacy Policy</a></li>
          <li><a href="#">Terms & Conditions</a></li>
        </ul>
      </div>

<div class="footer-section newsletter">
        <h4>Newsletter</h4>
        <p>Subscribe to our newsletter for updates and promotions.</p>
        <form class="subscribe-form">
          <input type="email" placeholder="Your email address" required>
          <button type="submit">Subscribe</button>
        </form>
      </div>
    </div>

<div class="footer-middle">
      <div class="social-container">
        <h4>Follow Us</h4>
        <div class="social-icons">
          <a href="#" class="social-icon"><i class="icon-facebook"></i></a>
          <a href="#" class="social-icon"><i class="icon-twitter"></i></a>
          <a href="#" class="social-icon"><i class="icon-instagram"></i></a>
          <a href="#" class="social-icon"><i class="icon-pinterest"></i></a>
          <a href="#" class="social-icon"><i class="icon-youtube"></i></a>
        </div>
      </div>

<div class="payment-container">
        <h4>We Accept</h4>
        <div class="payment-icons">
          <img src="https://via.placeholder.com/40x25" alt="Visa">
          <img src="https://via.placeholder.com/40x25" alt="Mastercard">
          <img src="https://via.placeholder.com/40x25" alt="American Express">
          <img src="https://via.placeholder.com/40x25" alt="PayPal">
          <img src="https://via.placeholder.com/40x25" alt="Apple Pay">
        </div>
      </div>

<div class="app-container">
        <h4>Download Our App</h4>
        <div class="app-buttons">
          <a href="#" class="app-button">
            <img src="https://via.placeholder.com/120x40" alt="App Store">
          </a>
          <a href="#" class="app-button">
            <img src="https://via.placeholder.com/120x40" alt="Google Play">
          </a>
        </div>
      </div>
    </div>
  </div>

<div class="footer-bottom">
    <div class="footer-container">
      <p>&copy; 2023 Shopwise. All rights reserved.</p>
      <div class="additional-links">
        <a href="#">Sitemap</a>
        <a href="#">Careers</a>
        <a href="#">Press</a>
        <a href="#">Affiliates</a>
      </div>
    </div>
  </div>
</footer>

Related Examples

Modern Multi-Column Responsive Website Footer
A fully responsive footer component with multi-column layout featuring company information, navigation links, subscription form, and social media integration.

Author:
Bishnu Thapa

10 months ago
Footer with App Download Buttons and Branding
A professional website footer featuring app download buttons, brand logo, sitemap links, and social media connections for enhanced user engagement.

Author:
Janna Pineda

10 months ago
Responsive Social Media Footer for Websites

Author:
Melissa Chen

8 months ago
Website Footer with Rich Background Design

Author:
Anonymous

9 months ago
Responsive Footer with Social Media Links
A fully responsive footer design that adapts beautifully to all screen sizes, featuring multiple columns of content, social media links, and a newsletter signup form.

Author:
Morgan Reynolds

9 months ago
CSS footer

Author:
Anonymous

8 months ago
Minimalist Modern Footer Design

Author:
Anonymous

10 months ago
Dark Horizontal Footer with Brand Logo and Social Links
A horizontal footer with dark color scheme featuring a brand logo, navigation links, and social media icons for website completion.

Author:
Anonymous

8 months ago
Footer Subscription Form with Contact Details

Author:
Alisha Patel

10 months ago
Responsive Footer with Multi-Column Layout
A clean, responsive footer design with multiple columns for navigation, contact information, and social media links that adapts beautifully to all screen sizes.

Author:
Bishnu Thapa

10 months ago
Multi-Column Footer with Image Gallery and Social Links

Author:
Aiden Mercer

9 months ago
Dark Footer with Newsletter Subscription
A sleek dark-themed footer component featuring a newsletter subscription form, brand logo, and essential site links. Perfect for engaging users and capturing leads.

Author:
M. Johnson

11 months ago

Didn't find component you were looking for?

Search from 500+ components