Mittwoch, 18 März 2026

Diese Woche am beliebtesten

Vertiefendes Material

Compound Wealth Script

Verwandeln Sie Ihre Webseite in ein professionelles Finanz Portal. Unser Compound Wealth Pro Script macht die Macht des Zinseszins Effekts visuell greifbar.

Warum dieses Script ein Muss ist:

  • Viraler Hebel: Integrierte Sharing Buttons animieren Nutzer, ihre Prognosen in sozialen Netzwerken zu teilen.
  • Content Silo inklusive: Eine tiefgreifende FAQ Akademie liefert den nötigen Text Content für Top Google Platzierungen.
  • Full Responsive: Optimale Darstellung auf Smartphones und Desktops.
  • Einfache Installation: Nur eine Datei und für maximale Performance optimiert.

Ideal für Affiliate Marketing, Finanz Blogs oder als eigenständiges Tool Projekt zur Lead Generierung.

<?php
$dirs = ['css'];
foreach ($dirs as $d) { if (!is_dir($d)) mkdir($d, 0755, true); }
$css = ":root { --primary: #fbbf24; --secondary: #3b82f6; --bg: #0f172a; --card: rgba(30, 41, 59, 0.7); --text: #f8fafc; }\n";
$css .= "body { background: var(--bg); color: var(--text); font-family: 'Inter', sans-serif; margin: 0; padding: 0; line-height: 1.6; background-image: radial-gradient(circle at top right, #1e293b, #0f172a); }\n";
$css .= ".wrapper { max-width: 1100px; margin: 60px auto; padding: 20px; }\n";
$css .= ".hero { text-align: center; margin-bottom: 50px; } .hero h1 { font-size: 3.5rem; font-weight: 900; letter-spacing: -2px; margin: 0; background: linear-gradient(to right, #fbbf24, #f59e0b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }\n";
$css .= ".main-box { background: var(--card); backdrop-filter: blur(20px); border-radius: 40px; padding: 50px; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5); }\n";
$css .= ".grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; }\n";
$css .= ".input-group { margin-bottom: 25px; } label { display: block; margin-bottom: 8px; font-weight: 600; color: #94a3b8; } input { width: 100%; padding: 20px; border-radius: 18px; border: 2px solid #334155; background: #1e293b; color: #fff; font-size: 1.2rem; box-sizing: border-box; transition: 0.3s; }\n";
$css .= "input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 4px rgba(251, 191, 36, 0.1); }\n";
$css .= ".btn { width: 100%; background: linear-gradient(135deg, #fbbf24, #f59e0b); color: #000; border: none; padding: 22px; border-radius: 18px; font-size: 1.3rem; font-weight: 800; cursor: pointer; transition: 0.3s; }\n";
$css .= ".btn:hover { transform: translateY(-3px); box-shadow: 0 15px 30px rgba(251, 191, 36, 0.3); }\n";
$css .= ".stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .stat-item { background: rgba(255,255,255,0.03); padding: 25px; border-radius: 24px; text-align: center; border: 1px solid rgba(255,255,255,0.05); }\n";
$css .= ".stat-val { display: block; font-size: 2.2rem; font-weight: 900; color: var(--primary); letter-spacing: -1px; }\n";
$css .= ".share-box { margin-top: 25px; display: flex; gap: 10px; justify-content: center; } .share-btn { padding: 12px 20px; border-radius: 12px; text-decoration: none; font-size: 0.9rem; font-weight: 700; transition: 0.3s; display: flex; align-items: center; gap: 8px; }\n";
$css .= ".sh-wa { background: #25d366; color: #fff; } .sh-tw { background: #000; color: #fff; } .sh-mail { background: #64748b; color: #fff; } .share-btn:hover { transform: scale(1.05); filter: brightness(1.1); }\n";
$css .= ".compare-table { width: 100%; margin-top: 30px; border-collapse: separate; border-spacing: 0; border-radius: 20px; overflow: hidden; }\n";
$css .= ".compare-table th { background: rgba(255,255,255,0.05); padding: 15px; text-align: left; color: #94a3b8; font-size: 0.8rem; text-transform: uppercase; } .compare-table td { padding: 15px; border-top: 1px solid rgba(255,255,255,0.05); font-weight: 600; }\n";
$css .= ".faq-container { margin-top: 80px; } .faq-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.05); border-radius: 24px; margin-bottom: 15px; cursor: pointer; transition: 0.3s; overflow: hidden; }\n";
$css .= ".faq-card:hover { background: rgba(255,255,255,0.06); transform: translateX(10px); } .faq-header { padding: 25px 30px; display: flex; justify-content: space-between; align-items: center; font-weight: 700; font-size: 1.1rem; }\n";
$css .= ".faq-content { max-height: 0; overflow: hidden; padding: 0 30px; transition: 0.4s ease-out; color: #94a3b8; line-height: 1.8; } .faq-card.open .faq-content { max-height: 400px; padding-bottom: 30px; }\n";
$css .= ".badge-expert { background: var(--primary); color: #000; padding: 4px 10px; border-radius: 6px; font-size: 0.7rem; text-transform: uppercase; margin-right: 12px; font-weight: 800; }\n";
$css .= "footer { text-align: center; padding: 80px; opacity: 0.3; }";
file_put_contents('css/finance.css', $css);

