Script de menu QR et de site web pour café

Note sur les langues

L’interface du site et du panneau d’administration est disponible en turc et en anglais. Vous choisissez séparément la langue du site et celle du panneau dans « Site ayarları » (Paramètres du site) ; vous pouvez aussi changer la langue du panneau avec l’icône de globe en haut à droite du panneau.

D’autres langues peuvent être ajoutées : copiez le fichier en.php du dossier dil du paquet et traduisez-le (les étapes figurent dans dil/OKUBENI.txt). La langue ajoutée apparaît automatiquement dans les listes de langues des paramètres du site, et les mises à jour ne touchent pas à vos fichiers de langue. Les textes non traduits s’affichent en anglais ; si vous le souhaitez, ils peuvent s’afficher en turc.

Les contenus que vous publiez (produits, catégories, pages, articles de blog, etc.) ne sont pas traduits ; ils restent dans la langue où vous les écrivez. Les messages d’avertissement, les formats de date et de montant suivent la langue choisie. Les e-mails de formulaire qui vous sont envoyés sont rédigés dans la langue du panneau.

Lorsque cette page nomme une rubrique du panneau ou du site, le nom est donné tel qu’il apparaît dans l’interface turque, entre guillemets, suivi de sa traduction entre parenthèses ; dans l’interface anglaise, les mêmes rubriques apparaissent sous leur nom anglais.

À qui s’adresse-t-il ?

Conçu pour les cafés, les restaurants, les pâtisseries et les coffee shops, ainsi que pour les agences qui créent des sites pour eux. Votre client scanne avec l’appareil photo de son téléphone le code QR posé sur la table ou à l’entrée, et le menu, réparti par catégories, s’ouvre avec ses prix sur son téléphone. Lorsque vous mettez à jour le menu et les prix dans le panneau d’administration, le code QR imprimé ouvre le même menu ; vous ne réimprimez le code que si l’adresse de votre site change.

Vous créez les codes QR dans le panneau : des codes prêts pour la page d’accueil, pour l’ensemble du menu et pour chaque catégorie sont téléchargés en PNG ou en SVG, ou imprimés comme carte de table avec votre logo. Le code s’accompagne d’un site de café complet : diaporama d’accueil, produits populaires, blog, page À propos, horaires d’ouverture et formulaire de contact avec case de consentement KVKK (la KVKK est la loi turque sur la protection des données personnelles).

Vous n’avez pas besoin de savoir programmer. L’assistant du navigateur se charge de l’installation et vous saisissez vos contenus dans le panneau d’administration.

Périmètre

Ce script est un site de menu QR et de présentation de café. Les produits du menu sont affichés avec leur prix ; le site n’a ni panier, ni paiement en ligne, ni commande en ligne, ni appel du serveur, ni gestion des tables. Un code QR ouvre une seule adresse de menu : vous utilisez le même code de menu sur toutes les tables, aucun code propre à chaque table n’est généré. Les codes de catégorie peuvent être imprimés séparément (par exemple une carte à part pour les boissons). Nous vous conseillons de regarder la démo avant de vous décider.

Fonctionnalités du site

Page de menu

• Un menu facile à parcourir sur téléphone : sur la page de menu, les catégories sont listées section par section, les unes sous les autres. La barre de catégories en haut reste en haut de l’écran pendant le défilement, se fait défiler latéralement et marque la catégorie où vous vous trouvez au fil de la descente. Toucher le nom d’une catégorie mène à cette section. Sur les petits écrans, les produits s’affichent en cartes sur deux colonnes ; le nombre de colonnes augmente avec la largeur de l’écran.
• Page de catégorie : chaque catégorie a une adresse qui n’affiche que ses propres produits ; le code QR de catégorie ouvre cette page. Les produits publiés dont la catégorie a été supprimée ou n’a jamais été choisie apparaissent sous « Diğer » (Autres) dans le menu complet.
• Carte de produit : image, nom du produit, courte description et prix. Les images se chargent au fil du défilement ; un produit sans image s’affiche avec une icône neutre.
• Page de produit : toucher l’image ouvre un grand affichage. La page présente le nom du produit, un lien vers la catégorie, la courte description, le prix, les étiquettes (par exemple végétarien, épicé) et « Ürün Detayları » (Détails du produit) en texte enrichi ; en dessous, jusqu’à quatre produits similaires de la même catégorie. Un produit dont le statut est « Taslak » (Brouillon) n’apparaît pas sur le site.
• Prix : ils sont saisis et affichés en livres turques (₺). Un produit dont le prix est laissé vide ou à 0 s’affiche sans prix.
• Ordre : vous classez les catégories et les produits avec le champ « Sıra » (Ordre) ; le plus petit numéro passe en premier.

