Skip to content
This repository has been archived by the owner on Apr 18, 2024. It is now read-only.

Common Questions

Rhythmic (Illo) edited this page May 8, 2023 · 1 revision

How can I customize the discord embed?

  • Open config.yml, and set web-directory.read-only to true - this is so your changes will not get undone.
  • Go to the web directory, and open the file that says index.html with a file editor like notepad++ or another editor that won't auto-format things on you. This is what that file looks like:

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>

    <!-- disable darkreader browser extension on this site -->
    <meta name="darkreader-lock"/>

    <!-- title set in language file -->
    <title></title>

    <meta name="description" content="Blazing fast live mapping solution for Paper and friends"/>
    <meta name="keywords" content="minecraft, map, dynamic, pl3x, pl3xmap"/>

    <!-- facebook meta tags -->
    <meta property="og:url" content="https://github.com/BillyGalbreath/Pl3xMap/"/>
    <meta property="og:type" content="website"/>
    <meta property="og:title" content="Pl3xMap"/>
    <meta property="og:description" content="Blazing fast live mapping solution for Paper and friends"/>
    <meta property="og:image" content="https://raw.githubusercontent.com/BillyGalbreath/Pl3xMap/v3/webmap/public/images/og.png"/>

    <!-- twitter meta tags -->
    <meta name="twitter:card" content="summary_large_image"/>
    <meta property="twitter:domain" content="github.com/BillyGalbreath/Pl3xMap"/>
    <meta property="twitter:url" content="https://github.com/BillyGalbreath/Pl3xMap"/>
    <meta name="twitter:title" content="Pl3xMap"/>
    <meta name="twitter:description" content="Blazing fast live mapping solution for Paper and friends"/>
    <meta name="twitter:image" content="https://raw.githubusercontent.com/BillyGalbreath/Pl3xMap/v3/webmap/public/images/og.png"/>

    <!-- browser support -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
    <meta name="theme-color" content="#222222"/>

    <!-- favicon -->
    <link rel="shortcut icon" href="favicon.ico" sizes="16x16 32x32 48x48" crossOrigin="anonymous"/>

    <!-- normalize -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/modern-normalize.css">

    <!-- leaflet -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
      integrity_no="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
      crossorigin=""/>
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
      integrity_no="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
      crossorigin=""></script>

    <!-- pl3xmap -->
    <link rel="stylesheet" href="styles.css" type="text/css"/>
    <script src="pl3xmap.js"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
  </body>
</html>
  • Edit what you want to customize - this won't be most of the file. Here is an example:

Edited index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>

    <!-- disable darkreader browser extension on this site -->
    <meta name="darkreader-lock"/>

    <!-- title set in language file -->
    <title></title>

++  <meta name="description" content="Super cool map for my Super Cool Server"/>
    <meta name="keywords" content="minecraft, map, dynamic, pl3x, pl3xmap"/>

    <!-- facebook meta tags -->
++  <meta property="og:url" content="map.supercoolserversite.com"/>
    <meta property="og:type" content="website"/>
++  <meta property="og:title" content="Map of Super Cool Server"/>
++  <meta property="og:description" content="Super cool map for my Super Cool Server"/>
++  <meta property="og:image" content="https://somelogo.with/a/working/link.png"/>

    <!-- twitter meta tags -->
    <meta name="twitter:card" content="summary_large_image"/>
++  <meta property="twitter:domain" content="map.supercoolserversite.com"/>
++  <meta property="twitter:url" content="https://map.supercoolserversite.com"/>
++  <meta name="twitter:title" content="Map of Super Cool Server"/>
++  <meta name="twitter:description" content="Super cool map for my Super Cool Server"/>
++  <meta name="twitter:image" content="https://somelogo.with/a/working/link.png"/>

    <!-- browser support -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
++  <meta name="theme-color" content="#001F52"/>

    <!-- favicon -->
    <link rel="shortcut icon" href="favicon.ico" sizes="16x16 32x32 48x48" crossOrigin="anonymous"/>

    <!-- normalize -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/modern-normalize.css">

    <!-- leaflet -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
      integrity_no="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
      crossorigin=""/>
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
      integrity_no="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
      crossorigin=""></script>

    <!-- pl3xmap -->
    <link rel="stylesheet" href="styles.css" type="text/css"/>
    <script src="pl3xmap.js"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
  </body>
</html>
  • Reload the plugin

Note, due to discord cache, it may not show the new embed correctly right away. If you are not seeing changes, try asking someone else to screenshot what it looks like

How can I customize the icons used for the renderers?

  • In your config.yml navigate to renderers - this is where you will set them
  • Put the name of the image you want to use (if your image is named cool_world.png - put cool_world)
  • Go to the web/images/icon directory and place the images you set in the config, in that folder.
  • Reload the plugin