Hoe maak je een website voor je gameserver?

Leestijd: 12 minuten | Technisch niveau: Beginner-Gevorderd

Bij gebruik van FiveM: Zorg ervoor dat u uw De FiveM-server is al operationeel., voordat u verdergaat.

Je hebt een gameserver. Nu heb je een website nodig die er niet uitziet alsof hij in 2005 is gebouwd. Deze handleiding snijdt de onzin weg en laat je precies zien hoe je dat moet doen. Hoe bouw je een professionele serverwebsite die bezoekers daadwerkelijk omzet in spelers?.

Wat je daadwerkelijk nodig hebt voordat je begint

• Werkende gameserver met minimaal 10 actieve spelers (bouw geen website voor een lege server)
• $15-50/maand budget voor hosting en domein
• 2-8 uur afhankelijk van de complexiteit
• Basisvaardigheden voor bestandsbeheer (Als je FiveM-bronnen kunt installeren, kun je dit doen.)

Stap 1: Sla de planningsonzin over – dit werkt!

Website-doelen die ertoe doen

Je website moet drie dingen doen:

1. Serverstatus weergeven (online/offline, aantal spelers)
2. Weergaveregels en -functies (wat maakt jouw server anders?)
3. Verbind spelers (Discord uitnodiging, forums, of beide)

Al het overige is optioneel.

Platformbesluit (2 minuten)

Gebruik WordPress. Dit is waarom:

• 43% van het web draait erop.
• Elke hostingprovider ondersteunt het.
• Duizenden gaming-specifieke plugins
• Actieve ontwikkelaarsgemeenschap

Vermijd Wix, Squarespace en aangepaste HTML, tenzij je specifieke technische vereisten hebt.

WordPress downloaden

Stap 2: Een hostingomgeving die niet crasht wanneer je 100 spelers bereikt.

Aanbevolen hostingproviders (getest met echte FiveM-sites)

Voor de meeste servers:

• Hetzner-wolk – €4,51/maand, Duitse engineering, 20 TB dataverkeer
• DigitalOcean – $6/maand, WordPress met één klik, uitstekende uptime

Voor servers met veel verkeer (meer dan 500 bezoekers per dag):

• Vultr hoogfrequent – $12/maand, NVMe-opslag, 32 GB RAM beschikbaar
• OVHcloud – €5,52 per maand, inclusief DDoS-bescherming

Voorkomen: GoDaddy, Hostinger, elke "onbeperkte" hostingprovider (het is in werkelijkheid nooit onbeperkt)

Domeinregistratie

• Gebruik Namecheap of Cloudflare-registrar
• Reken op $10-15 per jaar voor .com-domeinen.
• Overweeg .gg of .net als .com al bezet is.

Stap 3: WordPress-installatie (15 minuten)

Snelle installatie via SSH

# Maak verbinding met je server via SSH: root@jouw-server-ip # Update het systeem: apt update && apt upgrade -y # Installeer de LAMP-stack: apt install apache2 mysql-server php php-mysql libapache2-mod-php -y # Download WordPress: cd /var/www/html wget https://wordpress.org/latest.tar.gz tar -xzvf latest.tar.gz mv wordpress/* . rm -rf wordpress latest.tar.gz # Stel de rechten in: chown -R www-data:www-data /var/www/html chmod -R 755 /var/www/html

Database-instellingen

mysql -u root -p CREATE DATABASE fivem_site; CREATE USER 'fivem_user'@'localhost' IDENTIFIED BY 'strong_password_here'; GRANT ALL PRIVILEGES ON fivem_site.* TO 'fivem_user'@'localhost'; FLUSH PRIVILEGES; EXIT;

Waarschuwing: Vervang 'strong_password_here' door een daadwerkelijk sterk wachtwoord. Gebruik een wachtwoordgenerator.

Stap 4: Alleen essentiële plug-ins

Installeer deze via het WordPress-beheerpaneel (Plugins > Nieuwe toevoegen):

