8 Einträge gefunden
Version 1.2.0 • PHP 7.4+ (getestet auf PHP 8.4) • MySQL • Bootstrap 5 Entwickelt von phppower 1. Systemanforderungen Eigenschaft Beschreibung PHP 7.4 oder höher (getestet auf PHP 8.4) MySQL/MariaDB 5.7 / 10.3 oder höher PDO + PDO_MySQL Pflicht GD Extension Pflicht (Bildverarbeitung + WebP) mbstring Pflicht (UTF-8 / Umlaute) Apache/Nginx mit mod_rewrite uploads/ Schreibrechte 755 oder 777 2. Installation Neue Installation Alle Dateien per FTP/SFTP hochladen, dann im Browser aufrufen: https://deine-domain.de/news-cms/install.php Der 4-Schritt-Wizard: • Schritt 1 — System-Check (PHP-Version, Extensions, Schreibrechte) • Schritt 2 — Datenbank-Einstellungen + SMTP-Mail (optional) • Schritt 3 — Admin-Account anlegen • Schritt 4 — Fertig: 17 Tabellen angelegt, Standard-Kategorien eingetragen ⚠ Nach der Installation: install.php löschen oder per .htaccess sperren! .htaccess — Unterordner Falls das CMS in einem Unterordner liegt (z.B. /news-cms/): RewriteBase /news-cms/ 3. Benutzer & Rollen Rolle Eigene Posts Fremde Posts Kommentare User verw. Einstellungen User ✗ ✗ ✗ ✗ ✗ Author ✓ Voll ✗ ✗ ✗ ✗ Moderator ✓ Voll ✓ Bearbeiten ✓ ✗ ✗ Admin ✓ Voll ✓ Alles ✓ ✓ ✓ Neue Accounts starten als inactive und müssen vom Admin freigeschaltet werden. Moderator/Admin-Rolle nur durch bestehenden Admin vergebbar. 4. Posts erstellen & verwalten Post-Typen Eigenschaft Beschreibung Article Standard-Textartikel mit Quill.js Rich-Text-Editor Gallery Bildergalerie — Bilder per Editor einfügen Video Video-Datei hochladen (MP4, WebM, max. 50 MB) Audio Audio-Datei hochladen (MP3, WAV, OGG) Kategorien / Tags / Keywords • Vorhandene Kategorien per Multi-Select auswählen (mehrere möglich) • Neue Kategorien im Freitext-Feld kommagetrennt eingeben • Neue werden automatisch angelegt, als Tags verknüpft und als SEO-Keywords gespeichert • Die meta keywords im <head> werden automatisch aus Kategorien befüllt Geplante Veröffentlichung Beim Erstellen/Bearbeiten eines Posts kann unter Status → Published ein optionales Datum+Uhrzeit gesetzt werden. Ohne Datumsangabe wird sofort veröffentlicht. Der Datum-Picker erscheint automatisch wenn Published gewählt wird. Lesezeit Auf jeder Post-Karte und der Detailseite wird die geschätzte Lesezeit automatisch berechnet und angezeigt (ca. 200 Wörter/Minute). Drucken / PDF Jeder Post hat einen Drucken-Button der eine saubere Druckansicht (print.php) in einem neuen Tab öffnet. Von dort kann auch direkt als PDF gespeichert werden. Navbar, Footer und Werbung werden ausgeblendet. Herz-Bewertung (Likes) Jeder Post hat einen Herz-Button (❤ ) auf der Detailseite. Besucher können ohne Login liken. Ein Cookie verhindert Mehrfach-Likes (1 Jahr gültig). Anzahl auch auf Post-Karten sichtbar. 5. Volltextsuche Die Suche ist über das Suchfeld im Header auf allen Seiten erreichbar. Sie durchsucht Titel, Content, Excerpt und Kategorienamen gleichzeitig. Suchergebnisse zeigen den Suchbegriff farbig markiert (highlight). URL: search.php?q=suchbegriff Eigenschaft Beschreibung Mindestlänge 2 Zeichen Durchsucht Titel, Content, Excerpt, Kategoriename Hervorhebung Suchbegriff wird in Ergebnissen farbig markiert Paginierung 10 Ergebnisse pro Seite Bild Featured Image wird in Ergebnisliste angezeigt 6. Autor-Profilseite Jeder Autor hat eine öffentliche Profilseite unter profile.php?user=USERNAME. Autor-Namen auf Post-Detailseiten sind direkt verlinkt. Eigenschaft Beschreibung URL profile.php?user=username Zeigt Avatar (Initiale), Rolle, Mitglied seit, Artikel-/Views-/Likes-Zähler Artikel-Grid Alle veröffentlichten Posts des Autors mit Paginierung (9 pro Seite) Statistik Gesamt-Views und Gesamt-Likes über alle Posts 7. Startseite — Aufbau Eigenschaft Beschreibung Header Logo + Suchfeld + Login/Logout + Dark-Mode. Automatisches Hintergrundbild von Picsum Photos. Navigation Dynamische Kategorien-Navbar Tag-Wolke Alle Kategorien farbig — Schriftgröße je nach Artikel-Häufigkeit Banner Zwei Werbeplätze 468×60 px nebeneinander (Admin → Banner) Post-Grid Artikel als Karten mit Bild, Kategorie, Lesezeit, Views, Kommentare, ❤Likes Paginierung Anzahl pro Seite in Einstellungen konfigurierbar Footer Newsletter-Widget, Links, Besucher-Statistik 8. Banner verwalten Admin → Banner (nur Admins). Zwei Werbeplätze auf der Startseite, jeweils 468×60 px. Eigenschaft Beschreibung Position top_left = linker Platz, top_right = rechter Platz Bild-URL Vollständige URL oder relativer Pfad in /uploads/ Ziel-URL Wohin der Klick führt (optional, öffnet in neuem Tab) Aktiv Ein/Aus — inaktive Banner werden durch Platzhalter ersetzt Sortierung Niedrigere Zahl = bevorzugt wenn mehrere aktiv 9. Newsletter — DSGVO Double-Opt-In Anmelde-Prozess • User trägt Email im Footer-Widget ein • System sendet Bestätigungs-Email mit Token (Double-Opt-In) • User klickt Link → newsletter-confirm.php → confirmed=1 • Erst jetzt ist der User im Verteiler Newsletter versenden Admin → Newsletter → Newsletter schreiben. Sendet NUR an confirmed=1 AND subscribed=1. Jede Email enthält automatisch einen Abmelde-Link. Kommentar-Benachrichtigung Wenn jemand auf einen Kommentar antwortet, erhält der ursprüngliche Kommentator automatisch eine Email mit dem Antwort-Text und einem direkten Link zurück zum Post. Voraussetzung: Email-Adresse beim Kommentieren angegeben. 10. Besucher-Statistik Im Footer jeder Seite werden Besucherzahlen angezeigt (automatisch getrackt): Eigenschaft Beschreibung Online (5 Min) Unique Besucher aktiv in den letzten 5 Minuten Heute Unique Besucher heute Diese Woche Unique Besucher letzte 7 Tage Dieser Monat Unique Besucher letzte 30 Tage IPs werden als MD5-Hash gespeichert (DSGVO-freundlich). Einträge älter als 3 Monate werden automatisch gelöscht. 11. 2-Faktor-Authentifizierung Nach erfolgreichem Login mit Username + Passwort wird automatisch ein 6-stelliger Code per Email gesendet. Der Login ist erst nach Eingabe des Codes abgeschlossen. Eigenschaft Beschreibung Code 6-stellige Zahl, zufällig generiert Gültigkeit 10 Minuten Einmalig Jeder Code kann nur einmal verwendet werden Neu anfordern Button auf der 2FA-Seite sendet neuen Code Auto-Submit Formular wird automatisch abgesendet bei 6 eingegebenen Ziffern Tabelle varient_two_factor_codes (wird automatisch bereinigt) 12. RSS-Feed, Sitemap & SEO RSS-Feed Eigenschaft Beschreibung Alle Artikel rss.php Kategorie rss.php?cat=slug Autodiscovery Im <head> jeder Seite automatisch eingetragen Inhalt Letzte 20 Posts mit Volltext, Bild, Kategorie, Autor Sitemap sitemap.php generiert automatisch eine XML-Sitemap mit allen veröffentlichten Posts und Kategorien. robots.php liefert die robots.txt mit dem Sitemap-Link. Kanonische URLs Jede Seite hat einen <link rel="canonical"> Tag der Duplicate-Content für Suchmaschinen verhindert. Meta Keywords Werden automatisch aus den Kategorien/Tags des Posts befüllt. Auf der Startseite aus den Top-10-Kategorien. 13. Bild-Mediathek Admin → Mediathek — zeigt alle hochgeladenen Dateien aus dem uploads/ Ordner. Eigenschaft Beschreibung Bilder JPG, JPEG, PNG, GIF, WEBP — mit Bildvorschau Videos MP4, WEBM, OGV, MOV — mit Typ-Icon Audio MP3, WAV, OGG, M4A — mit Typ-Icon Filter Typ-Filter (Alle / Bilder / Videos / Audio) + Dateiname-Suche URL kopieren Klick auf Karte oder Button kopiert URL in die Zwischenablage Löschen Nur Admins können Dateien löschen 14. Header-Bild & Logo Eigenschaft Beschreibung Logo Admin → Einstellungen → Logo URL Header-Bild Automatisch von Picsum Photos (thematisch je nach Seite) Startseite Keyword aus Einstellungen (unsplash_keyword) Post-Seite Keyword aus Post-Tags und Kategorie Andere Seiten Generisches Keyword (news, magazine, search, author etc.) Fallback Lila Farbverlauf bei Ladefehler 15. Einstellungen Admin → Einstellungen (nur Admins) Eigenschaft Beschreibung Site-Name Name der Website Tagline Kurzbeschreibung Posts pro Seite Anzahl auf Startseite/Kategorieseite Logo URL Vollständige URL zum Logo-Bild Header-Bild Modus unsplash = Picsum-Bild, none = kein Bild Unsplash Keyword Englische Keywords für Hintergrundbild Datenschutzerklärung Text für datenschutz.php Impressum Text für impressum.php 16. Datei-Struktur Datei Beschreibung index.php Startseite (Tag-Wolke, Banner, Post-Grid, Lesezeit) post.php Post-Detailseite (Herz, Drucken, Verwandte, Kommentare) search.php Volltextsuche mit Highlight print.php Druckansicht / PDF-Export profile.php Öffentliche Autor-Profilseite category.php Kategorie-Übersicht archiv.php Archiv nach Jahr/Monat sitemap.php XML-Sitemap (automatisch generiert) robots.php robots.txt (dynamisch mit Sitemap-URL) rss.php RSS-Feed (alle + Kategorie-Filter) update.php AJAX-Handler für Herz-Bewertung login.php Login-Formular login-2fa.php 2FA Code-Eingabe _header_public.php Gemeinsamer Header (Logo, Bild, Suche, Login, Meta) _navbar.php Kategorien-Navigation _footer.php Footer (Newsletter, Statistik, Links) includes/auth.php Authentifizierung, Rollen, 2FA-Logik includes/db.php PDO-Wrapper mit Tabellen-Präfix includes/functions.php Hilfsfunktionen (slug, readingTime, unsplashUrl...) includes/mail.php Email-Templates (Verification, Reset, 2FA, Newsletter) includes/stats.php Besucher-Tracking admin/dashboard.php Übersicht + Top 5 Views + Top 5 Likes admin/media.php Mediathek (Bilder, Videos, Audio) admin/posts/create.php Post erstellen (inkl. Datum-Picker) admin/posts/edit.php Post bearbeiten admin/banners.php Banner-Verwaltung admin/settings.php Site-Einstellungen 17. Datenbank-Schema Alle Tabellen nutzen den Präfix varient_. Gesamt: 17 Tabellen. Tabelle Inhalt varient_users User-Accounts, Rollen, Status, Email-Verifizierung varient_sessions Login-Sessions varient_password_resets Passwort-Reset-Tokens (1h gültig) varient_two_factor_codes 2FA-Codes (6-stellig, 10min gültig, einmalig) varient_categories Kategorien (= Tags = SEO-Keywords) varient_tags Tags (synchron mit Kategorien) varient_posts Posts (alle Typen), Views-Counter varient_post_tags Verknüpfung Posts ↔ Tags varient_post_meta Zusatz-Metadaten (media_url, media_type) varient_media Hochgeladene Videos/Audios varient_comments Kommentare mit Status (pending/approved/spam) varient_seo_meta SEO-Einstellungen + Keywords pro Post varient_newsletter Abonnenten mit DOI-Feldern varient_settings Site-Einstellungen (Key-Value-Store) varient_banners Werbebanner 468×60 varient_post_likes Herz-Bewertungen pro Post (Cookie-basiert) varient_visitor_stats Besucher-Tracking (IP-Hash, Session, Datum) 18. Sicherheit Eigenschaft Beschreibung CSRF-Schutz Token auf allen POST-Formularen XSS-Schutz e() = htmlspecialchars() auf allen Ausgaben SQL-Injection PDO Prepared Statements überall Passwort-Hashing bcrypt Cost-Faktor 12 2FA 6-stelliger Code per Email, 10min gültig, einmalig Upload-Schutz PHP-Ausführung in uploads/ per .htaccess gesperrt Rollen-Prüfung Jede Admin-Seite prüft Rolle und Eigentumsrecht Newsletter DSGVO Double-Opt-In, Abmelde-Link in jeder Email Besucher-Tracking Nur MD5-Hash der IP — kein Rückschluss möglich DEBUG_MODE In Produktion auf false — keine Fehler im Browser Produktions-Checkliste • DEBUG_MODE in config.php auf false setzen • install.php löschen oder per .htaccess sperren • HTTPS verwenden (SSL-Zertifikat) • Starkes Admin-Passwort (min. 12 Zeichen mit Sonderzeichen) • Regelmäßige Datenbank-Backups 19. Häufige Probleme & Lösungen 500-Fehler ohne Ausgabe / Weißer Screen DEBUG_MODE in config.php temporär auf true setzen. PHP-Fehlerlog des Hosters prüfen. Seite zeigt "Hat möglicherweise ein temporäres Problem" PHP Parse Error — kein Syntaxfehler-Output weil DEBUG_MODE=false. Fehlerlog prüfen oder test.php mit phpinfo() anlegen. Bilder nicht sichtbar SITE_URL in config.php prüfen — kein abschließender Slash. RewriteBase in .htaccess muss zum Ordner passen. Emails werden nicht gesendet SMTP-Einstellungen prüfen. Viele Hoster blockieren Standard PHP mail(). Spam-Ordner prüfen. Herz-Button reagiert nicht update.php muss im Root liegen. Cookie-Pfad muss mit dem CMS-Pfad übereinstimmen (SITE_URL). Tabelle varient_post_likes muss existieren. 2FA-Code kommt nicht an Mail-Konfiguration prüfen. Spam-Ordner prüfen. Code ist 10 Minuten gültig — bei Ablauf "Code erneut senden" klicken. Datum-Picker für geplante Veröffentlichung nicht sichtbar Status auf "Published" setzen — der Picker erscheint automatisch per JavaScript. Mediathek zeigt keine Videos/Audios admin/media.php muss aktuell sein (Version 1.2.0). Dateitypen: MP4, WEBM, MOV, MP3, WAV, OGG, M4A. Suche findet nichts Mindestens 2 Zeichen eingeben. Tabelle varient_posts muss status='published' Einträge haben. $ is not defined (JavaScript) jQuery fehlt. In create.php / edit.php muss jQuery vor Select2 geladen sein. 20. Changelog Version 1.2.0 — Neuerungen • Volltextsuche (search.php) — Titel, Content, Excerpt, Kategorie mit Highlight • Druckansicht / PDF-Export (print.php) — sauberes Layout ohne UI • Autor-Profilseite (profile.php) — öffentlich, mit Statistiken und Artikel-Grid • Geplante Veröffentlichung — Datum-Picker im Post-Erstellen/Bearbeiten • Lesezeit-Anzeige auf Post-Karten und Detailseite • Sitemap.xml automatisch generiert (sitemap.php) • robots.txt dynamisch mit Sitemap-URL (robots.php) • Kanonische URLs auf allen Seiten • Kommentar-Benachrichtigung per Email bei Antworten • Top-Posts im Dashboard (Top 5 Views + Top 5 Likes) • Mediathek zeigt Bilder, Videos und Audio mit Typ-Filter • Suchfeld direkt im Header auf allen Seiten Version 1.1.0 • Featured-Badge auf Post-Karten • Herz-Bewertungssystem (Cookie-basiert, AJAX) • Besucher-Statistik im Footer • Automatisches Header-Bild von Picsum Photos • Tag-Wolke mit dynamischer Schriftgröße • Banner-Verwaltung (2× 468×60 px) • Newsletter DSGVO Double-Opt-In • RSS-Feed mit Kategorie-Filter • 2-Faktor-Authentifizierung (6-stellig per Email) • PHP 8.4 Kompatibilität Version 1.0.0 — Initial Release • User-System mit 4 Rollen, Post-System mit 4 Typen • Quill.js Editor, Kategorien & Tags, Kommentar-Moderation • Dark Mode, SEO Meta, CSRF-Schutz, Passwort-Reset • 4-Schritt-Installations-Wizard, Bootstrap 5
Startseite mit Blog-Liste, Detail-Ansicht, Admin erstellt Blogs mit Bild-Upload. Kompakt & effizient. Features: Startseite: - Grid-Layout (350px Karten) - Bild-Preview - Excerpt (150 Zeichen) - Datum & Views - Click-to-Post Detail-Ansicht: - Vollbild-Bild - Kompletter Inhalt - View-Counter - Zurück-Link Admin: - Post erstellen (Titel, Inhalt, Bild) - Bild-Upload (JPG, PNG, GIF, WEBP) - Post-Liste mit Löschen - Statistiken (Posts, Views)
🎨 InkVault - Tattoo Portal 📋 Inhaltsverzeichnis 1. [Überblick](überblick) 2. [Features](features) 3. [Systemanforderungen](systemanforderungen) 4. [Installation](installation) 5. [Datenbank-Struktur](datenbank-struktur) 6. [Account-Typen](account-typen) 7. [Funktionen](funktionen) 8. [Werbung-System](werbung-system) 9. [Dateistruktur](dateistruktur) 10. [Konfiguration](konfiguration) 11. [Troubleshooting](troubleshooting) 12. [Sicherheit](sicherheit) 📖 Überblick InkVault ist ein professionelles Tattoo-Portal, das Tätowierer und Tattoo-Enthusiasten zusammenbringt. Benutzer können ihre fertigen Tattoos und Vorlagen hochladen, während Tätowierer vollständige Studio-Profile mit Kontaktmöglichkeiten erstellen können. **Hauptmerkmale:** - 🎨 Separate Bereiche für Tattoos & Vorlagen - 👨🎨 Vollständige Tätowierer-Profile mit Studio-Infos - 🖼️ Automatische WebP-Konvertierung aller Uploads - 💬 Kommentar-System mit Admin-Freigabe - ❤️ Like-System - 🔍 Erweiterte Suche & Filter - 📧 Kontaktformular für Tätowierer - 💬 WhatsApp-Integration - 📢 Flexibles Werbung-System - 🔒 Benutzer-Verwaltung mit Sperr-Funktion ✨ Features Für alle Besucher: - ✅ Tattoo-Galerie durchsuchen (24 pro Seite) - ✅ Vorlagen-Galerie durchsuchen (24 pro Seite) - ✅ Tätowierer finden (nach Stadt/PLZ) - ✅ Lightbox für Bilder - ✅ Filter nach Tags - ✅ Tätowierer kontaktieren Für registrierte User: - ✅ Tattoos hochladen - ✅ Vorlagen hochladen - ✅ Bilder liken ❤️ - ✅ Kommentare schreiben - ✅ Eigene Uploads verwalten Für Tätowierer (Artist-Account): - ✅ Vollständiges Studio-Profil - ✅ Geschäftsadresse & Kontaktdaten - ✅ Öffnungszeiten & Preise - ✅ WhatsApp-Button - ✅ Portfolio (Tattoos & Vorlagen) - ✅ Kontaktanfragen empfangen - ✅ Nachrichtenverwaltung Für Admins: - ✅ Benutzer sperren/löschen - ✅ Kommentare freigeben/ablehnen - ✅ Werbung an 4 Positionen schalten - ✅ Statistiken ansehen - ✅ Vollständige Moderation 💻 Systemanforderungen - **PHP:** 8.0 oder höher - **MySQL:** 5.7 oder höher - **Apache/Nginx** mit mod_rewrite - **Schreibrechte** für /uploads Ordner **PHP Extensions:** - PDO - PDO_MySQL - **GD** (für WebP-Konvertierung - WICHTIG!) - mbstring 📥 Installation Schritt 1: Dateien hochladen bash Alle Dateien in Ihr Webverzeichnis hochladen Beispiel: /public_html/tattoo-portal/ Schritt 2: Ordner-Berechtigungen bash chmod 755 uploads/ chmod 755 uploads/tattoos/ chmod 755 uploads/templates/ chmod 755 uploads/profiles/ Schritt 3: Installation starten 1. **Browser öffnen:** `https://ihre-domain.de/install.php` 2. **Datenbank-Informationen:** - DB Host: `localhost` - DB Name: `tattoo_db` - DB User: `ihr_db_user` - DB Password: `ihr_db_passwort` 3. **Admin-Account erstellen:** - Username: `admin` - Email: `admin@ihre-domain.de` - Password: `sicheres-passwort` 4. **PayPal Email (Optional):** - Leer lassen (Portal ist kostenlos) - Nur für spätere Monetarisierung 5. **Installieren klicken** 6. **install.php wird automatisch gelöscht** Schritt 4: Fertig! Die Installation erstellt automatisch: - ✅ 9 Datenbank-Tabellen - ✅ 4 Werbeplätze (Header, Sidebar, Between, Footer) - ✅ Admin-Account - ✅ config.php mit allen Einstellungen 🗄️ Datenbank-Struktur Tabelle: tp_users sql - id (Primary Key) - username (UNIQUE) - email (UNIQUE) - password_hash - account_type (ENUM: 'user', 'artist') - is_admin (0/1) - is_blocked (0/1) - avatar (WebP) - created_at Tabelle: tp_artist_profiles sql - id (Primary Key) - user_id (Foreign Key → users) - studio_name - bio - address - city - postal_code - phone - whatsapp - email - website - instagram - facebook - opening_hours (TEXT) - price_info (TEXT) - banner (WebP) Tabelle: tp_tattoos sql - id (Primary Key) - user_id (Foreign Key → users) - title - image_path (WebP) - tag (automatisch aus erstem Wort) - views - likes - created_at Tabelle: tp_templates sql - id (Primary Key) - user_id (Foreign Key → users) - title - image_path (WebP) - tag (automatisch aus erstem Wort) - views - likes - created_at Tabelle: tp_likes sql - id (Primary Key) - user_id (Foreign Key → users) - item_id - item_type (ENUM: 'tattoo', 'template') - created_at - UNIQUE: (user_id, item_id, item_type) Tabelle: tp_comments sql - id (Primary Key) - user_id (Foreign Key → users) - item_id - item_type (ENUM: 'tattoo', 'template') - comment (TEXT) - approved (0/1) - created_at Tabelle: tp_ads sql - id (Primary Key) - position (ENUM: 'header', 'sidebar', 'between', 'footer') - title - code (TEXT - HTML/JavaScript) - status (ENUM: 'active', 'inactive') - created_at Tabelle: tp_messages sql - id (Primary Key) - artist_id (Foreign Key → users) - sender_name - sender_email - subject - message (TEXT) - is_read (0/1) - created_at 👤 Account-Typen Bei Registrierung wählbar: **1. Privat (User):** - Tattoos hochladen - Vorlagen hochladen - Liken & Kommentieren - Tätowierer kontaktieren **2. Tätowierer (Artist):** - Alles was User kann PLUS: - Studio-Profil erstellen - Kontaktanfragen empfangen - Portfolio aufbauen - Geschäftsinformationen hinterlegen **3. Admin:** - Wird in Datenbank gesetzt (is_admin = 1) - Volle Kontrolle über Portal 🛠️ Funktionen Upload-System: **1. Tattoos hochladen:** 1. Login 2. Navigation → Upload 3. Typ: \"Tattoo\" wählen 4. Titel eingeben (z.B. \"Tribal Oberarm\") 5. Bild hochladen (JPG/PNG/GIF/WebP) 6. Upload → Automatisch zu WebP konvertiert 7. Tag automatisch generiert (\"tribal\") **2. Vorlagen hochladen:** Gleicher Ablauf, nur Typ: \"Vorlage\" wählen **Tag-System:** - Erstes Wort vom Titel = automatischer Tag - \"Tribal Oberarm\" → Tag: \"tribal\" - \"Drache Rücken\" → Tag: \"drache\" - Suchbar über Filter Tätowierer-Profil einrichten: 1. Als \"Tätowierer\" registrieren 2. Navigation → \"Mein Studio\" 3. Alle Felder ausfüllen: ├─ Profilbild & Banner ├─ Studio-Name ├─ Bio ├─ Adresse (Straße, PLZ, Stadt) ├─ Telefon ├─ WhatsApp (mit Ländercode: +49...) ├─ E-Mail ├─ Website ├─ Instagram & Facebook ├─ Öffnungszeiten └─ Preis-Informationen 4. Speichern 5. Profil ist öffentlich sichtbar Kontaktaufnahme: **Besucher → Tätowierer:** 1. **E-Mail-Formular:** - Auf Artist-Profil - Nachricht senden - Tätowierer erhält Nachricht in \"Nachrichten\" 2. **WhatsApp:** - Click auf WhatsApp-Button - Öffnet WhatsApp Web/App 3. **Telefon:** - Click auf Telefonnummer - Click-to-Call Galerie & Suche: **Tattoos durchsuchen:** 1. Navigation → Tattoos 2. Filter verwenden: ├─ Suche nach Titel └─ Suche nach Tag 3. 24 Bilder pro Seite 4. Click auf Bild → Detail-Ansicht 5. Liken & Kommentieren **Tätowierer finden:** 1. Navigation → Tätowierer 2. Filter: ├─ Nach Stadt └─ Nach PLZ 3. Click auf Profil → Vollständige Infos 📢 Werbung-System 4 Werbeplätze (nur Admin): **1. Header Banner (728x90)** - Position: Unter Navigation - Dateien: index.php - Ideal für: Hauptwerbung **2. Sidebar (300x250)** - Position: Rechte Spalte - Dateien: index.php - Ideal für: Produkte, Dienstleistungen **3. Between Gallery (468x60)** - Position: Zwischen Galerien in Artist-Profil - Dateien: artist.php - Ideal für: Contextual Ads **4. Footer (728x90)** - Position: Vor </body> - Dateien: tattoos.php, templates.php, artists.php, artist.php - Ideal für: Zusätzliche Werbung Werbung verwalten: 1. Als Admin einloggen 2. Navigation → Admin 3. Sektion \"Werbeplätze\" 4. Position wählen 5. Titel eingeben 6. HTML/JavaScript Code einfügen 7. Status: Aktiv/Inaktiv 8. Speichern **Beispiel-Code:** html <div style=\"text-align:center;padding:20px;background:f0f0f0\"> <img src=\"banner.jpg\" alt=\"Werbung\" style=\"max-width:100%\"> </div> oder html <script async src=\"https://pagead2.googlesyndication.com/...\"></script> 📁 Dateistruktur tattoo-portal/ │ ├── config.php Konfiguration (von install.php erstellt) ├── functions.php Hilfsfunktionen ├── install.php Installation │ ├── style.css Design (Lila/Pink Tattoo-Theme) ├── header.php Header mit Logo ├── nav.php Navigation │ ├── index.php Startseite ├── tattoos.php Tattoo-Galerie (24 pro Seite) ├── templates.php Vorlagen-Galerie (24 pro Seite) ├── artists.php Tätowierer-Übersicht ├── artist.php Einzelnes Tätowierer-Profil ├── view.php Detail-Ansicht (Likes, Kommentare) ├── upload.php Upload-Formular │ ├── login.php Login ├── logout.php Logout ├── register.php Registrierung (User/Artist) │ ├── my-studio.php Studio-Verwaltung (nur Artist) ├── messages.php Kontaktanfragen (nur Artist) │ ├── admin.php Admin-Panel │ └── uploads/ ├── tattoos/ Tattoo-Bilder (WebP) │ └── index.php Schutz ├── templates/ Vorlagen-Bilder (WebP) │ └── index.php Schutz └── profiles/ Profilbilder (WebP) └── index.php Schutz ⚙️ Konfiguration config.php (wird von install.php erstellt) php <?php // Datenbank define(\"DB_HOST\", \"localhost\"); define(\"DB_NAME\", \"tattoo_db\"); define(\"DB_USER\", \"db_user\"); define(\"DB_PASS\", \"db_password\"); define(\"DB_PREFIX\", \"tp_\"); // Site define(\"SITE_NAME\", \"InkVault\"); define(\"ITEMS_PER_PAGE\", 24); Anpassungen: **Site-Name ändern:** php define(\"SITE_NAME\", \"Tattoo Gallery\"); **Bilder pro Seite ändern:** php define(\"ITEMS_PER_PAGE\", 48); // Standard: 24 📸 Bildverarbeitung Automatische WebP-Konvertierung: **Alle hochgeladenen Bilder werden automatisch zu WebP konvertiert:** - ✅ JPG → WebP - ✅ JPEG → WebP - ✅ PNG → WebP (mit Transparenz) - ✅ GIF → WebP - ✅ WebP → WebP (kopiert) **Qualität:** 85% **Vorteile:** - Kleinere Dateigröße - Schnellere Ladezeiten - Moderne Browser-Unterstützung **Funktion in functions.php:** php convertToWebP($source, $destination, $quality = 85) uploadImage($file, $folder, $maxSize = 10000000) 👥 Benutzung Als Besucher (nicht eingeloggt): 1. **Startseite besuchen** 2. **Galerien durchsuchen:** - Tattoos anschauen - Vorlagen anschauen - Tätowierer finden 3. **Tätowierer kontaktieren** (via Formular) Als User (Privat-Account): 1. **Registrieren:** Account-Typ \"Privat\" wählen 2. **Tattoos hochladen:** - Upload → Typ \"Tattoo\" - Titel: \"Tribal Oberarm\" - Bild hochladen - Automatisch Tag: \"tribal\" 3. **Vorlagen hochladen:** - Upload → Typ \"Vorlage\" - Titel: \"Drache Rücken\" - Automatisch Tag: \"drache\" 4. **Interagieren:** - Bilder liken ❤️ - Kommentare schreiben - Tätowierer kontaktieren Als Tätowierer (Artist-Account): 1. **Registrieren:** Account-Typ \"Tätowierer\" wählen 2. **Studio-Profil erstellen:** - Navigation → \"Mein Studio\" - Alle Informationen eingeben: - Studio-Name: \"Ink & Art Studio\" - Bio: Beschreibung des Studios - Adresse: Straße, PLZ, Stadt - Telefon: 0123456789 - WhatsApp: +49123456789 - E-Mail: studio@example.de - Website: https://studio-website.de - Instagram: username (ohne @) - Facebook: Seitenname - Öffnungszeiten: Mo-Fr: 10-18 Uhr Sa: 10-16 Uhr So: Geschlossen - Preise: Beratung: Kostenlos Ab 80€ pro Stunde Mindestsatz: 60€ - Profilbild & Banner hochladen - Speichern 3. **Portfolio aufbauen:** - Tattoos hochladen - Vorlagen hochladen - Alles erscheint im Profil 4. **Kontaktanfragen verwalten:** - Navigation → \"Nachrichten\" - Neue Nachrichten sehen - Per E-Mail antworten - Als gelesen markieren - Löschen Als Admin: 1. **Admin-Panel öffnen:** - Navigation → Admin - Dashboard mit Statistiken 2. **Benutzer verwalten:** - User sperren (🚫) - User löschen (🗑️) - Account-Typ sehen - Registrierungsdatum 3. **Kommentare moderieren:** - Wartende Kommentare anzeigen - Freigeben (✓) - Ablehnen/Löschen (🗑️) - Zum Bild springen 4. **Werbung schalten:** - 4 Positionen verfügbar - Code einfügen (HTML/JS) - Status setzen (Aktiv/Inaktiv) - Titel bearbeiten 🎯 Tag-System Automatische Tag-Generierung: **Wie es funktioniert:** Titel: \"Tribal Oberarm Schwarz\" → Tag: \"tribal\" Titel: \"Drache Rücken Bunt\" → Tag: \"drache\" Titel: \"Rose Klein Handgelenk\" → Tag: \"rose\" **Erstes Wort wird kleingeschrieben und als Tag gespeichert.** Suche nach Tags: 1. Tattoos/Vorlagen-Seite 2. Filter: Tag eingeben 3. Nur Bilder mit diesem Tag anzeigen **Beliebte Tags:** - tribal - drache - rose - skull - mandala - blackwork - realistisch - oldschool 🔍 Suche & Filter Tattoos/Vorlagen: **Filter-Optionen:** - 🔤 **Titel:** Freitext-Suche - 🏷️ **Tag:** Nach Kategorie filtern **Beispiel:** Titel: \"Drache\" Tag: \"tribal\" → Zeigt alle Tribal-Tattoos mit \"Drache\" im Titel Tätowierer: **Filter-Optionen:** - 🏙️ **Stadt:** z.B. \"Berlin\" - 📮 **PLZ:** z.B. \"10115\" oder \"101\" (Teilsuche) **Beispiel:** Stadt: \"München\" → Zeigt alle Tätowierer in München 💬 Kommentar-System Ablauf: 1. **User schreibt Kommentar:** - Auf Tattoo/Vorlage Detail-Seite - Kommentar eingeben - Abschicken - Status: **Pending** (approved = 0) 2. **Admin prüft Kommentar:** - Admin-Panel → Wartende Kommentare - Kommentar lesen - Freigeben oder Löschen 3. **Kommentar wird sichtbar:** - Nach Freigabe - Unter dem Bild angezeigt - Chronologisch sortiert **Schutz vor Spam/Hate:** - Alle Kommentare müssen genehmigt werden - Admin kann unangemessene Kommentare löschen 📧 Kontakt-System Kontaktformular: **Besucher kontaktiert Tätowierer:** 1. **Artist-Profil öffnen** 2. **Kontakt-Bereich:** - Name eingeben - E-Mail eingeben - Betreff (optional) - Nachricht schreiben - Senden 3. **Tätowierer erhält Nachricht:** - Navigation → Nachrichten - Benachrichtigung \"NEU\" - Kann per E-Mail antworten WhatsApp-Integration: **WhatsApp-Button auf Artist-Profil:** Telefon: +49123456789 → WhatsApp-Button erscheint → Click öffnet wa.me/49123456789 **Format:** Ländercode ohne + in URL 🖼️ Lightbox Funktion: - Click auf Bild in Galerie - Bild öffnet sich groß - Dunkler Hintergrund - Click außerhalb → Schließen - X-Button → Schließen **JavaScript:** javascript function openLightbox(src, title) { document.getElementById('lightbox').classList.add('active'); document.getElementById('lightbox-img').src = src; document.getElementById('lightbox-img').alt = title; } function closeLightbox() { document.getElementById('lightbox').classList.remove('active'); } 🐛 Troubleshooting Problem: WebP-Konvertierung funktioniert nicht **Lösung:** 1. PHP GD Extension installiert? bash php -m | grep -i gd 2. WebP-Support in GD aktiviert? php <?php phpinfo(); ?> // Suche nach \"WebP Support\" 3. Falls nicht installiert: bash Ubuntu/Debian sudo apt-get install php-gd sudo systemctl restart apache2 Problem: \"DB Error\" bei Installation **Lösung:** 1. Datenbank existiert? 2. User hat CREATE TABLE Rechte? 3. Credentials korrekt? 4. MySQL-Server läuft? Problem: Bilder werden nicht angezeigt **Lösung:** 1. Ordner-Berechtigungen: bash chmod 755 uploads/ chmod 755 uploads/tattoos/ chmod 755 uploads/templates/ chmod 755 uploads/profiles/ 2. PHP upload_max_filesize erhöhen 3. Pfad in Datenbank prüfen (sollte OHNE \"uploads/\" sein) Problem: \"Headers already sent\" **Lösung:** 1. Keine Ausgabe vor session_start() 2. UTF-8 ohne BOM speichern 3. Keine Leerzeilen am Anfang Problem: Kommentare werden nicht angezeigt **Checklist:** - ✅ Kommentar geschrieben? - ✅ Admin hat freigegeben? (approved = 1) - ✅ Browser-Cache geleert? Problem: WhatsApp-Button funktioniert nicht **Lösung:** 1. Telefonnummer mit Ländercode: +49123456789 2. Keine Leerzeichen oder Sonderzeichen 3. Format wird automatisch bereinigt in Link Problem: Upload schlägt fehl **Lösung:** 1. Datei zu groß? (max 10 MB) 2. Richtiges Format? (JPG, PNG, GIF, WebP) 3. GD Extension aktiv? 4. Schreibrechte auf uploads/? 🔐 Sicherheit Implementierte Schutzmaßnahmen: 1. **SQL Injection geschützt:** - PDO Prepared Statements - Keine direkte String-Konkatenation 2. **XSS geschützt:** - htmlspecialchars() für alle Ausgaben - e() Helper-Funktion 3. **CSRF Schutz:** - Session-basierte Authentifizierung - Regeneration nach Login 4. **File Upload Sicherheit:** - Whitelist für Dateitypen - Größenbeschränkung (10 MB) - Eindeutige Dateinamen (uniqid()) - Directory Listing deaktiviert (index.php) 5. **Session-Sicherheit:** - session_regenerate_id() - Sichere Logout-Funktion - HTTPOnly Cookies Beste Praktiken: 1. **SSL/HTTPS verwenden** (Let's Encrypt kostenlos) 2. **Starkes Admin-Passwort** 3. **Regelmäßige Backups** 4. **PHP aktuell halten** 5. **Mod_Security aktivieren** .htaccess für uploads/: apache <FilesMatch \"\.(php|php3|php4|php5|phtml)$\"> Order Allow,Deny Deny from all </FilesMatch> 💡 Tipps & Tricks Performance optimieren: 1. **Bilder vor Upload optimieren** - Auflösung max 1920x1920 - WebP spart Speicher 2. **Datenbank-Indizes nutzen** - Bereits vorhanden für: - Tags - Städte - PLZ - created_at 3. **Caching aktivieren:** php // In .htaccess <IfModule mod_expires.c> ExpiresActive On ExpiresByType image/webp \"access plus 1 year\" </IfModule> SEO optimieren: 1. **Alt-Tags:** - Titel wird automatisch als alt= verwendet - Gut für Suchmaschinen 2. **Sitemap erstellen:** - Für Tattoos/Vorlagen - Für Artist-Profile 3. **Meta-Tags hinzufügen:** - Open Graph für Social Sharing - Description Tags Werbung optimieren: 1. **A/B Testing:** - Verschiedene Positionen testen - Click-Through-Rate messen 2. **Responsive Ads:** - Mobile-freundliche Banner - Flexible Größen 3. **Google AdSense:** - Code in Admin einfügen - Auto-Ads aktivieren 📊 Admin-Panel Dashboard: **Statistiken:** - Anzahl Benutzer - Anzahl Tattoos - Anzahl Vorlagen - Wartende Kommentare Funktionen: **1. Werbeplätze verwalten:** Header Banner → 728x90 → Unter Navigation Sidebar → 300x250 → Rechts Between Gallery → 468x60 → In Artist-Profil Footer → 728x90 → Am Ende **2. Kommentare moderieren:** Für jeden Kommentar: ├─ Username sehen ├─ Kommentar lesen ├─ ✓ Freigeben ├─ 🗑️ Löschen └─ 👁️ Zum Bild springen **3. Benutzer verwalten:** User-Tabelle: ├─ ID ├─ Username ├─ Email ├─ Typ (User/Artist/Admin) ├─ Status (Aktiv/Gesperrt) ├─ Registrierungsdatum └─ Aktionen: ├─ 🚫 Sperren/Entsperren └─ 🗑️ Löschen 🎨 Design-Anpassungen Farben ändern (style.css): css :root { --primary: 667eea; /* Lila */ --secondary: 764ba2; /* Dunkellila */ --accent: e94560; /* Pink/Rot */ --dark: 1a1a2e; /* Dunkelblau */ --darker: 0f0f1e; /* Fast Schwarz */ } Header-Bild ändern: **In style.css:** css .header { background: linear-gradient(...), url('IHR-BILD.jpg') center/cover; } **Kostenlose Tattoo-Bilder:** - Pixabay: https://pixabay.com/de/images/search/tattoo/ - Unsplash: https://unsplash.com/s/photos/tattoo - Pexels: https://www.pexels.com/search/tattoo/ Layout anpassen: **Bilder pro Zeile ändern (style.css):** css .gallery { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); /* Kleinerer Wert = mehr Bilder pro Zeile */ } 📱 Responsive Design **Breakpoints:** - Desktop: > 768px (volle Navigation) - Mobile: ≤ 768px (Icons only) **Mobile Optimierungen:** - Navigation klappt zu Icons - Sidebar verschwindet - Grid passt sich an - Touch-optimiert 🔄 Backup & Wartung Regelmäßige Backups: **1. Datenbank:** bash mysqldump -u user -p tattoo_db > backup_$(date +%Y%m%d).sql **2. Uploads:** bash tar -czf uploads_backup_$(date +%Y%m%d).tar.gz uploads/ Updates: 1. Backup erstellen 2. Neue Dateien hochladen 3. config.php NICHT überschreiben 4. Testen 📞 Support Bei Problemen: 1. **README durchlesen** (diese Datei) 2. **Troubleshooting-Sektion** checken 3. **PHP Error Logs** prüfen 4. **Browser Console** (F12) prüfen Häufige Fehler: **500 Error:** - PHP Syntaxfehler - Fehlende Extension (GD) - Dateiberechtigungen **404 Error:** - mod_rewrite nicht aktiviert - .htaccess fehlt **Blank Page:** - PHP Error Reporting aktivieren - error_log prüfen 📜 Changelog Version 1.0 (Aktuell) **Features:** - ✅ Dual Account-System (User/Artist) - ✅ Automatische WebP-Konvertierung - ✅ Tag-Generierung aus Titel - ✅ Kommentar-System mit Moderation - ✅ Like-System - ✅ Studio-Profile für Tätowierer - ✅ Kontaktformular - ✅ WhatsApp-Integration - ✅ 4 Werbeplätze - ✅ Admin-Panel - ✅ Suche & Filter - ✅ Lightbox - ✅ Responsive Design 🎯 Roadmap (Zukünftige Features) Mögliche Erweiterungen: - [ ] **Bewertungs-System** (1-5 Sterne für Tätowierer) - [ ] **Buchungs-System** (Termine online buchen) - [ ] **Portfolio-Downloads** (ZIP mit allen Bildern) - [ ] **Social Sharing** (Teilen auf Instagram/Facebook) - [ ] **Newsletter-System** - [ ] **Favoriten-Liste** für User - [ ] **Erweiterte Analytics** (Google Analytics) - [ ] **Multi-Sprache** (EN/DE) - [ ] **Push-Benachrichtigungen** - [ ] **API für Mobile Apps** 🏆 Best Practices Für Tätowierer: 1. **Qualitativ hochwertige Fotos verwenden** 2. **Profil vollständig ausfüllen** 3. **Regelmäßig Portfolio aktualisieren** 4. **Auf Kontaktanfragen schnell antworten** 5. **Öffnungszeiten aktuell halten** Für User: 1. **Aussagekräftige Titel wählen** - ✅ \"Tribal Oberarm Schwarz\" - ❌ \"Mein Tattoo\" 2. **Gute Fotos hochladen** - Heller Hintergrund - Gute Auflösung - Tattoo im Fokus 3. **Tags nutzen** - Erste Wort = wichtig - Beschreibende Begriffe Für Admins: 1. **Kommentare zeitnah freigeben** 2. **Spam/Hate konsequent löschen** 3. **User nur bei Verstößen sperren** 4. **Werbung dezent platzieren** 5. **Regelmäßig Statistiken prüfen** 🌟 Highlights Was macht InkVault besonders? 1. **🎨 Dual-System:** - Tattoos UND Vorlagen getrennt - Verschiedene Zielgruppen 2. **👨🎨 Tätowierer-freundlich:** - Vollständige Studio-Profile - WhatsApp-Integration - Kontaktformular - Portfolio-Präsentation 3. **⚡ Performance:** - WebP = schnelle Ladezeiten - Optimierte Datenbank - Responsive Images 4. **🛡️ Sicherheit:** - Kommentar-Moderation - User-Sperre möglich - Upload-Schutz 5. **🔍 Benutzerfreundlich:** - Automatische Tags - Intuitive Suche - Lightbox - Mobile-optimiert 📄 Lizenz Proprietär - Alle Rechte vorbehalten 🎉 Viel Erfolg mit InkVault! **Entwickelt mit ❤️ für die Tattoo-Community** Bei Fragen oder Problemen: README durchlesen oder Admin kontaktieren. **Version:** 1.0 **Letzte Aktualisierung:** Januar 2025 **Sprache:** Deutsch 🇩🇪
🖼️ Bildschutz - Wasserzeichen auf Bilder 📋 Überblick Professioneller Bildschutz-Service zum Hinzufügen von Wasserzeichen auf Bilder. **Features:** - 🖼️ **Alle Formate:** JPG, PNG, WEBP, GIF, BMP - 📝 **Text oder Logo:** Flexible Wasserzeichen-Typen - ⚡ **Batch-Processing:** Mehrere Bilder gleichzeitig - 🎨 **Anpassbar:** Position, Größe, Farbe, Transparenz - 📱 **Responsive:** Mobile-optimiert - 🚀 **Schnell:** Sofortige Verarbeitung ✨ Features im Detail Unterstützte Formate: | Format | Lesen | Schreiben | Transparenz | |--|-|--|-| | JPG | ✅ | ✅ | ❌ | | PNG | ✅ | ✅ | ✅ | | WEBP | ✅ | ✅ | ✅ | | GIF | ✅ | ✅ | ✅ | | BMP | ✅ | ✅ | ❌ | Wasserzeichen-Typen: **Text-Wasserzeichen:** - Eigener Text (z.B. \"© 2026 Ihr Name\") - Schriftgröße: 10-100px - Farbe: Frei wählbar - Transparenz: 0-100% **Logo-Wasserzeichen:** - Eigenes Logo hochladen - Größe: 50-500px - Position frei wählbar - Transparenz: 0-100% Positionen: - ✅ Unten Rechts (Default) - ✅ Unten Links - ✅ Oben Rechts - ✅ Oben Links - ✅ Mitte Ausgabeformate: - Original beibehalten - Konvertierung zu JPG - Konvertierung zu PNG - Konvertierung zu WEBP 💻 Technische Details Dateien: - **index.php** - Upload & Einstellungen - **process.php** - Verarbeitung (ALLE FORMATE!) - **style.css** - Cyan/Blue Gradient-Design - **protected_images/** - Output-Verzeichnis Logo: svg Cyan→Blue Gradient mit Bild-Icon und ©-Symbol - Skalierbar - Eingebettet PHP-Funktionen: php loadImage() // JPG, PNG, WEBP, GIF, BMP saveImage() // Alle Formate mit Qualität addTextWatermark() // Text mit TrueType addLogoWatermark() // Logo mit Transparenz calculatePosition() // 5 Positionen 🚀 Installation Schritt 1: Dateien hochladen bash Alle Dateien in Webverzeichnis hochladen Schritt 2: Verzeichnisse prüfen bash chmod 755 protected_images/ Schritt 3: PHP-Extensions prüfen bash php -m | grep -E \"gd|imagick\" **Benötigt:** - ✅ GD Library (für Bildverarbeitung) - ✅ PHP 8.0+ empfohlen Schritt 4: TrueType-Font (Optional) bash Für bessere Text-Qualität: Lade arial.ttf herunter und lege es im Root ab **Ohne TTF:** System-Font wird verwendet (funktioniert, aber kleiner) 📖 Benutzung Text-Wasserzeichen: 1. **Bilder hochladen** (Drag & Drop oder Klick) 2. **\"Text\" auswählen** 3. **Text eingeben** (z.B. \"© 2026 Mein Name\") 4. **Schriftgröße einstellen** (10-100px) 5. **Farbe wählen** (Farbwähler) 6. **Position wählen** (z.B. \"Unten Rechts\") 7. **Transparenz einstellen** (0-100%) 8. **\"Wasserzeichen hinzufügen\" klicken** 9. **Geschützte Bilder herunterladen** Logo-Wasserzeichen: 1. **Bilder hochladen** 2. **\"Logo\" auswählen** 3. **Logo hochladen** (PNG mit Transparenz empfohlen) 4. **Logo-Größe einstellen** (50-500px) 5. **Position wählen** 6. **Transparenz einstellen** 7. **\"Wasserzeichen hinzufügen\" klicken** 8. **Geschützte Bilder herunterladen** Batch-Processing: 1. Mehrere Bilder auswählen (Strg/Cmd + Klick) 2. Einstellungen vornehmen 3. Alle Bilder werden mit gleichen Einstellungen verarbeitet 4. Einzeln herunterladen 🎨 Design-Anpassung Farben ändern: **In style.css:** css :root { --primary: 06b6d4; /* Cyan */ --secondary: 3b82f6; /* Blue */ --gradient: linear-gradient(135deg, var(--primary), var(--secondary)); } Logo-Farben: **In index.php (SVG):** html <stop offset=\"0%\" style=\"stop-color:06b6d4\" /> <stop offset=\"100%\" style=\"stop-color:3b82f6\" /> 🐛 Troubleshooting Problem: \"Konnte Bild nicht laden\" **Lösung:** 1. **GD Library installiert?** bash apt install php-gd oder yum install php-gd 2. **PHP neu starten:** bash systemctl restart php-fpm 3. **Format unterstützt?** php <?php print_r(gd_info()); ?> Problem: WEBP nicht unterstützt **Lösung:** bash PHP mit WEBP-Support kompilieren oder apt install php-gd libwebp-dev Problem: Text zu klein **Lösung:** 1. **TTF-Font verwenden:** - arial.ttf herunterladen - In Root-Verzeichnis legen - Automatisch erkannt! 2. **Schriftgröße erhöhen** (im Frontend) Problem: Transparenz geht verloren **Lösung:** - ✅ PNG verwenden (behält Transparenz) - ✅ WEBP verwenden (behält Transparenz) - ❌ JPG verwendet (keine Transparenz möglich) Problem: Zu langsam bei vielen Bildern **Lösung:** 1. **PHP Memory erhöhen:** ini memory_limit = 512M 2. **Max Upload Size erhöhen:** ini upload_max_filesize = 50M post_max_size = 50M 3. **Bilder vorher verkleinern** 🔒 Sicherheit Implementiert: - ✅ **File-Type Validierung** - ✅ **Directory Protection** (.htaccess) - ✅ **XSS-Schutz** (htmlspecialchars) - ✅ **Upload-Limits** Empfehlungen: 1. **HTTPS verwenden** (Let's Encrypt) 2. **Upload-Limit setzen** (max 10MB pro Bild) 3. **Rate-Limiting** (max X Uploads/Stunde) 4. **Temp-Files löschen** (automatisch nach 24h) .htaccess für protected_images/: apache <Files *.php> deny from all </Files> Order Deny,Allow Deny from all Allow from all 📊 Performance Benchmarks (PHP 8.2, 4GB RAM): | Bildgröße | Format | Verarbeitung | |--|--|--| | 1 MB | JPG | ~0.3s | | 2 MB | PNG | ~0.5s | | 3 MB | WEBP | ~0.4s | | 5 MB | GIF | ~1.2s | **Batch (10 Bilder à 2MB):** ~5-8 Sekunden Optimierung: php // In process.php anpassen: imagejpeg($image, $path, 85); // Qualität: 95→85 (schneller) imagepng($image, $path, 6); // Kompression: 9→6 (schneller) 💡 Tipps & Tricks Beste Ergebnisse: 1. **PNG für Logos** (Transparenz!) 2. **Weiße Schrift mit 80% Opacity** (gut sichtbar) 3. **Logo-Größe ~10-15% der Bildgröße** 4. **Position \"Unten Rechts\"** (Standard) Logo vorbereiten: bash Empfohlene Logo-Eigenschaften: Format: PNG Größe: 500x500px (quadratisch) Hintergrund: Transparent Farbe: Weiß oder Hell Batch-Workflow: 1. Alle Bilder in Ordner sammeln 2. Alle hochladen 3. Einstellungen einmal vornehmen 4. Alle verarbeiten 5. ZIP-Download (TODO: Feature) 🚀 Erweiterungen (Zukünftig) **Mögliche Features:** - [ ] ZIP-Download (alle geschützten Bilder) - [ ] Vorschau vor Verarbeitung - [ ] Wasserzeichen-Templates speichern - [ ] Mehrere Wasserzeichen pro Bild - [ ] Gekachelte Wasserzeichen - [ ] Metadata entfernen (EXIF) - [ ] Automatische Größenanpassung - [ ] Cloud-Upload (Dropbox, Google Drive) - [ ] API für Entwickler 🎨 Logo als separate Datei **logo.svg erstellen:** svg <svg width=\"200\" height=\"200\" xmlns=\"http://www.w3.org/2000/svg\"> <defs> <linearGradient id=\"grad\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\"> <stop offset=\"0%\" style=\"stop-color:06b6d4\" /> <stop offset=\"100%\" style=\"stop-color:3b82f6\" /> </linearGradient> </defs> <rect x=\"40\" y=\"60\" width=\"120\" height=\"90\" rx=\"8\" fill=\"url(grad)\"/> <circle cx=\"70\" cy=\"95\" r=\"12\" fill=\"white\" opacity=\"0.8\"/> <path d=\"M 50 130 L 75 105 L 105 130 L 135 105 L 135 145 L 50 145 Z\" fill=\"white\" opacity=\"0.8\"/> <text x=\"100\" y=\"180\" font-family=\"Arial\" font-size=\"24\" fill=\"white\" text-anchor=\"middle\" font-weight=\"bold\">©</text> </svg> **Einbinden:** html <img src=\"logo.svg\" alt=\"Bildschutz\" width=\"60\" height=\"60\"> 📝 Beispiel-Workflows Fotograf: 1. Shooting-Fotos hochladen 2. Logo mit Firmenname hochladen 3. Position: Unten Rechts 4. Transparenz: 70% 5. Verarbeiten 6. An Kunden senden Designer: 1. Portfolio-Bilder schützen 2. Text: \"© 2026 Designer Name\" 3. Schriftgröße: 24px 4. Position: Unten Links 5. Transparenz: 60% 6. Auf Website hochladen E-Commerce: 1. Produktfotos hochladen 2. Text: \"Nur bei Shop.de\" 3. Position: Mitte 4. Transparenz: 40% (gut sichtbar) 5. In Shop einbinden 📞 Support **Bei Problemen:** 1. README durchlesen 2. Troubleshooting checken 3. GD Library prüfen 4. PHP Error Log checken 📄 Rechtliches Wichtig: - ✅ Nur eigene Bilder schützen - ✅ Oder mit Erlaubnis des Fotografen - ⚠️ Wasserzeichen sind **kein 100% Schutz** - ⚠️ Technisch versierte können sie entfernen Best Practice: 1. Wasserzeichen + niedrige Auflösung (Web) 2. Originale nur nach Kauf/Bezahlung 3. Wasserzeichen über wichtige Bildbereiche 4. Kombination: Text + Logo 🎯 Best Practices User Experience: 1. **Einfacher Upload** (Drag & Drop) 2. **Live-Vorschau** (TODO) 3. **Schnelle Verarbeitung** 4. **Klare Download-Buttons** Code Quality: 1. **Alle Formate unterstützt** 2. **Error-Handling** 3. **Memory-Limits beachten** 4. **Sauberer Code** 📈 Format-Support-Matrix | Format | PHP GD | ImageMagick | Empfohlen für | |--|--|-|| | JPG | ✅ | ✅ | Fotos | | PNG | ✅ | ✅ | Grafiken | | WEBP | ✅* | ✅ | Web | | GIF | ✅ | ✅ | Animationen** | | BMP | ✅ | ✅ | Legacy | \* Benötigt libwebp ** Nur erstes Frame wird verarbeitet 📝 Changelog Version 2.0 (Aktuell) **Features:** - ✅ Komplett neu in PHP 8.4 - ✅ Alle Formate: JPG, PNG, WEBP, GIF, BMP - ✅ Text & Logo-Wasserzeichen - ✅ Batch-Processing - ✅ Anpassbare Positionen - ✅ Transparenz-Kontrolle - ✅ Format-Konvertierung - ✅ Modernes Design (Cyan/Blue) - ✅ Mobile-optimiert **Technisch:** - ✅ GD Library - ✅ TrueType Font Support - ✅ Alpha-Channel Handling - ✅ Memory-effizient 🏆 Credits **Design inspiriert von:** - Watermarkly - uMark - iWatermark **Powered by:** - PHP GD Library - TrueType Fonts 📄 Lizenz Proprietär - Alle Rechte vorbehalten 🎉 Viel Erfolg mit Bildschutz! **Version:** 2.0 **Stand:** Januar 2026 **Sprache:** Deutsch 🇩🇪 **PRODUKTIONSBEREIT!** 🚀 🆘 Quick-Start bash 1. Dateien hochladen 2. Browser öffnen 3. Bild hochladen 4. Einstellungen vornehmen 5. Verarbeiten 6. Herunterladen! Für bessere Qualität: - arial.ttf herunterladen - Im Root ablegen - Fertig! **Text-Wasserzeichen:** Schnell & einfach **Logo-Wasserzeichen:** Professionell **Batch-Processing:** Effizient! 💪
💬 PIWO-Chat Dein Server. Deine Regeln. Deine Privatsphäre. Ähnlich Whatsapp, Telegramm nur in mini Ausführung fürs Web. PIWO-Chat ist die kompromisslose Antwort auf datenhungrige Messenger-Giganten. Es ist eine vollständig verschlüsselte Web-App, die ohne externe Abhängigkeiten, Cloud-Zwang oder App-Store-Gängelung auskommt. Installiere deinen eigenen Messenger in Minuten auf deinem Webspace und behalte die 100%ige Souveränität über deine Daten. 🛡️ Unabhängigkeit trifft Sicherheit Während andere Messenger Metadaten in der Cloud sammeln, arbeitet PIWO-Chat autark auf deiner Hardware. Self-Hosted: Alles läuft über PHP und eine lokale SQLite-Datenbank. End-to-End Feeling: Nachrichten werden via AES-256-CBC verschlüsselt gespeichert. Zero External Dependencies: Keine Tracker, keine externen Bibliotheken von Drittanbietern. Hardened Security: Argon2id Passwort-Hashing, 2FA via E-Mail und Schutz gegen Brute-Force-Angriffe sind standardmäßig an Bord. 🚀 Funktionen, die begeistern Trotz der schlanken Architektur bietet PIWO-Chat den vollen Komfort moderner Kommunikation: Echtzeit-Chat: Einzel- und Gruppen-Chats mit Schreibstatus-Anzeige („... schreibt“) und Gelesen-Bestätigung (✓✓). Medien-Power: Sende Bilder (autom. WebP-Optimierung), Videos, Dokumente oder nimm Sprachnachrichten direkt im Browser auf. Emoji-Power: Über 650 Emojis mit integrierter deutscher Textsuche (z.B. „Feuer“ oder „Herz“). Admin-Kontrolle: Ein mächtiges Dashboard erlaubt die Benutzerverwaltung, das Einsehen von System-Logs und die Wartung der Datenbank mit nur einem Klick. Support-integriert: User können Admins über einen dedizierten Button direkt kontaktieren – ideal für geschlossene Communities oder Firmen-Intranets. 🛠️ Technische Exzellenz (Lightweight) PIWO-Chat ist so optimiert, dass es auf nahezu jedem Standard-Webhosting läuft: Stack: PHP 7.4+, Apache (mod_rewrite), SQLite3. Responsive Design: Ein modernes Dark-Mode Interface, das am Desktop genauso flüssig läuft wie als Progressive Web App auf dem Smartphone. One-Click Install: Lade den Inhalt des ZIP hoch, starte die install.php und dein Messenger ist einsatzbereit. Die Installationsdatei löscht sich aus Sicherheitsgründen danach selbst. PIWO-Chat ist mehr als ein Messenger – es ist dein privater digitaler Rückzugsort. Man könnte sogar für IOS und Android Apps entwickeln. Wenn man dann im User Profil einen QR Code Generator einbaut brauch der User nur noch den QR Code Scannen und kann den Chat auf Handy über die APP nutzen. Jetzt auf dem eigenen Server installieren | Dokumentation lesen
# 🌐 Webverzeichnis – PHP Link Directory Ein vollständiges, modernes Webverzeichnis-System mit PayPal-Integration, 2-Faktor-Authentifizierung und umfangreichem Admin-Panel. --- ## 🚀 Features ### Frontend - Modernes, responsives Design (Plus Jakarta Sans + DM Mono) - Öffentliches Verzeichnis mit Suche, Filterung & Sortierung - Kategorien mit Icons und Website-Anzahl - VIP/Premium Spotlight-Bereich - Click-Tracking mit automatischer Weiterleitung ### Benutzer - Registrierung & Login mit **2-Faktor-Authentifizierung** (E-Mail Code) - Dashboard mit Statistiken (Websites, Aufrufe, Zahlungen) - Website einreichen mit Screenshot-Upload (WebP-Konvertierung) - Plan-Auswahl & PayPal-Zahlung - Konto-Verwaltung (Passwort, 2FA) ### Admin-Panel - Übersicht mit Echtzeit-Statistiken & Umsatzzahlen - **Website freigeben / ablehnen** (mit E-Mail-Benachrichtigung) - Nutzerverwaltung (sperren, entsperren, 2FA zurücksetzen) - Einstellungen: PayPal Sandbox ↔ Live umschalten, SMTP, etc. - Website als \"Featured\" markieren ### Zahlungen & E-Mails - **PayPal IPN** (Instant Payment Notification) – vollautomatisch - Automatische Rechnung per E-Mail nach Zahlung - E-Mail bei Freischaltung / Ablehnung - Alle E-Mails als HTML-Templates ### Sicherheit - PDO Prepared Statements (SQL-Injection-Schutz) - CSRF-Token-Schutz auf allen Formularen - bcrypt Passwort-Hashing (Cost 12) - Session-Sicherheit (HttpOnly, SameSite, Secure) - Upload-Schutz (index.php in allen Upload-Ordnern) - 2FA mit Zeitbegrenzung (10 Minuten) --- ## 📋 Pakete / Pläne | Plan | Preis | Laufzeit | Backlinks | Do-Follow | Featured | |------|-------|----------|-----------|-----------|---------| | Free | 0 € | 10 Jahre | 1 | ❌ | ❌ | | Basic | 20 € | 10 Jahre | 1 | ✅ | ❌ | | Premium | 15 € | 1 Jahr | 2 | ✅ | ✅ | | VIP | 12 € | 1 Jahr | 5 | ✅ | ✅ | *Preise & Laufzeiten im Admin-Panel anpassbar* --- ## 🛠️ Installation ### Voraussetzungen - PHP 8.0+ (empfohlen: 8.4) - MySQL 5.7+ / MariaDB 10.3+ - GD-Extension (für WebP-Konvertierung) - cURL-Extension (für PayPal IPN) - SMTP-Zugang (für E-Mail-Versand) ### Schritt-für-Schritt **1. Dateien hochladen** ``` Alle Dateien in das gewünschte Webroot-Verzeichnis hochladen. z.B. /var/www/html/verzeichnis/ ``` **2. Berechtigungen setzen** ```bash chmod 755 uploads/ chmod 755 uploads/screenshots/ chmod 755 uploads/avatars/ chmod 644 *.php ``` **3. Installation starten** ``` Browser öffnen: https://ihredomain.de/install.php ``` **4. Installation Schritt 1: Datenbank** - Datenbankhost (meist: `localhost`) - Datenbankname (vorher in phpMyAdmin anlegen) - Tabellen-Prefix (Standard: `wv_`) - Datenbankbenutzer & Passwort **5. Installation Schritt 2: Konfiguration** - Website-Name und URL - Admin-Benutzername, E-Mail & Passwort - PayPal-E-Mail (Empfänger der Zahlungen) - SMTP-Zugangsdaten für E-Mail-Versand **6. Fertig!** - Die `install.php` löscht sich selbst - Admin-Panel: `https://ihredomain.de/admin/` - Frontend: `https://ihredomain.de/` --- ## ⚙️ PayPal einrichten ### Sandbox (Test-Modus) 1. PayPal Developer Account: https://developer.paypal.com 2. Sandbox-Konto erstellen 3. In `config.php`: `PAYPAL_SANDBOX = true` 4. Im Admin-Panel → Einstellungen → PayPal → Sandbox ### Live-Modus aktivieren 1. Admin-Panel → Einstellungen → PayPal → **Live** 2. PayPal IPN-URL eintragen: `https://ihredomain.de/paypal-ipn.php` 3. PayPal-Account → Profil → Benachrichtigungen → IPN aktivieren ### IPN-URL ``` https://ihredomain.de/paypal-ipn.php ``` --- ## 📧 E-Mail / SMTP einrichten ### Konfiguration ``` SMTP-Host: mail.ihredomain.de SMTP-Port: 587 (STARTTLS) oder 465 (SSL) SMTP-User: noreply@ihredomain.de SMTP-Pass: ihr-passwort ``` ### E-Mail-Templates Alle Templates in `/emails/`: - `twofa.php` – 2FA-Code - `invoice.php` – Rechnung nach Zahlung - `site_approved.php` – Website freigeschaltet - `site_rejected.php` – Website abgelehnt - `welcome.php` – Willkommen nach Registrierung - `admin_payment.php` – Admin: neue Zahlung - `admin_new_site.php` – Admin: neuer Eintrag --- ## 📁 Dateistruktur ``` webverzeichnis/ ├── install.php ← Installation (löscht sich selbst) ├── config.php ← Konfiguration (auto-generiert) ├── functions.php ← Hilfsfunktionen ├── index.php ← Startseite ├── verzeichnis.php ← Öffentliches Verzeichnis ├── neu-eintragen.php ← Website einreichen ├── paypal-zahlung.php ← PayPal-Weiterleitung ├── paypal-ipn.php ← PayPal IPN Handler ├── zahlung-erfolg.php ← Danke-Seite ├── zahlung-abbruch.php ← Abbruch-Seite ├── dashboard.php ← User Dashboard ├── meine-websites.php ← User: eigene Websites ├── konto.php ← Kontoeinstellungen + 2FA ├── login.php ← Login + 2FA ├── register.php ← Registrierung ├── logout.php ← Abmelden ├── click.php ← Click-Tracker ├── includes/ │ ├── header.php ← Header/Navigation │ └── footer.php ← Footer ├── emails/ ← E-Mail-Templates │ ├── twofa.php │ ├── invoice.php │ ├── site_approved.php │ ├── site_rejected.php │ ├── welcome.php │ ├── admin_payment.php │ └── admin_new_site.php ├── admin/ │ ├── index.php ← Admin Dashboard │ ├── websites.php ← Websites verwalten │ ├── users.php ← Nutzer verwalten │ ├── settings.php ← Einstellungen │ └── index.php ← Zugriffsschutz ├── uploads/ │ ├── screenshots/ ← Website-Screenshots │ └── avatars/ ← User-Avatare └── logs/ └── ipn.log ← PayPal IPN-Log ``` --- ## 🔧 Troubleshooting ### Problem: E-Mails werden nicht gesendet - SMTP-Zugangsdaten im Admin-Panel prüfen - Port 587 (STARTTLS) oder 465 (SSL) testen - Fallback: Wenn SMTP leer, wird `mail()` verwendet - IPN-Log prüfen: `/logs/ipn.log` ### Problem: Bilder werden nicht zu WebP konvertiert - PHP GD-Extension prüfen: `php -m | grep gd` - WebP-Support prüfen: `php -r \"phpinfo();\" | grep webp` - Schreibrechte auf `/uploads/screenshots/` prüfen ### Problem: PayPal IPN kommt nicht an - IPN-URL muss öffentlich erreichbar sein (kein localhost!) - PayPal-Account → Profil → IPN aktivieren - SSL/HTTPS erforderlich für Live-Modus - IPN-Log prüfen: `/logs/ipn.log` ### Problem: 2FA-Code kommt nicht - SMTP-Einstellungen prüfen - Spam-Ordner des Empfängers prüfen - SMTP-Log auf Serverebene prüfen ### Problem: install.php existiert noch - install.php wurde nach erfolgreicher Installation automatisch gelöscht - Falls nicht: manuell löschen! ### Fehler: \"Ungültiges CSRF-Token\" - Browser-Cache leeren - Session-Cookie löschen und neu anmelden --- ## 🔒 Sicherheitsempfehlungen 1. **HTTPS** immer aktivieren (Let's Encrypt) 2. `logs/` Verzeichnis nicht über Web erreichbar machen: ```apache # .htaccess RewriteRule ^logs/ - [F,L] ``` 3. PayPal auf **Live-Modus** stellen nach Tests 4. **2FA** für Admin-Account aktivieren 5. Regelmäßige **Datenbankbackups** --- ## 📄 Lizenz Privat / Eigennutzung. Alle Rechte vorbehalten.
# 📡 RSS-Verzeichnis – PHP-Skript Kostenloses RSS-Feed-Verzeichnis in PHP 8.0+ mit Live-Feed-Vorschau, RSS-Button-Generator, OPML-Export und Admin-Panel. ## Features - **Feed-Verzeichnis** – Kategorien mit Zähler, Suche & Filter, Sortierung - **Feed-Eintragen** – Gäste UND registrierte Nutzer (konfigurierbar) - **Live Feed-Vorschau** – Integrierter Feed-Reader mit bis zu 20 Beiträgen - **RSS-Button Generator** – HTML-Code in 4 Farben + 3 Größen - **OPML-Export** – Alle Feeds oder nach Kategorie gefiltert - **RSS-Feed des Verzeichnisses** – /rss.php - **2FA per E-Mail** – 6-stelliger Code, 10 Min. gültig - **Admin-Panel** – Feeds freischalten/ablehnen, Nutzerverwaltung, Einstellungen ## Installation 1. ZIP entpacken auf Webserver 2. Datenbank anlegen (MySQL/MariaDB, UTF-8) 3. Browser: `https://ihredomain.de/install.php` 4. Schritt 1: Datenbankverbindung eingeben 5. Schritt 2: Admin-Konto + SMTP konfigurieren 6. `install.php` löscht sich automatisch ## Standard-Kategorien (18) Auto & Motorrad, Bildung & Beruf, Business, Computer & Technik, Finanzen, Freizeit & Hobby, Gesellschaft, Gesundheit, Internet, Kostenlos & Gratis, Kunst & Kultur, Medien, Nachrichten, Reisen, Sport, Versicherungen, Wirtschaft, Sonstiges ## Dateistruktur ``` / ├── install.php Installationsassistent (löscht sich selbst) ├── config.php Konfiguration (auto-generiert) ├── functions.php Alle Hilfsfunktionen ├── index.php Startseite ├── verzeichnis.php Feed-Verzeichnis mit Suche & Filter ├── feed-eintragen.php Feed einreichen (Gäste + Login) ├── feed-vorschau.php Live Feed-Reader + Feed-Details ├── rss-button.php RSS-Button Generator ├── opml-export.php OPML Download ├── rss.php RSS-Feed des Verzeichnisses ├── click.php Klick-Tracker + Redirect ├── login.php Login mit 2FA ├── register.php Registrierung ├── logout.php Abmelden ├── konto.php Konto-Verwaltung + 2FA-Toggle ├── /admin/ │ ├── index.php Admin Dashboard │ ├── websites.php Feed-Verwaltung │ ├── users.php Nutzerverwaltung │ └── settings.php System-Einstellungen ├── /includes/ │ ├── header.php Navigation + CSS │ └── footer.php Footer ├── /emails/ E-Mail-Templates ├── /uploads/logos/ Feed-Logos (WebP) └── /logs/ Server-Logs ``` ## Admin-Panel URL: `/admin/index.php` - **Dashboard** – Statistiken, ausstehende Feeds - **Feed-Verwaltung** – Freischalten/Ablehnen mit E-Mail, Featured markieren - **Nutzerverwaltung** – Aktivieren/Sperren/Löschen, 2FA-Reset - **Einstellungen** – Website-Name/URL, SMTP, Gäste erlauben, Auto-Approve ## Sicherheit - PDO Prepared Statements überall - CSRF-Token-Schutz auf allen Formularen - bcrypt Passwort-Hashing (Cost 12) - HttpOnly Session-Cookies - XSS-Schutz via htmlspecialchars() - Upload-Schutz (index.php in Upload-Ordnern) - WebP-Konvertierung für alle Bild-Uploads ## E-Mail-Templates | Datei | Zweck | |-------|-------| | twofa.php | 2FA-Code bei Login | | welcome.php | Willkommen nach Registrierung | | feed_submitted.php | Bestätigung nach Einreichen | | feed_approved.php | Feed wurde freigeschaltet | | feed_rejected.php | Feed abgelehnt + Grund | | admin_new_feed.php | Admin: Neuer Feed eingereicht | ## Anforderungen - PHP 8.0+ (empfohlen: 8.2+) - MySQL 5.7+ / MariaDB 10.3+ - PHP-Extensions: PDO, GD, finfo, SimpleXML - Webserver: Apache / Nginx ## Troubleshooting **WebP-Konvertierung schlägt fehl:** ``` php -m | grep gd ``` GD-Extension aktivieren in php.ini: `extension=gd` **Feed-Vorschau lädt nicht:** - `allow_url_fopen = On` in php.ini prüfen - Oder cURL aktiviert? **E-Mails kommen nicht an:** - SMTP-Einstellungen in Admin → Einstellungen prüfen - Port 587 (STARTTLS) oder 465 (SSL) - Leer lassen → PHP mail() als Fallback **Gäste können nicht eintragen:** - Admin → Einstellungen → \"Gäste dürfen eintragen\" auf Ja --- PHP 8.0+ · MySQL · Kostenlos · Keine Abhängigkeiten
# Generator Suite Eine umfassende Sammlung von **15 Web-Generatoren** – ohne Anmeldung, einfach nutzen. ## Features **15 Generatoren:** 1. 📰 **RSS Feed Generator** – Erstelle RSS 2.0 Feeds 2. 🏷️ **Meta Tags Generator** – SEO Meta Tags + Open Graph + Twitter Cards 3. 🎨 **CSS Generator** – Button Styles mit Live-Vorschau 4. 🗺️ **Sitemap Generator** – XML Sitemaps für SEO 5. 🔐 **.htaccess Generator** – HTTPS, WWW, GZIP, Caching, etc. 6. 🔑 **Passwort Generator** – Sichere Passwörter mit Konfiguration 7. 📱 **QR Code Generator** – QR Codes für URLs/Text 8. 🎨 **Farbpaletten Generator** – Monochrome, Analogous, Complementary, Triadic 9. 📏 **Lorem Ipsum Generator** – Platzhalter-Text (Wörter, Sätze, Paragraphen) 10. 🔗 **Base64 Encoder/Decoder** – Encode & Decode 11. 🔤 **Slug Generator** – URL-freundliche Slugs aus Text 12. 📐 **Image Placeholder Generator** – Placeholder-Bilder mit via.placeholder.com 13. 🎭 **Favicon Generator** – HTML-Links für Favicons 14. 📧 **Mailto Link Generator** – E-Mail-Links mit CC, BCC, Betreff 15. 🔢 **Hash Generator** – MD5, SHA-1, SHA-256, SHA-512 **Technologie:** - Vanilla JavaScript (kein jQuery) - SQLite für History (letzte 10 pro Generator) - Kein Login erforderlich - Mobile-optimiert - Clean & Modern Design ## Installation ### 1. Dateien hochladen Alle Dateien in ein Verzeichnis auf dem Webserver hochladen. ### 2. Permissions setzen ```bash chmod 755 . chmod 666 generators.db # Wenn die Datei existiert ``` Die SQLite-Datenbank wird beim ersten Aufruf automatisch angelegt. ### 3. Fertig! ``` https://deine-domain.de/generators/ ``` ## Verwendung ### RSS Feed Generator 1. **Titel**, **Beschreibung**, **Link** und **Sprache** eingeben 2. **RSS generieren** klicken 3. XML kopieren und als `feed.xml` speichern ### Meta Tags Generator 1. **Title** (max. 60 Zeichen), **Description** (max. 160 Zeichen) eingeben 2. Optional: **Keywords**, **Author**, **Canonical URL**, **OG Image** 3. **Meta Tags generieren** klicken 4. Code in `<head>` einfügen ### CSS Generator 1. **Button Text** eingeben 2. **Farben** wählen (BG & Text) 3. **Border Radius** und **Padding** einstellen 4. Live-Vorschau anschauen 5. **CSS generieren** → Code kopieren ### Sitemap Generator 1. **URLs** eingeben (eine pro Zeile) 2. **Change Frequency** wählen (daily, weekly, monthly, yearly) 3. **Priority** wählen (0.5, 0.8, 1.0) 4. **Sitemap generieren** → XML als `sitemap.xml` speichern ### .htaccess Generator 1. Gewünschte Features auswählen: - HTTPS Redirect - WWW erzwingen - GZIP Compression - Browser Caching - Directory Listing verbieten 2. Optional: Custom 404 Seite 3. **.htaccess generieren** → Als `.htaccess` speichern ### Passwort Generator 1. **Länge** einstellen (8-64 Zeichen) 2. **Zeichen-Typen** wählen (Groß, Klein, Zahlen, Sonderzeichen) 3. **Anzahl** wählen (1-20 Passwörter) 4. **Passwörter generieren** ### QR Code Generator 1. **Text oder URL** eingeben 2. **Größe** wählen (200-500px) 3. **QR Code generieren** 4. Rechtsklick → Bild speichern ### Farbpaletten Generator 1. **Basis Farbe** wählen 2. **Typ** auswählen: - **Monochrome**: Verschiedene Helligkeiten - **Analogous**: Benachbarte Farben - **Complementary**: Gegenüberliegende Farben - **Triadic**: Gleichmäßig verteilte Farben 3. **Palette generieren** → Farbe klicken zum Kopieren ### Lorem Ipsum Generator 1. **Typ** wählen (Paragraphen, Sätze, Wörter) 2. **Anzahl** eingeben 3. **Text generieren** ### Base64 Encoder/Decoder 1. Text im **Input** eingeben 2. **→ Encode** für Kodierung 3. **← Decode** für Dekodierung ### Slug Generator (NEU!) 1. **Text** eingeben (z.B. \"Mein toller Blog Artikel 2024!\") 2. Optionen wählen: - Kleinbuchstaben - Bindestriche statt Leerzeichen - Sonderzeichen entfernen 3. **Slug generieren** → Ergebnis: \"mein-toller-blog-artikel-2024\" ### Image Placeholder Generator (NEU!) 1. **Breite** und **Höhe** eingeben 2. **Farben** wählen (BG & Text) 3. Optional: **Custom Text** 4. **Format** wählen (png, jpg, gif, webp) 5. **Placeholder generieren** → HTML & URL kopieren ### Favicon Generator (NEU!) 1. **Favicon-Pfade** eingeben (Standard: /favicon.ico, /favicon-32x32.png, etc.) 2. **Theme Color** wählen 3. **Favicon Links generieren** → HTML in `<head>` einfügen ### Mailto Link Generator (NEU!) 1. **E-Mail Adresse** eingeben 2. Optional: **CC**, **BCC**, **Betreff**, **Nachricht** 3. **Mailto Link generieren** → HTML-Link kopieren oder testen ### Hash Generator (NEU!) 1. **Text** eingeben 2. **Algorithmus** wählen (MD5, SHA-1, SHA-256, SHA-512) 3. **Hash generieren** → Hash wird im Browser berechnet ## Technische Details **Stack:** - PHP 8.0+ (nur für SQLite History) - SQLite3 - Vanilla JavaScript - CSS3 - SubtleCrypto API (für SHA-Hashes) **Datei-Struktur:** ``` generators/ ├── index.php # Hauptseite (19KB) ├── init.php # SQLite Setup (1.3KB) ├── generators.js # JavaScript Logik (jetzt ~16KB mit neuen Funktionen) ├── generators.db # SQLite Datenbank (wird auto-erstellt) └── README.md # Diese Datei ``` **Browser-Support:** - Chrome 90+ - Firefox 88+ - Safari 14+ - Edge 90+ ## Externe APIs - **QR Code**: api.qrserver.com (kostenlos, kein API-Key nötig) - **Image Placeholder**: via.placeholder.com (kostenlos, kein API-Key nötig) ## Sicherheit ✓ Alle Generatoren arbeiten clientseitig (JavaScript) ✓ Keine Daten werden an externe Server gesendet (außer QR/Placeholder APIs) ✓ Hashes werden im Browser berechnet (SubtleCrypto API) ✓ SQLite History ist optional und lokal ✓ Keine Tracking-Cookies ## Anpassungen **Design ändern:** CSS-Variablen in `index.php` bearbeiten: ```css :root { --primary: #6366f1; /* Primärfarbe */ --accent: #ec4899; /* Akzentfarbe */ --bg: #fafafa; /* Hintergrund */ } ``` **Weitere Generatoren hinzufügen:** 1. Tab in `<div class=\"nav-tabs\">` hinzufügen 2. Generator-HTML in `<div class=\"generator\" id=\"gen-NAME\">` erstellen 3. JavaScript-Funktion in `generators.js` hinzufügen ## Changelog **v2.0 (2024-02-16)** - ➕ 5 neue Generatoren: Slug, Placeholder, Favicon, Mailto, Hash - ✨ Jetzt 15 Generatoren total - 🎨 MD5-Implementation für Legacy-Support - 📱 Verbesserte Mobile-Optimierung **v1.0 (2024-02-16)** - 🚀 Initial Release mit 10 Generatoren ## Lizenz Privates Projekt – alle Rechte vorbehalten.