Page d’accueil

• Ordre sur la page d’accueil : diaporama d’accueil, produits populaires, menu avec onglets de catégories, cartes de catégories et derniers articles. Une section sans enregistrement n’apparaît pas.
• Diaporama d’accueil : vous ajoutez des diapositives dans le panneau ; pour chacune, vous saisissez un titre, un sous-titre, le texte et le lien du bouton, un ordre et une image. Le bouton n’apparaît que si son texte et son lien sont tous deux renseignés. Avec plusieurs diapositives, les flèches et les points d’indication fonctionnent et les diapositives défilent d’elles-mêmes. Dix diapositives au plus sont affichées.
• Produits populaires : les produits auxquels vous donnez la « Popüler işareti » (Marque « Populaire ») apparaissent sur la page d’accueil dans un défilement avec nom, image et prix. Sur les appareils où le réglage « réduire les animations » est activé, le défilement n’avance pas tout seul.
• Menu avec onglets de catégories : il y a un onglet pour chaque catégorie qui contient des produits ; si vous avez marqué des produits populaires, le premier onglet est « Öne Çıkanlar » (À la une). Dans chaque onglet, les produits sont listés en cartes ; les boutons « Kategoriyi aç » (Ouvrir la catégorie) et « Tüm menüyü gör » (Voir tout le menu) mènent à la page de menu.
• Cartes de catégories : l’image, le nom et le nombre de produits de la catégorie sont affichés dans un défilement ; toucher une carte ouvre le menu de cette catégorie.
• Derniers articles : les trois articles de blog les plus récents sont affichés avec image, date, auteur et courte description.
• Titres des sections : vous écrivez dans le panneau, avec vos propres mots, le titre et le sous-titre de chaque section de la page d’accueil. Un titre laissé vide n’apparaît pas sur le site.

Blog, pages et contact

• Blog : vous publiez des articles avec titre, catégorie, statut, auteur, étiquettes, courte description, image et texte enrichi. La liste se filtre avec des pastilles de catégories ; la colonne latérale d’un article affiche les catégories et les derniers articles. Un article au statut « Taslak » (Brouillon) n’apparaît pas sur le site.
• Pages supplémentaires : vous ajoutez autant de pages que vous voulez dans le panneau (par exemple informations sur les allergènes, notice d’information KVKK, politique de confidentialité). Pour chaque page, vous choisissez si elle s’affiche dans le menu du haut (sous « Sayfalar », Pages) et dans le pied de page du site.
• À propos : une page de présentation de votre établissement composée d’un titre et d’un texte enrichi.
• Page de contact : un formulaire avec les champs nom, e-mail, téléphone et message (tous obligatoires) ; à côté, la courte présentation de l’établissement, l’adresse, un numéro de téléphone qui lance un appel quand on le touche, l’e-mail, les horaires d’ouverture et la carte (code d’intégration Google Maps ou OpenStreetMap). Les informations et la carte que vous laissez vides n’apparaissent pas.
• Horaires d’ouverture : vous saisissez un texte pour chaque jour de la semaine (par exemple 08:00 - 22:00, ou « Kapalı » (Fermé) pour un jour de fermeture). Le texte est montré au visiteur tel que vous l’avez saisi ; un jour laissé vide n’est pas affiché. Les horaires figurent sur la page de contact et dans le pied de page du site.
• E-mail pour vous : une fois « E-posta ayarları » (Paramètres e-mail) configurés et les notifications activées, chaque message du formulaire de contact vous parvient aussi par e-mail. Lorsque vous répondez à l’e-mail, la réponse part vers l’adresse du visiteur. Même sans paramètres e-mail, les messages sont listés dans le panneau. Aucun e-mail n’est envoyé au visiteur.
• Case de consentement KVKK : obligatoire dans le formulaire de contact. Le lien vers la notice d’information mène à la page que vous choisissez dans le panneau ; le même lien figure dans le pied de page du site. Le texte livré avec le contenu d’exemple n’est qu’un exemple ; vous devez préparer votre propre notice d’information.

