QR-Menü- und Café-Website-Skript

Sprachhinweis

Die Oberfläche der Website und des Verwaltungspanels gibt es auf Türkisch und Englisch. Die Sprache der Website und die Sprache des Panels wählen Sie getrennt unter „Site ayarları“ (Website-Einstellungen); die Panelsprache können Sie außerdem über das Globus-Symbol oben rechts im Panel wechseln.

Weitere Sprachen lassen sich hinzufügen: Kopieren Sie im Ordner dil des Pakets die Datei en.php und übersetzen Sie sie (die Schritte stehen in dil/OKUBENI.txt). Die hinzugefügte Sprache erscheint automatisch in den Sprachlisten der Website-Einstellungen, und Updates ändern Ihre Sprachdateien nicht. Nicht übersetzte Texte erscheinen auf Englisch; auf Wunsch können sie auf Türkisch angezeigt werden.

Inhalte, die Sie selbst veröffentlichen (Produkte, Kategorien, Seiten, Blogbeiträge usw.), werden nicht übersetzt, sondern bleiben in der Sprache, in der Sie sie schreiben. Hinweismeldungen, Datums- und Betragsformate richten sich nach der gewählten Sprache. Die Formular-E-Mails, die Sie erhalten, werden in der Panelsprache verfasst.

Wo diese Seite einen Bereich des Panels oder der Website nennt, steht der Name so, wie er in der türkischen Oberfläche erscheint, in Anführungszeichen, gefolgt von der Übersetzung in Klammern; in der englischen Oberfläche erscheinen dieselben Bereiche unter ihren englischen Namen.

Für wen geeignet

Gemacht für Cafés, Restaurants, Konditoreien und Kaffeehäuser sowie für Agenturen, die für sie Websites erstellen. Ihr Gast scannt den QR-Code am Tisch oder an der Tür mit der Handykamera, und die nach Kategorien gegliederte Speisekarte öffnet sich mit Preisen auf dem Handy. Wenn Sie die Speisekarte und die Preise im Verwaltungspanel aktualisieren, öffnet der gedruckte QR-Code dieselbe Speisekarte; den Code drucken Sie nur neu, wenn sich Ihre Website-Adresse ändert.

Die QR-Codes erstellen Sie im Panel: Fertige Codes für die Startseite, die gesamte Speisekarte und jede Kategorie werden als PNG oder SVG heruntergeladen oder zusammen mit Ihrem Logo als Tischkarte gedruckt. Zum Code gehört eine vollständige Café-Website: Slider, beliebte Produkte, Blog, Seite „Über uns“, Öffnungszeiten und ein Kontaktformular mit KVKK-Einwilligungsfeld (KVKK ist das türkische Datenschutzgesetz).

Programmierkenntnisse brauchen Sie nicht. Die Installation übernimmt der Assistent im Browser, die Inhalte tragen Sie im Verwaltungspanel ein.

Umfang

Dieses Skript ist eine QR-Menü- und Café-Informationswebsite. Die Produkte der Speisekarte werden mit Preisen angezeigt; die Website hat keinen Warenkorb, keine Online-Zahlung, keine Online-Bestellung, keinen Kellnerruf und keine Tischverwaltung. Ein QR-Code öffnet eine einzige Speisekarten-Adresse: Sie verwenden denselben Menü-Code an allen Tischen, ein tischspezifischer Code wird nicht erzeugt. Kategorie-Codes können zusätzlich gedruckt werden (zum Beispiel eine eigene Karte für Getränke). Wir empfehlen, vor der Entscheidung die Demo anzusehen.

Funktionen der Website

Speisekartenseite