$res = null; $history = [];
if (!empty($_POST['start'])) {
    $start = (float)$_POST['start']; $rate = (float)$_POST['rate'];
    $years = (int)$_POST['years']; $interest = (float)$_POST['interest'] / 100;
    $current = $start; $total_invested = $start;
    for ($i = 1; $i <= $years; $i++) {
        $interest_earned = $current * $interest;
        $current += $interest_earned + ($rate * 12);
        $total_invested += ($rate * 12);
        if ($i % 5 == 0 || $i == $years || $i == 1) {
            $history[] = ['year' => $i, 'balance' => $current, 'interest' => $interest_earned];
        }
    }
    $res = [
        'final' => number_format($current, 2, ',', '.'),
        'profit' => number_format($current - $total_invested, 2, ',', '.'),
        'invested' => number_format($total_invested, 2, ',', '.'),
        'raw_final' => round($current, 2)
    ];
    $share_text = "Wahnsinn! Mein Sparplan ergibt ein Endkapital von " . $res['final'] . " €. Berechne auch dein Vermoegen:";
    $share_url = "https://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];
}
?>
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Compound Wealth Pro | Zinseszins-Rechner & Sparplan-Prognose 2026</title>
<meta name="title" content="CompoundWealth Pro | Zinseszins-Rechner & Sparplan-Prognose 2026">
<meta name="description" content="Berechnen Sie Ihr Endkapital mit dem Zinseszins-Effekt. Wissenschaftlicher Sparplanrechner für ETF-Anleger und Sparer. Inklusive Meilenstein-Tabelle & Experten-Ratgeber.">
<meta name="keywords" content="Zinseszinsrechner, Sparplanrechner, Finanzen, Rendite, Zinsen berechnen">
<link rel="canonical" href="https://<?= $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] ?>">
<meta property="og:type" content="website">
<meta property="og:url" content="https://<?= $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] ?>">
<meta property="og:title" content="CompoundWealth Pro: Die Macht des Zinseszins">
<meta property="og:description" content="Visualisiere dein Vermögen im Jahr 2026. Der präziseste Rechner für deine finanzielle Freiheit.">
<meta property="og:image" content="https://<?= $_SERVER['HTTP_HOST'] ?>/assets/finance-preview.jpg">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:title" content="CompoundWealth Pro: Zinseszins-Rechner">
<meta property="twitter:description" content="Berechne dein Wachstum mit 8% Rendite p.a. – Jetzt Sparplan prüfen.">

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FinancialCalculator",
  "name": "CompoundWealth Pro Zinseszins-Rechner",
  "description": "Ein interaktiver Rechner zur Bestimmung des Endkapitals unter Berücksichtigung von Zinseszinsen und monatlichen Sparraten.",
  "url": "https://<?= $_SERVER['HTTP_HOST'] ?>",
  "applicationCategory": "FinanceApplication",
  "operatingSystem": "All",
  "author": {
    "@type": "Organization",
    "name": "Dreamcodes"
  },
  "offers": {
    "@type": "Offer",
    "price": "0",
    "priceCurrency": "EUR"
  }
}
</script>
    <link rel="stylesheet" href="css/finance.css">
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&display=swap" rel="stylesheet">
    
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "FinancialCalculator",
      "name": "CompoundWealth Pro",
      "url": "https://<?= $_SERVER['HTTP_HOST'] ?>",
      "applicationCategory": "FinanceApplication",
      "offers": { "@type": "Offer", "price": "0", "priceCurrency": "EUR" }
    }
    </script>