Apparence et moteurs de recherche

• Thème clair et sombre : avec le bouton du menu du haut, le visiteur choisit l’apparence claire ou sombre ; le choix est conservé dans le navigateur de cette personne.
• Couleur principale : vous choisissez une couleur principale dans le panneau. Elle s’applique aux boutons, au fond du diaporama d’accueil, aux éléments actifs ou sélectionnés du menu et des barres, aux liens et aux prix. La couleur du texte placé dessus est choisie automatiquement pour rester lisible.
• Logo, icône du site et pied de page : vous téléversez votre logo et l’icône de votre site (favicon) ; sans logo, le nom de l’établissement s’affiche en texte. Le pied de page contient la présentation de l’établissement, les liens de catégories, un menu rapide, les coordonnées et les horaires d’ouverture.
• Réseaux sociaux : vos liens Facebook, X (Twitter), YouTube, Instagram et WhatsApp apparaissent sous forme d’icônes dans le pied de page. Une icône que vous n’avez pas renseignée n’est pas dessinée.
• Activer et désactiver les sections : vous activez ou désactivez À propos, Blog, la page de contact, le diaporama d’accueil, les produits populaires, les cartes de catégories et les horaires d’ouverture depuis une seule page. Une section désactivée disparaît du menu et de la page d’accueil ; l’adresse d’une section qui possède une page ne s’ouvre pas non plus.
• Signature du pied de page : vous pouvez modifier ou supprimer le texte « TiklaWeb tarafından geliştirildi » (Développé par TiklaWeb) en bas du site.
• Adapté au mobile : le site s’adapte aux écrans de téléphone, de tablette et d’ordinateur ; sur les petits écrans, le menu devient un panneau qui s’ouvre sur le côté, et un bouton « haut de page » apparaît au défilement.
• Titre et description propres à chaque page : chaque page porte son propre titre (« Page | Établissement »), sa description et ses balises de partage sur les réseaux sociaux (Open Graph). Sur les pages de produit et d’article, l’image de partage provient de l’image du produit ou de l’article. Vous saisissez le titre, la description et les mots-clés du site dans « Site ayarları » (Paramètres du site).

Panneau d’administration

