How to Edit Your Gaming Community, Clan or Guild Website

1. Get your template files

Your community site lives in a self-contained folder under templates/. Each game has its own folder:

• templates/dayz/ — Cherno Refuge demo
• templates/rust/ — Oxide Raiders demo
• templates/minecraft/ — BlockCraft Network demo
• templates/wow/ — Ashen Covenant demo
• templates/cs2/ — Zero Hour demo
• templates/zomboid/ — Knox Hold demo
• templates/valheim/ — Ravenhall demo

If GameSignal set hosting up for you, download a ZIP of your template from your welcome email / ticket, or ask us to send a fresh copy. Work on a copy of the folder so you always have an original backup.

Live previews on the marketing site (for example DayZ) show the demo branding — your edits happen in the files you download or receive.

2. Understand the folder

Every template follows the same layout. Example for DayZ:

templates/dayz/
  index.html      ← Home page (hero, server info, gallery, Discord)
  rules.html      ← Rules page
  staff.html      ← Staff / officers page
  css/style.css   ← Colours and layout
  js/main.js      ← Mobile menu (usually leave alone)
  assets/images/  ← All photos used by the site

You will edit HTML for wording and links, css/style.css for colours, and files inside assets/images/ for pictures. You almost never need to touch js/main.js.

3. Open the template in Visual Studio Code

1. Install and open Visual Studio Code.
2. Choose File → Open Folder… (macOS: File → Open…).
3. Select your template folder (for example dayz), not the whole Desktop.
4. The left sidebar lists every file. Click a file to open it in the editor.

Tip — Find in Files: press Ctrl+Shift+F (Mac: Cmd+Shift+F) and search for the demo name (for example Cherno Refuge or discord.gg/example). Replace matches carefully so you don’t miss the logo, title tag or footer.

Tip — Save often: Ctrl+S / Cmd+S. VS Code shows a white dot on the tab when a file has unsaved changes.

4. Preview your changes in a browser

1. In VS Code’s file list, right-click index.html.
2. Choose Reveal in File Explorer (or Finder on Mac).
3. Double-click index.html to open it in Chrome, Edge or Firefox.
4. After each save in VS Code, refresh the browser (F5 or Ctrl+R) to see updates.

Check rules.html and staff.html the same way. Keep the browser and VS Code side by side while you work.

5. Change the community name

Demo names appear in several places. Update all of them:

• Browser tab / search: the <title> and <meta name="description"> near the top of each HTML file
• Header logo: the <strong> and <span> inside the .logo link (example: CHERNO REFUGE)
• Hero and headings: main headline and lead paragraph on index.html
• Server card: community name next to status
• Footer: copyright line and short blurb
• Demo banner: optional — remove or rewrite the “template preview” strip at the top once you’re live

Do this in index.html, rules.html and staff.html — the header and footer are repeated on each page.

<!-- Example: header logo -->
<a class="logo" href="/">
  <strong>YOUR COMMUNITY</strong>
  <span>DayZ Community</span>
</a>

6. Discord invite and server IP

Discord

Search the template for discord.gg/example and replace it with your real invite URL. It usually appears on the Join / Discord buttons on index.html. Update every match so no demo link remains.

Server connection details

On index.html, find the server information panel (often near an id like #server). Replace the demo hostnames, for example:

• DayZ: play.chernorefuge.example
• Rust: play.oxideraiders.example
• Minecraft: play.blockcraft.example
• WoW: play.ashencovenant.example
• CS2: connect play.zerohour.example

Also update map name, wipe text, player counts or store URLs if your template shows them — treat every demo number as placeholder content.

7. Edit rules and staff

Rules — rules.html

Open rules.html and rewrite each numbered section to match how your community actually runs. Keep the existing headings if you like the layout, or rename sections (for example “Base building” → “Raid rules”). Delete sections you don’t need; add new <section> blocks by copying an existing one.

Staff — staff.html

Each person is a .staff-card block with:

• Initials or avatar text
• Display name
• Role (Owner, Admin, Moderator, Officer, etc.)

Duplicate a card for more staff; delete cards you don’t need. Keep the HTML structure intact so spacing and mobile layout still work.

8. Change colours in CSS

Open css/style.css. At the top you’ll see a :root block — these variables control the theme.

:root {
  --bg: #0a0c0a;
  --accent: #c4d48a;      /* primary buttons & highlights */
  --accent-hot: #e8a04a;  /* secondary highlight */
  --online: #7dcf6a;      /* “online” status colour */
  /* …other variables… */
}

Change --accent and --accent-hot to your brand colours (hex codes). Optionally tweak backgrounds (--bg, --bg-2) and text colours. Save, then refresh the browser.

Default accents by template:

• DayZ — green/khaki #c4d48a
• Rust — rust orange #ce422b
• Minecraft — green #5bce3a
• WoW — gold #f0c75e
• CS2 — orange #ff6a00

If you change the main accent, also update <meta name="theme-color"> in each HTML file so mobile browser chrome matches.

9. Replace images with GIMP

All template photos live in assets/images/. HTML points at those filenames (for example assets/images/hero-hannah.jpg). You have two safe options:

1. Keep the filename: edit or replace the image but export with the same name (recommended — no HTML changes).
2. New filename: export as a new name, then update every matching src="…" in the HTML.

Workflow in GIMP

1. Open GIMP → File → Open → pick the image from assets/images/.
2. Crop: Tools → Transform Tools → Crop. Heroes look best around 16:9 (for example 1920×1080).
3. Resize: Image → Scale Image. Hero images: about 1600–1920px wide. Gallery tiles: about 800–1200px wide.
4. Export: File → Export As…
   • Photos → .jpg (quality ~85–90)
   • Graphics with transparency → .png
5. Overwrite the original filename in assets/images/ (or export new and update HTML).
6. Refresh your browser preview.

Licensing: only use images you own or have rights to publish. Game press-kit art may have restrictions — keep the “not affiliated” footer note unless you have written permission otherwise.

Performance: huge 8K screenshots will slow the site. Scale them down in GIMP before uploading.

10. Upload to your GameSignal hosting

1. Log in to cPanel (details are in your welcome email).
2. Open File Manager → go to public_html (or the folder we assigned for your community site).
3. Upload your edited files. You can ZIP the template folder locally, upload the ZIP, then Extract in File Manager.
4. Keep the same structure: index.html at the site root of that community, with css/, js/ and assets/ beside it.
5. Visit your domain and hard-refresh (Ctrl+F5) so the browser drops old cached CSS/images.

If something looks broken after upload, usually a file path is wrong or an image wasn’t uploaded. Compare your live folder to the local template.

11. Final checklist

• Community name updated on home, rules and staff
• Discord invite is your real link (no discord.gg/example)
• Server IP / connect string is correct
• Rules match your community
• Staff names and roles are current
• Colours set in :root
• Hero and gallery images replaced (and compressed)
• Demo banner removed or rewritten for production
• Site tested on phone and desktop
• Files uploaded to cPanel and domain loads

Need us to do it?

Prefer not to edit files yourself? Contact GameSignal — on Managed plans we can apply branding, Discord, server details and image swaps for you. Browse designs on the templates page first.