</head>
<body>

<div class="wrapper">
    <header class="hero">
        <h1>Compound<span style="color:#fff"> Wealth</span></h1>
        <p>Visualisieren Sie die das exponentielle Wachstums Ihres Geldes</p>
    </header>

    <div class="main-box">
        <div class="grid">
            <aside>
                <form method="POST">
                    <div class="input-group">
                        <label>Startkapital (€)</label>
                        <input type="number" name="start" required value="<?= $_POST['start'] ?? '10000' ?>">
                    </div>
                    <div class="input-group">
                        <label>Monatliche Sparrate (€)</label>
                        <input type="number" name="rate" required value="<?= $_POST['rate'] ?? '500' ?>">
                    </div>
                    <div class="input-group">
                        <label>Zeitraum (Jahre)</label>
                        <input type="number" name="years" required value="<?= $_POST['years'] ?? '20' ?>">
                    </div>
                    <div class="input-group">
                        <label>Rendite p.a. (%)</label>
                        <input type="number" step="0.1" name="interest" required value="<?= $_POST['interest'] ?? '7.0' ?>">
                    </div>
                    <button type="submit" class="btn">Prognose starten</button>
                </form>
            </aside>

            <main>
                <?php if ($res): ?>
                <div class="stat-grid">
                    <div class="stat-item" style="grid-column: span 2; border: 1px solid var(--primary); background: rgba(251, 191, 36, 0.05);">
                        <label style="color:var(--primary)">Endguthaben Prognose</label>
                        <span class="stat-val" style="font-size: 3.5rem;"><?= $res['final'] ?> €</span>
                    </div>
                    <div class="stat-item">
                        <label>Eigenkapital</label>
                        <span class="stat-val" style="color:#fff; font-size: 1.6rem;"><?= $res['invested'] ?> €</span>
                    </div>
                    <div class="stat-item">
                        <label>Zinsertrag</label>
                        <span class="stat-val" style="color: #10b981; font-size: 1.6rem;">+ <?= $res['profit'] ?> €</span>
                    </div>
                </div>
                <div class="share-box">
                    <a href="https://api.whatsapp.com/send?text=<?= urlencode($share_text . ' ' . $share_url) ?>" target="_blank" class="share-btn sh-wa">WhatsApp</a>
                    <a href="https://twitter.com/intent/tweet?text=<?= urlencode($share_text) ?>&url=<?= urlencode($share_url) ?>" target="_blank" class="share-btn sh-tw">Twitter / X</a>
                    <a href="mailto:?subject=Finanz-Check&body=<?= urlencode($share_text . ' ' . $share_url) ?>" class="share-btn sh-mail">E-Mail</a>
                </div>
                <table class="compare-table">
                    <thead><tr><th>Meilenstein</th><th>Guthaben</th><th>Zinsgewinn</th></tr></thead>
                    <tbody>
                        <?php foreach($history as $h): ?>
                        <tr><td>Jahr <?= $h['year'] ?></td><td><?= number_format($h['balance'], 0, ',', '.') ?> €</td><td style="color:#10b981;">+<?= number_format($h['interest'], 0, ',', '.') ?> €</td></tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
                <?php else: ?>
                <div style="height:100%; display:flex; align-items:center; justify-content:center; opacity:0.3; text-align:center;">
                    <p>Warten auf Eingabe...<br>Berechnen Sie jetzt Ihren Zinseszins-Hebel.</p>
                </div>
                <?php endif; ?>
            </main>
        </div>
    </div>
