GithubHelp home page GithubHelp logo

kulna12 / embedbuilder Goto Github PK

View Code? Open in Web Editor NEW

This project forked from glitchii/embedbuilder

0.0 0.0 0.0 3.49 MB

A discord embed builder with both a GUI and JSON editor to use with Discord bots and others applications

Home Page: https://glitchii.github.io/embedbuilder/

License: MIT License

CSS 13.28% JavaScript 80.21% HTML 6.52%

embedbuilder's Introduction

An embed visualizer

Visualize embed or message content from JSON input or provided GUI editor.

This can be used for discord bot embed commands. It can also be intergreted into your Discord bot's website.

Aside the JSON editor, it also includes a GUI editor which converts to JSON for simplicity.

GUI image JSON image

Supported URL Parameters

Editor param (/?editor=json)

The GUI editor is used by default. If 'editor' parameter is set with it's value set to "json", the website will use the JSON editor by default instead. Setting the value to anything else other than 'json' will be ignored.

Example URL: https://glitchii.github.io/embedbuilder/?editor=json

Data param (/?data=...)

A data param is used to specify the dafault json data to be used when the website loads. Note that value of the data param should be URL encoded first, then base64 encoded last because some characters like emojis can't be Base64 encoded alone. Calling the jsonToBase64() or jsonToBase64(json, true) function does that for you and returns the encoded JSON data.

Example URL:
https://glitchii.github.io/embedbuilder/?data=JTdCJTIyZW1iZWQlMjIlM0ElN0IlMjJ0aXRsZSUyMiUzQSUyMkxvcmVtJTIwaXBzdW0lMjIlMkMlMjJkZXNjcmlwdGlvbiUyMiUzQSUyMkRvbG9yJTIwc2l0JTIwYW1ldC4uLiUyMiUyQyUyMmNvbG9yJTIyJTNBMzkxMjklN0QlN0Q=

Other parameters

Params that end with = in the list below need a value, those that don't will always be truthy when set either with or with no value.

Parameter   Description
---------   -----------
username=   Used to set the default name of the bot.
avatar=     If a valid URL is given, that will be the avatar or icon of the bot.
verified    Displays a verified badge on the bot tag when set to true.
reverse     Reverse the preview and editors position.
nouser      Display embed or message content with no username or avatar.
embed       Display only the embed, no editor.
guitabs=    Specify what gui tabs to display comma seperated.
            Example: `guitabs=author` or `guitabs=image,footer`

Example URL with all the above parameters:

https://glitchii.github.io/embedbuilder/?username=Troy&verified&reverse&guitabs=image,footer&avatar=https://cdn.discordapp.com/avatars/663074487335649292/576eb5f13519b9da10ba7807bdd83fab.webp

Intergretting into your website

You are free to use this in your website. Intergretting into your websites allows sending the embed to Discord with a few changes, and using 'formmaters' eg. '{ server_name }' or '{ user_name }' etc. A (not so bad) downside would be that you'd probably have to keep up with fixes and updates.
If all you want is to have an embed builder in your website with no additional features and maybe using your own bot name and avatar, etc., then you should iframe https://glitchii.github.io/embedbuilder into your website with a few of the parameters above if needed instead.



You can look into the project boards to see what is being worked on or want to contribute.

Example integration: https://troybot.xyz/embed
To Do | Discussions

embedbuilder's People

Contributors

glitchii avatar zignis avatar rock583 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.