Onmisbare plugins

1. Rankmath – voor SEO
2. WP Snelste Cache – Voorkomt overbelasting van de server
3. Wordfence Beveiliging – Blokken script kiddies
4. UpdraftPlus – Geautomatiseerde back-ups

Voor geavanceerde functies

• Ultiem lid – Gebruikersregistratie/profielen
• bbPress – Forums (als je geen Discord gebruikt)
• GiveWP – Donatiesysteem

Stap 5: Thema kiezen (Denk hier niet te veel over na)

Beste gamingthema's (getest)

Gratis opties:

• Astra + Speldemo – Snel, schoon, werkt
• Blocksy – Moderne, goede mobiele ondersteuning

Premiumopties ($30-60):

• Gwangi – Werkt goed voor RP-servers

Installatievoorbeeld (Astra):

// Voeg toe aan functions.php voor aangepaste serverintegratie functie display_server_status() { $server_ip = &#039;your.server.ip:30120&#039;; $info = json_decode(file_get_contents(&quot;http://{$server_ip}/info.json&quot;), true); $players = json_decode(file_get_contents(&quot;http://{$server_ip}/players.json&quot;), true); echo &#039;'<div class="server-status">'&#039;; echo &#039;'<h3>'&#039; . $info[&#039;vars&#039;][&#039;sv_projectName&#039;] . &#039;'</h3>'&#039;; echo &#039;'<p>Spelers: &#039; . count($players) . &#039;/&#039; . $info[&#039;vars&#039;][&#039;sv_maxClients&#039;] . &#039;'</p>'&#039;; echo &#039;'</div>'&#039;; } add_shortcode(&#039;fivem_status&#039;, &#039;display_server_status&#039;);

Stap 6: Instellen van kritieke pagina's

Startpagina-structuur

- Heldensectie: Servernaam + Deelnemen-knop - Live statuswidget - Functiekaarten (3-4 unieke serverfuncties) - Recente updates/nieuws - Discord-widget

Vereiste pagina's

1. Regels – Duidelijk, genummerd, geen juridisch jargon.
2. Hoe word je lid? – Stap voor stap met schermafbeeldingen
3. Donaties – Transparante lijst met voordelen, geen pay-to-win
4. Personeel/Solliciteren – Huidig personeel, sollicitatieprocedure

Interne verbindingsstructuur

Link naar relevante FiveM-bronnen:

• Bekijk FiveM-mods
• Handleidingen voor serverhosting
• Handleidingen voor scriptinstallatie

Stap 7: Serverintegratiecode

Live servergegevens weergeven

Voeg dit toe aan je thema functies.php:

function get_fivem_server_data($ip, $port) {
    $context = stream_context_create([
        "http" => [
            "timeout" => 5,
        ]
    ]);
    
    $players_json = @file_get_contents("http://{$ip}:{$port}/players.json", false, $context);
    $info_json = @file_get_contents("http://{$ip}:{$port}/info.json", false, $context);
    
    if (!$players_json || !$info_json) {
        return false;
    }
    
    return [
        'players' => json_decode($players_json, true),
        'info' => json_decode($info_json, true),
        'online' => true
    ];
}

// Usage in template
$server_data = get_fivem_server_data('185.25.25.25', '30120');
if ($server_data) {
    echo "Players Online: " . count($server_data['players']) . "/" . $server_data['info']['vars']['sv_maxClients'];
}

Integratie van spelersklassement

-- Voorbeeld tabelstructuur voor statistieken CREATE TABLE player_stats ( steam_id VARCHAR(50) PRIMARY KEY, player_name VARCHAR(100), play_time INT DEFAULT 0, money INT DEFAULT 0, kills INT DEFAULT 0, deaths INT DEFAULT 0, last_seen TIMESTAMP DEFAULT CURRENT_TIMESTAMP );

Stap 8: Prestatieoptimalisatie

Cloudflare installatie (gratis)

