Modern Footer Extension (Responsive & Compatible)

Capybara

huseyinfiliz Hello again. I don’t usually write things like this, but I want to say that you’ve created a very useful extension. It seems to me that it has a chance to make it to the 1st or 2nd page of the most popular Flarum extensions if it stays free. I would definitely buy your future extensions, seeing how well you work 🚀

huseyinfiliz

Capybara hello! Thank you so much for your kind words and encouragement. I’m really glad to hear that you find the extension useful! Your support means a lot, and it motivates me to keep improving and creating. I’ll do my best to live up to your expectations, and who knows, maybe we’ll see it on those pages soon! 🚀

To be honest, I’m currently spending more than 5 hours a day developing this extension. This is, of course, because I’m still new to Flarum and have been away from software development for quite a while.

I don’t have any plans to make the extension paid directly, but I am considering different options. My goal is to make the footer as easily customizable as it is in WordPress. For that, I might need a sponsor or consider a paid "pro" version.

However, this isn’t something I’m focused on right now. My priority is to make the extension more useful and quickly reach the 1.0 update.

huseyinfiliz

fakruzaruret Xkyer Amarok Subarist meihuak codeX Wlork Capybara i mentioned contributors for the 0.7 update. Apologies for any inconvenience; I just thought you might find this interesting.

IMPORTANT!

I know this won’t surprise you, but the extension has been rewritten so extensively that it’s almost like starting from scratch. After updating the extension:

Clear your cache.
Deactivate and reactivate the modern footer extension.

Failure to do so will result in visual bugs.

v0.7 is LIVE!

A highly requested feature has been added: the ability to hide the footer on specific pages with the new:

Footer Display Mode!

Show on all pages: The footer will be visible on every page of the website.
Hide on all pages: The footer will be hidden on every page of the website. I thought you might want to hide it while adjusting the extension settings.
Hide on discussions: The footer will be hidden only on the discussions pages.
Hide on all pages except the index page: The footer will be visible on the homepage (index page) but hidden on all other pages.
Custom: Allows you to set specific rules for when and where the footer is shown or hidden based on your preferences. I'm not sure if I'll be able to release this soon, but why not in the future?

Another highly requested feature has been added:

Custom HTML

I’ve even prepared a sample custom HTML for you:

<div class="sponsor-container">
  <div class="sponsor-logo">
    <img src="https://flarum.org/img/brands/github.png" alt="Github Logo">
  </div>
  <div class="sponsor-logo">
    <img src="https://flarum.org/img/brands/1password.png" alt="1Password Logo">
  </div>
  <div class="sponsor-logo">
    <img src="https://flarum.org/img/brands/jetbrains.png" alt="Jetbrains Logo">
  </div>
  <div class="sponsor-logo">
    <img src="https://flarum.org/img/brands/ohdear.png" alt="Ohdear Logo">
  </div>
  <div class="sponsor-logo">
    <img src="https://flarum.org/img/brands/styleci.svg" alt="Styleci Logo">
  </div>
  <div class="sponsor-logo">
    <img src="https://nlnet.nl/logo/banner.png" alt="Nlnet Logo">
  </div>
</div>

<style>
  .sponsor-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
  }
  .sponsor-logo {
    margin: 10px 20px;
  }
  .sponsor-logo img {
    max-height: 50px;
    object-fit: contain;
  }
</style>

Details

There are also many details I didn’t mention here. Let me quickly summarize:

The gap between the discussion list on the homepage and the footer on mobile has been removed.
In the settings menu, instead of showing “Links #1,” it will now display the title you set for the block.
Changes made in the Blocks section will now reflect in the menu and general settings page before saving.
The forum-side code has been completely rewritten, improving performance.
Components hidden in the footer will no longer load statically.
The language file, which was removed in version 0.6, has been reintroduced with a completely new one. Unfortunately, your previous custom translations have been deleted.
Design consistency has been ensured in the settings, and some options have been relocated to more logical sections.

Additionally, many small changes or updates I can’t recall right now have also been made.

Feedback & Suggestions

I’m always happy to hear more requests and suggestions!

Subarist

huseyinfiliz
Additionally, I think it might not be necessary to have a separate custom JS code feature.
This is quite an important functionality in native Flarum and is also present in V2.
Keeping it integrated within the admin panel might reduce confusion. Of course, the native backend’s description could emphasize the purpose of JS in this context.

huseyinfiliz

Subarist I thought it might be useful for adding Google Analytics code. Additionally, the custom-footer extension also had a custom JS field. I decided to keep this feature for those who want to transition from the custom-footer extension to the modern-footer extension.

Instead of placing it in a separate menu, I could move it to a less visible area, but I’m not considering removing it entirely.

Thank you for your suggestions! I’m looking forward to hearing more from you! 🔥

Subarist

huseyinfiliz
Don’t worry too much about my perspective on custom JS—it’s just my personal opinion.

I don’t have the ability to contribute to Flarum through coding. Most of the things discussed by the experts here are beyond my understanding. However, I know they’re incredibly passionate, and their goal is very clear: to make Flarum better.

For an average user like me, the biggest challenge with Flarum is that it’s really hard to make it look even slightly unique. It’s truly difficult. Not everyone has the talent for playing with colors and design like @Capybara 😊

It took me about six months of exploration and learning just to barely achieve the style I wanted to present. But even then, it’s not easy to quickly replicate or adapt it for other projects. I love Flarum’s spirit, but when it comes to websites that emphasize distinctiveness, I still struggle to choose it.

For people like you who are willing to develop extensions to enhance Flarum’s appearance—honestly, I’m very grateful. It takes all kinds of talents to make Flarum more complete.

huseyinfiliz