• Eine Speisekarte, die sich auf dem Handy gut durchblättern lässt: Auf der Speisekartenseite stehen die Kategorien abschnittsweise untereinander. Die Kategorieleiste oben bleibt beim Scrollen am oberen Bildschirmrand, lässt sich seitlich verschieben und markiert beim Hinunterscrollen die Kategorie, in der Sie sich befinden. Ein Tipp auf einen Kategorienamen führt zum Abschnitt. Auf kleinen Bildschirmen erscheinen die Produkte als zweispaltige Karten; je breiter der Bildschirm, desto mehr Spalten.
• Kategorieseite: Jede Kategorie hat eine Adresse, die nur ihre eigenen Produkte zeigt; der Kategorie-QR-Code öffnet diese Seite. Veröffentlichte Produkte, deren Kategorie gelöscht oder nie gewählt wurde, erscheinen in der gesamten Speisekarte unter „Diğer“ (Sonstiges).
• Produktkarte: Bild, Produktname, Kurzbeschreibung und Preis. Die Bilder werden beim Scrollen nachgeladen; ein Produkt ohne Bild erscheint mit einem neutralen Symbol.
• Produktseite: Ein Tipp auf das Bild öffnet die Großansicht. Die Seite zeigt Produktname, Link zur Kategorie, Kurzbeschreibung, Preis, Tags (zum Beispiel vegan, scharf) und „Ürün Detayları“ (Produktdetails) mit formatiertem Text; darunter werden bis zu vier ähnliche Produkte derselben Kategorie angezeigt. Ein Produkt mit dem Status „Taslak“ (Entwurf) erscheint nicht auf der Website.
• Preise: Sie werden in türkischen Lira (₺) eingegeben und angezeigt. Bei einem Produkt, dessen Preis leer oder 0 bleibt, wird kein Preis angezeigt.
• Reihenfolge: Kategorien und Produkte ordnen Sie mit dem Feld „Sıra“ (Reihenfolge); die kleinere Zahl kommt zuerst.

Startseite

• Reihenfolge auf der Startseite: Slider, beliebte Produkte, Speisekarte mit Kategorie-Tabs, Kategoriekarten und neueste Beiträge. Ein Bereich ohne Einträge erscheint nicht.
• Slider: Sie fügen im Panel Folien hinzu; für jede Folie geben Sie Titel, Untertitel, Schaltflächentext und Link, Reihenfolge und Bild an. Die Schaltfläche erscheint nur, wenn Text und Link beide ausgefüllt sind. Bei mehreren Folien funktionieren Pfeile und Punktanzeige, und die Folien wechseln von selbst. Es werden höchstens zehn Folien angezeigt.
• Beliebte Produkte: Die Produkte, die Sie mit „Popüler işareti“ (Markierung „Beliebt“) versehen, erscheinen auf der Startseite in einem Slider mit Name, Bild und Preis. Auf Geräten mit eingeschalteter Einstellung „Bewegung reduzieren“ läuft der Slider nicht von selbst weiter.
• Speisekarte mit Kategorie-Tabs: Für jede Kategorie mit Produkten gibt es einen Tab; haben Sie beliebte Produkte markiert, ist der erste Tab „Öne Çıkanlar“ (Empfohlen). In jedem Tab werden die Produkte als Karten aufgelistet; die Schaltflächen „Kategoriyi aç“ (Kategorie öffnen) und „Tüm menüyü gör“ (Ganze Speisekarte ansehen) führen zur Speisekartenseite.
• Kategoriekarten: Kategoriebild, Name und Anzahl der Produkte erscheinen in einem Slider; ein Tipp auf die Karte öffnet die Speisekarte dieser Kategorie.
• Neueste Beiträge: Die drei neuesten Blogbeiträge werden mit Bild, Datum, Autor und Kurzbeschreibung angezeigt.
• Bereichsüberschriften: Überschrift und Untertitel der Bereiche der Startseite schreiben Sie im Panel mit eigenen Worten. Eine leer gelassene Überschrift erscheint nicht auf der Website.

Blog, Seiten und Kontakt