<div class="faq-container">
        <h2 style="text-align:center; font-size: 2.8rem; margin-bottom: 50px; font-weight: 900; background: linear-gradient(to right, #fbbf24, #fff); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">Finanz-Akademie 2026</h2>
                <div class="faq-card" onclick="this.classList.toggle('open')">
            <div class="faq-header"><span><span class="badge-expert">Mathematik</span> Das Prinzip des Zinseszins erklärt</span><span style="color:var(--primary); font-size: 1.5rem;">+</span></div>
            <div class="faq-content">
                <p>Der Zinseszins-Effekt ist der Motor des modernen Vermögensaufbaus. Er tritt ein, wenn Zinserträge nicht entnommen, sondern dem Anlagekapital wieder hinzugefügt werden. In der folgenden Periode wird somit nicht nur der ursprüngliche Betrag verzinst, sondern auch die bereits erwirtschafteten Zinsen der Vorjahre.</p>
                
                <p>Mathematisch ausgedrückt wächst dein Kapital dadurch nicht linear (gleichmäßig), sondern <strong>exponentiell</strong>. Je länger dieser Prozess läuft, desto steiler steigt die Kurve an. Albert Einstein bezeichnete dieses Phänomen nicht ohne Grund als das achte Weltwunder.</p>
            </div>
        </div>
        <div class="faq-card" onclick="this.classList.toggle('open')">
            <div class="faq-header"><span><span class="badge-expert">Strategie</span> Warum Zeit wichtiger ist als die Sparrate</span><span style="color:var(--primary); font-size: 1.5rem;">+</span></div>
            <div class="faq-content">
                <p>Ein häufiger Fehler ist der Glaube, man müsse erst viel Geld verdienen, um mit dem Sparen zu beginnen. Die Mathematik beweist das Gegenteil: Ein 20-jähriger, der nur 100 € im Monat spart, wird im Rentenalter oft ein größeres Vermögen besitzen als ein 40-jähriger, der monatlich 500 € investiert.</p>
                <p>Der Grund ist die <strong>Laufzeit</strong>. Der Zinseszins braucht Jahre, um seine volle Kraft zu entfalten. In den ersten 10 Jahren sieht das Wachstum oft langsam aus, doch in den letzten 10 Jahren einer 30-jährigen Laufzeit explodieren die Erträge förmlich.</p>
            </div>
        </div>
        <div class="faq-card" onclick="this.classList.toggle('open')">
            <div class="faq-header"><span><span class="badge-expert">Analyse</span> Realistische Renditen am Aktienmarkt</span><span style="color:var(--primary); font-size: 1.5rem;">+</span></div>
            <div class="faq-content">
                <p>Für eine seriöse Prognose im Jahr 2026 sollte man sich an historischen Daten orientieren. Der breite Aktienmarkt (repräsentiert durch Indizes wie den MSCI World oder S&P 500) hat über die letzten 50 Jahre eine durchschnittliche nominale Rendite von ca. <strong>7% bis 9% pro Jahr</strong> geliefert.</p>
                <p>Wichtig für deine Planung: Berücksichtige stets die Inflation und Steuern. Eine Bruttorendite von 8% führt nach Abzug der Kapitalertragssteuer und einer durchschnittlichen Inflationsrate oft zu einer realen Kaufkraftsteigerung von etwa 4% bis 5%.</p>
            </div>
        </div>
        <div class="faq-card" onclick="this.classList.toggle('open')">
            <div class="faq-header"><span><span class="badge-expert">Tipp</span> Monatlicher Sparplan vs. Einmalanlage</span><span style="color:var(--primary); font-size: 1.5rem;">+</span></div>
            <div class="faq-content">
                <p>Die monatliche Einzahlung, wie sie in unserem Rechner kalkuliert wird, bietet einen entscheidenden psychologischen und technischen Vorteil: den <strong>Cost-Average-Effekt</strong> (Durchschnittskosteneffekt). Da du jeden Monat den gleichen Betrag investierst, kaufst du bei niedrigen Kursen automatisch mehr Anteile und bei hohen Kursen weniger.</p>
                <p>Dies reduziert das Risiko, zu einem ungünstigen Zeitpunkt (dem "Allzeithoch") mit dem gesamten Geld einzusteigen, und führt langfristig zu einem geglätteten Einkaufspreis deiner Investments.</p>
            </div>
        </div>
    </div>
    <footer>© 2026 · <a href="https://www.dreamcodes.net" style="color:var(--primary); text-decoration:none; font-weight:700;">Dreamcodes</a></footer>
</div>
</body>
</html>
Dreamcodes Redaktion
Dreamcodes Redaktion
Qualität als Standard. Verantwortung als Prinzip. Jede Ressource auf Dreamcodes basiert auf geprüften Best Practices und fundierter Praxiserfahrung. Unser Anspruch ist ein belastbares Fundament statt experimenteller Lösungen. Die Integration und Absicherung der Inhalte liegt in Ihrem Ermessen. Wir liefern die fachliche Basis, die Verantwortung für den produktiven Einsatz verbleibt bei Ihnen.
Vorheriges Tutorial

Vielleicht einen Blick WERT?