Subarist i am grateful for your contributions and suggestions. Please feel free to share with me any thoughts that come to your mind. I want you to know that I will always be open to criticism and suggestions and I will be happy about it 😊

huseyinfiliz

Subarist meihuak codeX I have developed a feature that allows the footer to be displayed or hidden only on specific pages, taking your requests and needs into account. I would like to hear your thoughts before releasing this feature.

Do you think this functions will be sufficient, or do you have any other suggestions?

Show on all pages: The footer will be visible on every page of the website.

Hide on all pages: The footer will be hidden on every page of the website. I thought you might want to hide it while adjusting the extension settings.

Hide on discussions: The footer will be hidden only on the discussions pages.

Hide on all pages except the index page: The footer will be visible on the homepage (index page) but hidden on all other pages.

Custom: Allows you to set specific rules for when and where the footer is shown or hidden, based on your preferences. I'm not sure if I'll be able to release this soon, but why not in the future?

What do you think?

Finally, I have one more question. Do you think there should be a permission setting for displaying the footer?

For example, would you want to hide it from visitors or members? Or would that be unnecessary and pointless?

codeX

First of all thank you for your efforts. It looks great the way it is, I don't see the need to hide the feature for visitors, but it can still be added.

huseyinfiliz

codeX Thank you for your contributions to the development of the extension and your kind wishes. Version 0.7 will be introduced soon. Since it hasn’t been requested, no improvements related to permissions will be included in this version.

There’s one more thing I forgot to ask. When "hide everywhere except the homepage" is selected, elements like "tags, categories, subscriptions," which appear to belong to the homepage but don’t, will also be hidden. I'm not sure what to do about this because managing so many elements requires a "custom settings" option. For now, I will likely leave it as is, and in the future, with the introduction of "custom settings," I can offer detailed customization for where and to whom the footer is displayed. This could include allowing users to hide specific blocks of the footer separately rather than hiding the entire footer.

Wlork So far, I haven’t encountered any issues with themes or plugins.

As for the widget topic, it’s really too early to discuss this, and I’m not entirely sure how far I want to develop this extension. For now, the development process continues based on your valuable suggestions. Thank you for your support.

Wlork

huseyinfiliz I installed the Pallet theme and noticed that it doesn’t affect the footer.

Great ! Thank you for your work 🙂

huseyinfiliz Afterward, I plan to introduce widgets like "recent discussions," "hot discussions," and "statistics."

Speaking of compatibility.... Existing widgets aren't compatible with Pallet Theme. I don't want to bother you with this today, but if one day you make your own version of widgets, it would be nice to think about it 🙂

Umutcan

huseyinfiliz Great update, congratulations 💫💫

Amarok

huseyinfiliz Superb update! A footer worthy of the biggest websites! Congratulations on a job well done!

huseyinfiliz

Modern Footer v0.8 Released!

We are getting closer to the stable release with each passing day! 🎉

The previous version, v0.7, was a major update that completely revamped the extension. If you missed it, make sure to check it out first: 👉 v0.7 Changelogs huseyinfiliz

Demo

Here’s a quick demo to see the extension in action:
Demo

Note: The Sponsor Section was introduced in v0.7. To integrate it into your forum, refer to the v0.7 changelogs.

v0.8 Changelogs

🚀 What’s New:

Space Between Footer and Forum:
The CSS code that removes the space between the footer and the forum has been removed by default due to compatibility issues with certain themes. Users can manually add this back through custom CSS if needed:

  @media (max-width: 767.98px) {
    .App-content {
      padding-bottom: 0;
    }
  }

  .App {
    padding-bottom: 0;
  }

Social Media Buttons:
Fixed the issue where social media buttons were not clickable.
<footer> Conflict in Discussions:
The conflict caused by using the <footer> tag after every post in discussions has been resolved by completely rewriting the LESS (CSS) code.

Note: Make sure to clear your cache after updating the extension.

Footer Removal on Specific Pages:
- The footer is now disabled by default on the Drafts, Notifications, and Flags pages.
- If there are other pages where the footer should be hidden, please share them in this discussion.
Mobile Tab Height:
- Mobile Tab Height is now disabled on pages where the footer is hidden.
- Additionally, the background color has been removed in mobile tab height.

We Value Your Feedback!

If you notice any issues with this update or have suggestions for new features, please share them here. Your feedback is crucial as we continue to improve the extension 🙏

Translate Status

huseyinfiliz

Umutcan thank you so much! Your support means a lot 💫

codeX haha, thank you! Though I think joining the Flarum core developers might be a bit tricky for me. I tried asking for a code review about the "Footer Display Mode" logic not ago, and... well, let's just say no one got back to me! (Here's the post if you're curious) 😅

But hey, who knows what the future holds! 😄

codeX

It looks amazing, maybe you will be one of the Flarum core developers in the future 🔥

huseyinfiliz

Amarok thank you so much for the kind words! It means a lot coming from you. 😊 Also, I’m thrilled to share that a popular forum with over 23k discussions has started using the extension! Knowing it’s being used on such a large platform fills me with both happiness and pride 🎉

Spez thank you! Glad you liked it! 🙌

Spez

Very goodddddd

Mahendra

@huseyinfiliz I just installed this to forum. Thank you 🙂 😊 for making great extension. our forum have darker theme, white strip coming out between load more button and the footer extension. How can this fix with css?

huseyinfiliz

Mahendra Thank you so much for installing the extension! 😊

For the white strip issue with darker themes, you can fix it with this CSS code:

footer {
    margin-top: 0px;
}

Add this to your custom CSS, and it should resolve the problem. Let me know if you need further assistance! 😊

Mahendra

huseyinfiliz it work, thank you very much 🤗.

« Previous Page Next Page »