Themes & Extensions
Themes & Extensions
Share your ForumSpark themes and extensions here.
67Topics
207Replies
Pinned
Theme Directory Guidelines
Started by Cedric ·
Theme Directory Guidelines
First of all, thank you for taking the time to design and share themes for ForumSpark. A fresh, well-crafted theme can completely transform the look and feel of a board, and your contributions help make that possible for the entire community.While we welcome all creative styles,...
0
replies
21
views
Extensions Directory Guidelines
Started by Cedric ·
Extensions Directory Guidelines
First of all, thank you for considering building and contributing to ForumSpark. It’s always great to see new ideas and functionality being shared with the community.While we strongly encourage contributions of all kinds, maintaining a certain level of quality is important for ev...
0
replies
23
views
All topics
Sleek Styles Theme
Started by Jamie ·
Sleek Styles Theme
Name: Sleek Styles
Author: Jamie
Version: 1.0.1
It's a bit silly really but I thought it'd be fun to convert my old Sleek Styles theme from back in the day.
Preview Theme
Download Theme JSON
Import the JSON as a new theme and update the settings so that it doesnt inhe...
17
replies
187
views
Tabbed Categories
Started by Cory ·
Tabbed Categories
Preview
The first category is shown by default, and you can tab through the other categories with the buttons above the category.
Admin CP → Themes → Board Templates → Below the board
<script>
if (document.querySelector('div.forumlist')) {
document.querySelector('div...
5
replies
70
views
Copy Code
Started by Cory ·
Copy Code
Preview
When the "Copy Code" link is clicked, it will copy all code in between the code BBCode tags.
Admin CP → Themes → Board Templates → Below the board
<script>
const code = document.querySelectorAll('code');
if (code) {
code.forEach(element => {
eleme...
0
replies
27
views
Information Box
Started by Cedric ·
Information Box
Preview: https://prnt.sc/7eND-kR2pgmd
Overview:
This code creates an "Information Box" component for your forum, which can be used to display key sections like links, important announcements, and affiliate information in a structured, visually separated layout.
Links Section: D...
7
replies
102
views
Post Bookmarks
Started by Cory ·
Post Bookmarks
Preview #1 - Preview #2
Admin CP → Custom Content → Pages → Create page
Title: Post Bookmarks
SEO URL: post-bookmarks
Content Format: HTML
Content: <ul id="post-bookmarks"></ul>
Published: Enabled
Show in menu: Your Choice
Admin CP → Themes → Board Templates → Bel...
0
replies
32
views
Navy Blue 1.0.1
Started by Cedric ·
Navy Blue 1.0.1
Navy Blue Theme
A refined navy blue theme with full light & dark mode support
Demo: https://themes.forumspark.net/
Features
Navy blue colour palette - A cohesive navy-based design for both light and dark modes
Dark mode with toggle - Built-in Alpine.js dark mode toggle...
6
replies
100
views
Navigation Link Drop-Down Menus
Started by Cory ·
Navigation Link Drop-Down Menus
Preview
All you need to edit is the following area:
const subLinks = {
Members: [`<a href="">Test</a>`, `<a href="">Test 2</a>`],
Search: [`<a href="https://www.google.com/">Google</a>`, `<a href="https://www.yahoo.com/">Yahoo&l...
2
replies
41
views
Horizon
Started by Jamie ·
Horizon
Name: Horizon
Author: ForumSpark
Version: 1.0.0
Live Preview: https://jamie-test.forumspark.net/set-theme?theme=10.
Installation instructions:
Create a new theme in your admin area
Untoggle the option to inherit from the default editor
Edit the stylesheet an...
3
replies
126
views
Background Image Selector
Started by Cory ·
Background Image Selector
Preview
Change the capitalized text as necessary:
const bgImages = ['IMAGE_URL', 'IMAGE_URL', 'IMAGE_URL'];
Admin CP → Themes → Board Templates: Place it where you want the "Change Background Image" link to appear.
<a href="javascript: void(0)" id="bg_changer">Change Ba...
0
replies
24
views
Catppuccin Mocha
Started by Jamie ·
Catppuccin Mocha
Name: Catppuccin Mocha
Author: Jamie
Version: 1.0.0
One of the newer themes, heavily influenced by the https://catppuccin.com/ colour palette. Whether you can say its truly catppuccin I don't know, I didn't really look over their style guide Essentially a recolour of the...
0
replies
46
views
Add Row to Board Statistics
Started by Cory ·
Add Row to Board Statistics
Preview
The top three variables are all you need to modify.
Admin CP → Themes → Board Templates → Below the board
<script>
const newTitle = 'My Title';
const newImage = 'https://cory.forumspark.net/users.svg';
const newContent = `My Content`;
const html = `<div class=...
3
replies
41
views
Mulberry Grove
Started by Jamie ·
Mulberry Grove
Name: Mulberry Grove
Author: Jamie
Version: 1.0.0
A theme I designed a while ago while building out the theme editor for ForumSpark. It's definitely one of the more "nostalgic" style themes on my list at the minute. I'm running in circles looking for things I've missed s...
0
replies
52
views
Newest Member Avatar in Board Stats
Started by Cory ·
Newest Member Avatar in Board Stats
Preview
Admin CP → Themes → Board Templates → Below the board
<script>
const usernameLink = document.querySelector('div.stats a.username');
if (usernameLink && sessionStorage.getItem('statsName') !== usernameLink.innerText) {
fetch(usernameLink.getAttribute('...
0
replies
19
views
Change Individual Forum Markers
Started by Cory ·
Change Individual Forum Markers
Preview
Change the capitalized text as necessary.
Admin CP → Themes → Board Templates → Below the board
<script>
const forumID = [FORUM_ID, FORUM_ID];
const newForumMarker = ['IMAGE_URL', 'IMAGE_URL'];
const forum = document.querySelector('div[id^="forum-"]');
if (forum...
0
replies
19
views
BBCode in Topic Titles
Started by Cory ·
BBCode in Topic Titles
Preview
Admin CP → Themes → Board Templates → Below the board
<script>
const links = document.querySelectorAll('a');
links.forEach(link => {
if (link.innerText.includes('[/')) {
link.innerHTML = link.innerHTML.replace(/\[b\](.*)\[\/b\]/g, '<strong>$1...
1
reply
32
views
0 browsing
· 0 guests
JK navigate · Enter open