• Blog: Sie veröffentlichen Beiträge mit Titel, Kategorie, Status, Autor, Tags, Kurzbeschreibung, Bild und formatiertem Text. Die Liste wird mit Kategorie-Chips gefiltert; in der Seitenspalte eines Beitrags stehen die Kategorien und die neuesten Beiträge. Ein Beitrag mit dem Status „Taslak“ (Entwurf) erscheint nicht auf der Website.
• Zusatzseiten: Im Panel fügen Sie beliebig viele Seiten hinzu (zum Beispiel Allergeninformationen, KVKK-Datenschutzhinweis, Datenschutzerklärung). Für jede Seite wählen Sie, ob sie im oberen Menü (unter „Sayfalar“, Seiten) und im Fußbereich der Website angezeigt wird.
• Über uns: eine Vorstellungsseite Ihres Betriebs aus Titel und formatiertem Text.
• Kontaktseite: ein Formular mit den Feldern Name, E-Mail, Telefon und Nachricht (alle Pflicht); daneben die Kurzbeschreibung des Betriebs, die Adresse, eine Telefonnummer, die beim Antippen einen Anruf startet, die E-Mail-Adresse, die Öffnungszeiten und die Karte (Einbettungscode von Google Maps oder OpenStreetMap). Angaben und eine Karte, die Sie leer lassen, erscheinen nicht.
• Öffnungszeiten: Sie geben für jeden Wochentag einen Text ein (zum Beispiel 08:00 - 22:00, für einen Ruhetag „Kapalı“ (Geschlossen)). Der Text wird dem Besucher so angezeigt, wie Sie ihn eingeben; ein leer gelassener Tag wird nicht angezeigt. Die Zeiten erscheinen auf der Kontaktseite und im Fußbereich der Website.
• E-Mail an Sie: Wenn Sie „E-posta ayarları“ (E-Mail-Einstellungen) einrichten und die Benachrichtigungen einschalten, erreicht Sie jede Nachricht aus dem Kontaktformular auch per E-Mail. Wenn Sie die E-Mail beantworten, geht die Antwort an die Adresse des Besuchers. Auch ohne E-Mail-Einstellungen werden die Nachrichten im Panel aufgelistet. An den Besucher wird keine E-Mail gesendet.
• KVKK-Einwilligungsfeld: im Kontaktformular Pflicht. Der Link zum Datenschutzhinweis führt auf die Seite, die Sie im Panel wählen; derselbe Link erscheint im Fußbereich der Website. Der Text, der mit den Beispielinhalten kommt, ist nur ein Beispiel; Ihren eigenen Datenschutzhinweis müssen Sie selbst erstellen.

Darstellung und Suchmaschinen

• Helles und dunkles Design: Mit der Schaltfläche im oberen Menü wählt der Besucher die helle oder die dunkle Darstellung; die Wahl wird im Browser dieser Person gespeichert.
• Hauptfarbe: Sie wählen im Panel eine Hauptfarbe. Sie wird auf Schaltflächen, den Hintergrund des Sliders, aktive oder ausgewählte Elemente in Menü und Leisten, Links und Preise angewendet. Die Textfarbe auf der Farbe wird automatisch so gewählt, dass sie lesbar bleibt.
• Logo, Website-Symbol und Fußbereich: Sie laden Ihr Logo und Ihr Website-Symbol (Favicon) hoch; ohne Logo erscheint der Name des Betriebs als Text. Der Fußbereich enthält die Beschreibung des Betriebs, Kategorielinks, ein Schnellmenü, Kontaktdaten und Öffnungszeiten.
• Soziale Medien: Ihre Links zu Facebook, X (Twitter), YouTube, Instagram und WhatsApp erscheinen als Symbole im Fußbereich. Ein Symbol, das Sie nicht ausgefüllt haben, wird nicht gezeichnet.
• Bereiche ein- und ausschalten: Über Uns, Blog, Kontaktseite, Slider der Startseite, beliebte Produkte, Kategoriekarten und Öffnungszeiten schalten Sie auf einer einzigen Seite ein oder aus. Ein ausgeschalteter Bereich verschwindet aus Menü und Startseite; die Adresse eines Bereichs mit eigener Seite öffnet sich ebenfalls nicht.
• Fußzeilen-Hinweis: Den Text „TiklaWeb tarafından geliştirildi“ (Entwickelt von TiklaWeb) am Ende der Website können Sie ändern oder entfernen.
• Mobil geeignet: Die Website passt sich Handy-, Tablet- und Desktop-Bildschirmen an; auf kleinen Bildschirmen wird das Menü zu einem seitlich einschiebbaren Panel, und beim Scrollen erscheint eine Schaltfläche „nach oben“.
• Seitenspezifischer Titel und Beschreibung: Jede Seite trägt ihren eigenen Titel („Seite | Betrieb“), ihre Beschreibung und Tags für das Teilen in sozialen Netzwerken (Open Graph). Auf Produkt- und Blogbeitragsseiten stammt das Vorschaubild vom Bild des Produkts bzw. des Beitrags. Titel, Beschreibung und Schlüsselwörter der Website geben Sie unter „Site ayarları“ (Website-Einstellungen) ein.