• « QR Kod » (Code QR) : une boîte distincte pour la page d’accueil, l’ensemble du menu et chaque catégorie : aperçu, adresse ouverte par le code et boutons de téléchargement. Le code se télécharge en PNG aux tailles 512, 1024 et 2048 pixels, et en SVG. L’affichage d’impression pour les cartes de table existe en A6, en A4 et en quatre cartes A6 sur une feuille A4 (à découper) ; la carte comporte votre logo (ou le nom de l’établissement s’il n’y a pas de logo), le code QR, une ligne de texte et l’adresse du site. Vous modifiez le texte de la carte (par défaut « Menüyü görmek için okutun », Scannez pour voir le menu) sur l’écran d’impression.
• Adresse du code QR : les codes portent l’adresse de votre site à partir de laquelle le panneau a été ouvert. Si l’adresse change, vous devez télécharger et imprimer de nouveau les codes ; vous pouvez aussi saisir l’adresse à la main et actualiser les codes.
• « Özet » (Résumé) : nombre de messages non lus, de produits du menu publiés, de catégories et d’articles de blog, un raccourci vers la page Code QR et les derniers messages. Le nombre de messages non lus apparaît sous forme de pastille dans le menu latéral.
• « Mesajlar » (Messages) : les messages du formulaire de contact sont réunis dans une liste. Nom, téléphone, e-mail, date et statut de lecture figurent dans la liste ; dans le détail, vous lisez le message et l’heure du consentement KVKK, et vous pouvez supprimer l’enregistrement. La liste offre recherche et tri.
• Gestion du menu : pour les produits, vous saisissez le nom, la catégorie, le prix, l’ordre, le statut (publié ou brouillon), la « Popüler işareti » (Marque « Populaire »), une courte description, des étiquettes, une description détaillée et une image. Pour les catégories, vous saisissez un nom, un ordre et une image. Les listes offrent recherche et tri.
• Blog et pages : les articles de blog, les catégories de blog et les pages supplémentaires sont ajoutés, modifiés et supprimés. L’éditeur Summernote est utilisé dans les champs de texte enrichi.
• « Site içeriği » (Contenu du site) : diaporama d’accueil, « Ana sayfa başlıkları » (Titres de la page d’accueil), « Hakkımızda » (À propos), « Çalışma saatleri » (Horaires d’ouverture), liens de réseaux sociaux et « Bölümleri aç/kapat » (Activer/désactiver les sections).
• Téléversement d’images : des fichiers JPG, PNG ou WebP sont téléversés (jusqu’à 8 Mo). Si l’extension GD est active sur le serveur, les images sont converties en WebP et celles dont le grand côté dépasse 1600 pixels sont réduites ; le menu ouvert sur téléphone se charge ainsi plus vite.
• « E-posta ayarları » (Paramètres e-mail) : une fois vos informations SMTP saisies et les notifications activées, les e-mails de contact fonctionnent. Vous testez les paramètres avec le bouton « Deneme e-postası gönder » (Envoyer un e-mail de test).
• « Site ayarları » (Paramètres du site) : titre, description et mots-clés du site, nom de l’établissement, téléphone, lien WhatsApp, e-mail, adresse, courte présentation de l’établissement, ligne de copyright, couleur principale, page de la notice d’information KVKK, carte, logo, icône du site, langue du site et langue du panneau.
• Utilisateurs et autorisations : vous ajoutez des comptes administrateur et éditeur. L’éditeur gère les messages, la page Code QR et les sections de contenu ; « Site ayarları », « E-posta ayarları » et « Kullanıcılar » (Utilisateurs) sont réservés à l’administrateur. Les autorisations sont vérifiées côté serveur. Chaque utilisateur modifie son nom et son mot de passe sur la page « Profil ve şifre » (Profil et mot de passe).
• Mot de passe oublié : le mot de passe se réinitialise par e-mail grâce au lien de la connexion au panneau (si « E-posta ayarları » est configuré). Le lien de réinitialisation est valable 1 heure et ne s’utilise qu’une fois.
• Code personnalisé : dans « Site ayarları », vous ajoutez votre propre code (par exemple un script de statistiques) dans l’en-tête du site, au début de son corps et en fin de page. Ces champs sont réservés à l’administrateur.

Installation et mises à jour

• Assistant d’installation en cinq étapes : prérequis, licence, base de données, informations du site et de l’administrateur, finalisation. L’assistant vérifie lui-même votre serveur.
• Langue d’installation : le turc ou l’anglais se choisit en haut à droite de l’assistant. Avec une installation en anglais, le contenu de départ et d’exemple est aussi en anglais.
• Installation avec contenu d’exemple ou vide : vous pouvez démarrer avec un site rempli comme la démo et le modifier, ou saisir les contenus à partir de zéro. La liste « Mesajlar » (Messages) démarre vide dans les deux cas.
• Mise à jour depuis le panneau : vous téléchargez le paquet zip de la nouvelle version depuis votre espace client tiklaweb.net et le téléversez sur la page « Güncelleme ve lisans » (Mise à jour et licence) du panneau d’administration. Une sauvegarde des fichiers et de la base est effectuée avant l’opération. En cas d’erreur, le site revient à son état précédent. Les images que vous avez téléversées, vos paramètres et vos contenus sont conservés.
• Paquets vérifiés : la signature du paquet de mise à jour est contrôlée ; seuls les paquets téléchargés depuis tiklaweb.net sont installés.

Le guide d’installation détaillé est fourni dans le paquet que vous téléchargez, sous la forme du fichier KURULUM.html (rédigé en turc).

Licence

Chaque licence est valable pour un seul nom de domaine, que vous indiquez lors de la commande. Le changement de nom de domaine est payant et se fait par une demande d’assistance. La licence n’est pas transférée gratuitement. Le site ne s’ouvre pas sur un nom de domaine sans licence, et le visiteur est redirigé vers une page d’avertissement de licence. Pour l’utiliser sur un autre nom de domaine, une licence distincte est nécessaire.

