Skip to content

The Flashcord Store Template

Sirius B edited this page Apr 30, 2024 · 6 revisions

⚠️ This page is awfully unfinished.

This page of the Wiki covers how to create your own Flashcord Module or Replugged Plugin.

Get the Flashcord Store Template here.

The FlashConfig Way (Easy)

Manifest.json

The "FlashCFG.py" is a python script which "builds" automatically the HTML Pages for the Flashcord Store Embed and the Flashcord Store Addon Page. It parses data from "manifest.json" and then creates the pages accordingly. FlashCFG hooks into a regular Replugged manifest.json which contains extra information (anything under the "flashcord" key is not standard of a Replugged addon manifest). The following JSON keys are thus required and need to be modified. Please note that "//" are comments and shouldn't be inside the JSON file, they exist in this wiki only to help you understand what a key does.

The default Manifest.json looks as follows:

    {
        "name": "FlashCFG-Built Store Template", // The name of your addon, from Replugged
        "description": "This store page was created using the Flashcord Store Quick Config Python Script!", // The short description of your addon, from Replugged
        "version": "v2.0", // from Replugged
        "license": "Unlicense", // from Replugged
        "type": "flashcord-addon", // What your addon is, if your addon is built ONLY for flashcord then leave it as "flashcord-addon", otherwise leave it as either "replugged-plugin" or "replugged-theme", from Replugged
        "source": "https://github.com/SiriusBYT/Flashcord", // Your Addon's Github Repository, from Replugged
        "flashcord": {
            "general_information": {
                "contributors": "None", // The people who helped you with your addon
                "discord_link": "https://discord.gg/z93kHwGuZt", // Your discord server where you will provide help for your addon
                "license_year": "2024", // The year (or years) your addon existed since
                "sndl_theme": "Dark", // The "Theme" of SNDL, see below for more information
                "embed_color": "#FF69FF", // The Embed color seen when linking your addon on other websites. See below for example
                "tags": [ // Self explanatory, used for searching on the Flashcord Store
                    "Flashcord Addon",
                    "Flashcord SID",
                    "Flashcord STB"
                ]
            },
            "internal_structure": {
                "internal_name": "module_template", // The folder name of your addon, do not include the "-files" suffix!! Must not contain special characters, underscores only.
                "image_store": "store-banner.png", // The file name of the image displayed on your addon's store page
                "image_embed": "embed-banner.png", // The file name of the image displayed on your addon's embed
                "backup_files": true // Backup the html files before modifying or not
            }
        }
    }

If you are updating your Replugged Addon to publish to the Flashcord Store, just add the "flashcord" keys at the end of your manifest and you should be good to go.

The SNDL Theme

SNDL has two options available: "Light" and "Dark", they are responsible for setting the global SNDL Theme. If this made no sense at all, have those epic screenshots which should indicate what this option does:

SNDL-Light SNDL-Dark

SNDL-Light is recommended if you're not going to set a custom background. Otherwise SNDL-Dark would be a better choice.

The Embed Color

This json key changes the "Spine" color when Discord displays an embed. It is the thin colored line (or curved line) on the left of the embed.

Description.html

This file contains pure HTML and is supposed to be your addon's long description. You can put anything in there as long as there's no javascript or anything else that makes external requests. Feel free to use SNDL if you manage to understand how to make your page look fancier.

The default Description.html looks as follows:

<h2>Welcome to the Flashcord Store Template!</h2>
<p>Thanks to FlashCFG, you can set up your very nice store page for your module, plugin or theme in an instant!</p>
<p>Don't forget however that this page is 100% fully customizable by yourself manually, yes you can put whatever you want if you're not satisfied with the default layout!</p>
<p>If you're an advanced person, you may take a look on how <a href="https://sirio-network.com/design-language/light.html">SNDL works and how to use it to make absolutely dazzling pages</a>.</p>
<p class="SNDL-ParenthesizedText">Note that SNDL is currently not or barely documented, you shouldn't have to do this but you can.</p>

How to use FlashCFG

It's as simple as just running FlashCFG.py! It should work on any versions of Python. Please note that this script will communicate with the Flashcord API to look if you've made published addons before so the FlashCFG script can also add those previously published addons to your new addon's page.

Make sure to run the Script in the same directory as the "flashcord" folder, manifest.json and description.html or it will not work!

The script may generate a python folder, it is entirely useless and is safe to delete.

Ok but where do I put my addon's code?

Flashcord Module (or Replugged Theme): Where the bloody hell do I put my CSS code?

You put it here, you have absolute total freedom of what you want Flashcord to be with modules, it can be a simple configuration, patches (ex: making advanced themes work on Vencord) or, well, entirely new modules ! (Ex: new "blackout" animation, adding new features, chat effects, etc.)

Replugged Plugin

Once you're done with configuring your store page with FlashCFG, you're honestly already done. The Flashcord Store doesn't require you to actually upload your plugin's code as Replugged controls the online installs of addons anyways (so I can't host your plugin anyways, only the addon page). After you've built your store page using FlashCFG, send away a ping to me at #flashcord-modules on the SGN Discord server and you're good to go! (I don't know how to code plugins so expect the approval process to take significantly longer as I'm asking other people to lend a hand verifying code.)

The manual way with SNDL (EXPERT)

The raw code of SNDL can be found at https://sirio-network.com/bin/SNDL-App_Base.css.

You can view a preview of SNDL at https://sirio-network.com/design-language/light and https://sirio-network.com/design-language/dark

SNDL comes currently with no real documentation and will remain this way for a long time. Please note that it will seriously take you a while to understand how it works. You can absolutely create absolutely insanely good looking pages with it if you dedicate yourself to it however.

Publishing your addon

Send away a ping to me at #flashcord-modules on the SGN Discord server and you're good to go! Depending on what your addon is, the approval process may take a week or more. If it's pure css, expect an answer in less than 2 days.