Verwaltungspanel

• „QR Kod“ (QR-Code): je ein Feld für die Startseite, die gesamte Speisekarte und jede Kategorie: Vorschau, die vom Code geöffnete Adresse und Download-Schaltflächen. Der Code wird als PNG in den Größen 512, 1024 und 2048 Pixel sowie als SVG heruntergeladen. Die Druckansicht für Tischkarten gibt es als A6, A4 und vier A6-Karten auf einem A4-Blatt (zum Ausschneiden); die Karte zeigt Ihr Logo (ohne Logo den Namen des Betriebs), den QR-Code, eine Textzeile und die Website-Adresse. Den Kartentext (Standard „Menüyü görmek için okutun“, Scannen, um die Speisekarte zu sehen) ändern Sie in der Druckansicht.
• QR-Adresse: Die Codes tragen die Adresse Ihrer Website, über die das Panel geöffnet wurde. Ändert sich die Adresse, müssen Sie die Codes erneut herunterladen und drucken; Sie können die Adresse auch von Hand eintragen und die Codes aktualisieren.
• „Özet“ (Übersicht): Anzahl ungelesener Nachrichten, veröffentlichter Speisekartenprodukte, Kategorien und Blogbeiträge, eine Verknüpfung zur QR-Code-Seite und die neuesten Nachrichten. Die Zahl ungelesener Nachrichten erscheint als Hinweis im Seitenmenü.
• „Mesajlar“ (Nachrichten): Die Nachrichten aus dem Kontaktformular werden in einer Liste gesammelt. Name, Telefon, E-Mail, Datum und Lesestatus stehen in der Liste; in der Detailansicht lesen Sie die Nachricht und den Zeitpunkt der KVKK-Einwilligung und können den Eintrag löschen. Die Liste bietet Suche und Sortierung.
• Verwaltung der Speisekarte: Für Produkte geben Sie Name, Kategorie, Preis, Reihenfolge, Status (veröffentlicht oder Entwurf), „Popüler işareti“ (Markierung „Beliebt“), Kurzbeschreibung, Tags, ausführliche Beschreibung und Bild ein. Für Kategorien geben Sie Name, Reihenfolge und Bild an. Die Listen bieten Suche und Sortierung.
• Blog und Seiten: Blogbeiträge, Blogkategorien und Zusatzseiten werden hinzugefügt, bearbeitet und gelöscht. In den Feldern für formatierten Text wird der Editor Summernote verwendet.
• „Site içeriği“ (Website-Inhalte): Slider der Startseite, „Ana sayfa başlıkları“ (Überschriften der Startseite), „Hakkımızda“ (Über uns), „Çalışma saatleri“ (Öffnungszeiten), Links zu sozialen Medien und „Bölümleri aç/kapat“ (Bereiche ein-/ausschalten).
• Bild-Upload: Es werden JPG-, PNG- oder WebP-Dateien hochgeladen (bis 8 MB). Ist die GD-Erweiterung auf dem Server aktiv, werden die Bilder in WebP umgewandelt, und Bilder mit einer längeren Seite über 1600 Pixel werden verkleinert; die auf dem Handy geöffnete Speisekarte lädt so schneller.
• „E-posta ayarları“ (E-Mail-Einstellungen): Sobald Sie Ihre SMTP-Daten eingeben und die Benachrichtigung einschalten, funktionieren die Kontakt-E-Mails. Die Einstellungen testen Sie mit der Schaltfläche „Deneme e-postası gönder“ (Test-E-Mail senden).
• „Site ayarları“ (Website-Einstellungen): Titel, Beschreibung und Schlüsselwörter der Website, Name des Betriebs, Telefon, WhatsApp-Link, E-Mail, Adresse, Kurzbeschreibung des Betriebs, Copyright-Zeile, Hauptfarbe, Seite mit dem KVKK-Datenschutzhinweis, Karte, Logo, Website-Symbol, Website-Sprache und Panelsprache.
• Benutzer und Berechtigungen: Sie fügen Administrator- und Redakteurkonten hinzu. Der Redakteur verwaltet Nachrichten, die QR-Code-Seite und die Inhaltsbereiche; „Site ayarları“, „E-posta ayarları“ und „Kullanıcılar“ (Benutzer) sind nur für den Administrator zugänglich. Die Berechtigungen werden serverseitig geprüft. Jeder Benutzer ändert seinen Namen und sein Passwort auf der Seite „Profil ve şifre“ (Profil und Passwort).
• Passwort vergessen: Über den Link auf der Panel-Anmeldung wird das Passwort per E-Mail zurückgesetzt (wenn „E-posta ayarları“ eingerichtet ist). Der Link zum Zurücksetzen ist 1 Stunde gültig und kann einmal verwendet werden.
• Eigener Code: Unter „Site ayarları“ fügen Sie Ihren eigenen Code (zum Beispiel ein Analyse-Skript) in den Kopfbereich der Website, an den Anfang ihres Body und ans Seitenende ein. Diese Felder sind nur für den Administrator zugänglich.