Caractéristiques techniques

• PHP 8.2 ou supérieur, MySQL ou MariaDB
• Base : PHP natif, PDO et requêtes préparées. Site : Bootstrap 5, jQuery, Slick, Font Awesome Free 6 ; la police (Raleway) est stockée localement dans le paquet et aucun service de polices externe n’est appelé. Panneau : Bootstrap 4, DataTables et l’éditeur de contenu Summernote
• Les codes QR sont générés sur votre serveur avec la bibliothèque chillerlan/php-qrcode, sous licences MIT et Apache-2.0 ; aucune requête n’est envoyée à un service QR externe. Le fichier PNG est écrit sans l’extension GD
• Seules les adresses propres à votre site sont écrites dans les codes QR ; une adresse de site saisie à la main est transmise par des liens signés
• L’envoi des e-mails se fait avec PHPMailer 6.9 ; le mot de passe SMTP est stocké chiffré. L’enregistrement du formulaire est d’abord écrit dans la base de données ; si le serveur le permet, l’e-mail est envoyé après la réponse au visiteur
• Les textes de l’interface sont conservés dans les fichiers de langue du paquet (turc et anglais fournis, de nouvelles langues peuvent être ajoutées)
• Jeton de formulaire signé et champ piège caché dans le formulaire de contact, vérification CSRF pour les actions du panneau ; limitation des tentatives pour la connexion au panneau, la réinitialisation du mot de passe et le formulaire de contact
• Le type des images téléversées dans le panneau est vérifié à partir du contenu (JPG, PNG, WebP ; jusqu’à 8 Mo) ; PHP ne s’exécute pas dans le dossier de téléversement
• Les champs de texte enrichi du panneau sont filtrés côté serveur à l’enregistrement (HTMLPurifier) ; le panneau d’administration envoie un en-tête de politique de sécurité du contenu (CSP) ; les mots de passe des administrateurs sont stockés sous forme de hachage
• Le champ de carte n’accepte que les adresses d’intégration de Google Maps et d’OpenStreetMap
• Les informations de base de données et les sauvegardes sont conservées, si l’hébergement le permet, dans un dossier situé hors de la racine web
• En-têtes de sécurité, HSTS en HTTPS ; fuseau horaire Europe/Istanbul
• Un audit de sécurité composé d’une revue de code et de tests d’attaque en conditions réelles a été réalisé avant la vente

Démo

Vous pouvez explorer le site et le panneau d’administration dans une démo en lecture seule. La démo est installée en turc ; dans le panneau d’administration, vous pouvez passer la langue du panneau en anglais avec l’icône de globe en haut à droite (ce choix n’est conservé que dans votre navigateur). Le nom de l’établissement, les produits, les prix, les articles et les photos de la démo sont tous du contenu d’exemple. Dans le panneau de démo, vous pouvez ouvrir la page « QR Kod » (Code QR), télécharger les codes et essayer l’affichage des cartes de table ; les codes portent l’adresse du site de démo. Dans la liste « Mesajlar » (Messages), vous voyez quelques enregistrements d’exemple. WhatsApp, les liens de réseaux sociaux et la carte sont laissés vides dans la démo ; ils apparaissent sur le site dès que vous les renseignez dans le panneau.

• Site : https://018.tiklaweb.net
• Panneau d’administration : https://018.tiklaweb.net/admin
• E-mail de démo : demo@tiklaweb.net
• Mot de passe de démo : demo1234

Dans la démo, les modifications ne peuvent pas être enregistrées ; le formulaire de contact n’enregistre rien et n’envoie pas d’e-mail. La démo est réinitialisée chaque nuit. Les pages sensibles, comme les paramètres e-mail, les utilisateurs et les formulaires de mot de passe, ne sont pas consultables en mode démo, et « Mot de passe oublié » est désactivé dans la démo. Ces identifiants ne valent que pour le site de démo. Dans l’installation que vous achetez, vous définissez vous-même le compte administrateur.

Assistance

Si vous êtes bloqué, vous pouvez ouvrir une demande d’assistance depuis votre espace client tiklaweb.net ou écrire à destek@tiklaweb.net.