1. Voeg site toe aan Cloudflare
2. Schakel deze instellingen in:
   • Automatisch minimaliseren (alle opties)
   • Brotli-compressie
   • Browsercache TTL: 4 uur
   • Altijd online™

Beeldoptimalisatie

# WebP-converter installeren apt install webp # Afbeeldingen converteren voor bestand in *.{jpg,png}; doe cwebp -q 80 "$file" -o "${file%.*}.webp" klaar

Kritieke CSS

Voeg dit toe aan header.php:

/* Inline critical CSS for above-fold content */
.server-status{background:#1a1a1a;color:#fff;padding:20px;border-radius:8px}
.join-button{background:#00ff00;color:#000;padding:15px 30px;font-weight:bold}

Stap 9: Beveiligingsversterking

WordPress-beveiliging

// Voeg toe aan wp-config.php define('DISALLOW_FILE_EDIT', true); define('WP_AUTO_UPDATE_CORE', true); define('FORCE_SSL_ADMIN', true); // Verberg inlogfouten add_filter('login_errors', function($error) { return 'Inloggen mislukt'; });

.htaccess-beveiliging

# Blok XML-RPC Order Toestaan, Weigeren Weigeren van alle # Bescherm wp-config Order Toestaan, Weigeren Weigeren van alle # Blokkeer gebruikersopsomming RewriteCond %{REQUEST_URI} !^/wp-admin [NC] RewriteCond %{QUERY_STRING} author=\d RewriteRule ^ /? [L,R=301]

Stap 10: Checklist voor de lancering

• [ ] Testwebsite op mobiel (50% van het verkeer is mobiel)
• [ ] Serverstatuswidget werkt
• [ ] Discord uitnodigingslink actief
• [ ] Contactformulier getest
• [ ] SSL-certificaat actief
• [ ] Back-upsysteem geconfigureerd
• [ ] Analysetools geïnstalleerd (GA4 of Matomo)
• [ ] Sitemap ingediend bij Google

Veelgemaakte fouten die je moet vermijden

1. Muziek/video's automatisch afspelen – Directe bezoekersretour
2. Verplichte registratie om de inhoud te bekijken. – Doodt de betrokkenheid
3. Inhoud van andere servers kopiëren – Google bestraft dubbele content
4. Geen optimalisatie voor mobiele apparaten – De meeste spelers gebruiken hun telefoon om te browsen.
5. Trage laadtijden – 3+ seconden = verloren bezoekers

Onderhoudsschema

Dagelijks: Widget voor het controleren van de serverstatus Wekelijks: Update de inhoud, plaats nieuwsberichten Maandelijks: Volledige back-up, beveiligingsscan, plug-ins bijwerken Per kwartaal: Prestatieaudit, controle op defecte links

Volgende stappen

1. Instellen Google Analytics 4
2. Creëren Google Zoekconsole rekening
3. Stel een e-maillijst samen voor updates.
4. Integreer met je FiveM servermods (interne link suggestie)

Probleemoplossing

Serverstatus wordt niet weergegeven:

• Controleer of de firewall verbindingen met poorten 30120/30110 toestaat.
• Verifiëren sv_master1 is ingesteld in server.cfg
• Test-eindpunt: http://your-ip:30120/info.json

De website werkt traag:

• Schakel de caching-plugin in
• Afbeeldingen comprimeren
• Controleer het gebruik van hostingbronnen.
• Overweeg een CDN-upgrade.

Gehackt worden:

• Werk de WordPress-kern/plugins onmiddellijk bij.
• Controleer op verdachte beheerdersaccounts.
• Scannen met Wordfence
• Herstel indien nodig vanuit een back-up.

---

Samenvatting: Bouw je FiveM-serverwebsite met WordPress op betrouwbare hosting, integreer live serverstatus, optimaliseer voor snelheid en waarborg de beveiliging – laat de overbodige zaken achterwege en focus op wat bezoekers omzet in spelers.