Installation und Updates

• Installationsassistent in fünf Schritten: Anforderungen, Lizenz, Datenbank, Website- und Administratordaten, Abschluss. Der Assistent prüft Ihren Server selbst.
• Installationssprache: Türkisch oder Englisch wählen Sie oben rechts im Assistenten. Bei englischer Installation kommen auch die Start- und Beispielinhalte auf Englisch.
• Installation mit Beispielinhalten oder leer: Sie können wie in der Demo gefüllt starten und die Inhalte bearbeiten oder die Inhalte von Grund auf selbst eingeben. Die Liste „Mesajlar“ (Nachrichten) beginnt in beiden Fällen leer.
• Update aus dem Panel: Sie laden das ZIP-Paket der neuen Version aus Ihrem tiklaweb.net-Kundenpanel herunter und laden es auf der Seite „Güncelleme ve lisans“ (Update und Lizenz) des Verwaltungspanels hoch. Vor dem Vorgang wird eine Datei- und Datenbanksicherung erstellt. Tritt ein Fehler auf, kehrt die Website in ihren vorherigen Zustand zurück. Die hochgeladenen Bilder, Ihre Einstellungen und Ihre Inhalte bleiben erhalten.
• Geprüfte Pakete: Die Signatur des Update-Pakets wird geprüft; es werden nur Pakete installiert, die von tiklaweb.net heruntergeladen wurden.

Die ausführliche Installationsanleitung liegt dem heruntergeladenen Paket als Datei KURULUM.html bei (auf Türkisch).

Lizenz

Jede Lizenz gilt für einen einzigen Domainnamen, den Sie bei der Bestellung angeben. Eine Änderung des Domainnamens ist kostenpflichtig und erfolgt per Supportanfrage. Die Lizenz wird nicht kostenlos übertragen. Auf einem nicht lizenzierten Domainnamen öffnet sich die Website nicht, und der Besucher wird auf eine Lizenzhinweisseite weitergeleitet. Für die Nutzung auf einem anderen Domainnamen ist eine separate Lizenz erforderlich.

Technische Merkmale

• PHP 8.2 oder höher, MySQL oder MariaDB
• Grundlage: reines PHP, PDO und vorbereitete Abfragen. Website: Bootstrap 5, jQuery, Slick, Font Awesome Free 6; die Schriftart (Raleway) liegt lokal im Paket, ein externer Schriftdienst wird nicht aufgerufen. Panel: Bootstrap 4, DataTables und der Inhaltseditor Summernote
• Die QR-Codes werden mit der unter MIT und Apache-2.0 lizenzierten Bibliothek chillerlan/php-qrcode auf Ihrem Server erzeugt; es geht keine Anfrage an einen externen QR-Dienst. Die PNG-Datei wird ohne die GD-Erweiterung geschrieben
• In die QR-Codes werden nur die eigenen Adressen Ihrer Website geschrieben; eine von Hand eingegebene Website-Adresse wird mit signierten Links übertragen
• E-Mails werden mit PHPMailer 6.9 versendet; das SMTP-Passwort wird verschlüsselt gespeichert. Der Formulareintrag wird zuerst in die Datenbank geschrieben; wenn der Server es unterstützt, wird die E-Mail gesendet, nachdem der Besucher die Antwort erhalten hat
• Die Oberflächentexte liegen in den Sprachdateien des Pakets (Türkisch und Englisch vorhanden, neue Sprachen können hinzugefügt werden)
• Signiertes Formular-Token und verstecktes Fallenfeld im Kontaktformular, CSRF-Prüfung bei Panelaktionen; Versuchsbegrenzung bei Panel-Anmeldung, Passwort-Zurücksetzen und Kontaktformular
• Der Typ der im Panel hochgeladenen Bilder wird anhand des Inhalts geprüft (JPG, PNG, WebP; bis 8 MB); im Upload-Ordner wird kein PHP ausgeführt
• Die Felder für formatierten Text im Panel werden beim Speichern serverseitig gefiltert (HTMLPurifier); das Verwaltungspanel sendet einen Content-Security-Policy-Header (CSP); Administratorpasswörter werden als Hash gespeichert
• Das Kartenfeld akzeptiert nur Einbettungsadressen von Google Maps und OpenStreetMap
• Datenbankzugangsdaten und Sicherungen werden, wenn das Hosting es erlaubt, in einem Ordner außerhalb des Web-Stammverzeichnisses aufbewahrt
• Sicherheits-Header, HSTS bei HTTPS; Zeitzone Europe/Istanbul
• Vor dem Verkauf wurde ein Sicherheitsaudit aus Code-Review und Live-Angriffstests durchgeführt

Demo

Die Website und das Verwaltungspanel können Sie in einer schreibgeschützten Demo ansehen. Die Demo ist auf Türkisch installiert; im Verwaltungspanel können Sie die Panelsprache über das Globus-Symbol oben rechts auf Englisch umstellen (diese Auswahl wird nur in Ihrem Browser gespeichert). Betriebsname, Produkte, Preise, Beiträge und Fotos in der Demo sind durchweg Beispielinhalte. Im Demo-Panel können Sie die Seite „QR Kod“ (QR-Code) öffnen, die Codes herunterladen und die Tischkartenansicht ausprobieren; die Codes tragen die Adresse der Demo-Website. In der Liste „Mesajlar“ (Nachrichten) sehen Sie einige Beispieleinträge. WhatsApp, Links zu sozialen Medien und Karte sind in der Demo leer; sie erscheinen auf der Website, sobald Sie sie im Panel ausfüllen.

• Website: https://018.tiklaweb.net
• Verwaltungspanel: https://018.tiklaweb.net/admin
• Demo-E-Mail: demo@tiklaweb.net
• Demo-Passwort: demo1234

In der Demo können keine Änderungen gespeichert werden; das Kontaktformular speichert keine Einträge und sendet keine E-Mails. Die Demo wird jede Nacht zurückgesetzt. Sensible Seiten wie E-Mail-Einstellungen, Benutzer und Passwortformulare sind im Demo-Modus nicht einsehbar, und „Passwort vergessen“ ist in der Demo deaktiviert. Diese Zugangsdaten gelten nur für die Demo-Website. In der von Ihnen gekauften Installation legen Sie das Administratorkonto selbst fest.

Support

Wenn Sie nicht weiterkommen, können Sie in Ihrem tiklaweb.net-Kundenpanel eine Supportanfrage öffnen oder an destek@tiklaweb.net schreiben.