simple f3 multi lang site
1.0.0
Ein Frontend- / Backend-Setup für eine einfache, mehrsprachige Website mit Bootstrap 4 mit dem fettfreien PHP-Framework, jedoch ohne Datenbank.
Ich wollte, dass ein PHP -Framework mit Bootstrap 4 verwendet wird, um Websites zu erstellen, die:
Meine Wahl war fettfrei- "ein leistungsstarker, aber benutzerfreundlicher PHP-Micro-Framework"
Um sicherzugehen, dass ich eine Website bauen kann, habe ich eine erstellt. Eine Website darüber, wie ich Bootstrap und fettfrei verwendet habe, um eine Website zu erstellen. Und die Seite ist meine Aufzeichnung für das, was ich getan habe und warum.
Dies ist kein CMS. Es gibt keine Datenbank. Der gesamte Inhalt befindet sich in der Konfigurationsdatei, den Controller -Dateien und den Inhaltsvorlagen.
*Hinweis: Ich habe ein ähnliches Repository für Bootstrap 5 unter https://github.com/richdebourke/simple-f3-bootstrap-5-multi-lang-site.
Der gesamte Code aus diesem Repository ist unter http://sbf-testing.byostost7.com in Betrieb. Die Absicht ist, dass der Code ein so vollständig wie mögliches Paket ist, anstatt nur ein Ausgangspunkt für den Aufbau eines Standorts. Die Demo wird auf einem kostenlosen Hosting -Dienst ausgeführt, der PHP und Apache bietet, aber keine E -Mails und die meisten Bots sind blockiert. Daher kein Kontaktformular und kein SSL 1 (deshalb sage ich "eine fast vollständige" Site), aber diese sollten einfach genug auf einem Produktionshost implementieren.
Hinweis 1 : Der Hosting-Service bietet selbstsignierte Zertifikate, aber ich bin mir nicht sicher, ob Google diese für das Suchranking akzeptiert. Da die Hosting -Service die meisten Bots blockiert, ist es schwierig, mein Eigentum zu validieren, also führe ich die Website ohne SSL aus.
Alle meine Dateien für die Demo-Site, die fettfreie Konfiguration, die Controller und die Vorlagendateien sowie die zugehörigen SCSS-, Image- und JavaScript-Dateien finden Sie in diesem GitHub-Repository. Die Bootstrap- und fettfreien Dateien sind bei Bootstrap und fettfrei erhältlich.
Es sollte einfach genug sein, meinen site -spezifischen Inhalt durch Inhalte für eine andere Website zu ersetzen.
Die fettfreien Dateien sind nicht enthalten-diese Dateien sind von fettfreien verfügbar
Bootstrap ist leicht zu strukturieren mit den verfügbaren Klassen und Verwendung von SASS. Es gab zwei Dinge, die ich aus dem Standard -Bootstrap -Code geändert habe:
Die Bootstrap -Dateien sind nicht enthalten - diese Dateien sind bei Bootstrap bei der verfügbaren Dateien verfügbar
Während der Inhalt der Demo-Website in englischer Sprache ist, verfügt die Demo über chinesische und koreanische Seiten, um den mehrsprachigen Betrieb zu demonstrieren. Die chinesischen und koreanischen Heimseiten wurden auf der englischen Homepage mit Google Translate erstellt. Der Rest der chinesischen und koreanischen Seiten, die nur zur Demonstration der Navigation bereitgestellt werden, haben nur Google -Übersetzungen der Titel und Beschreibungen der englischen Seiten.
Für das Update Juli 2022 habe ich zusätzlich zur Überprüfung der Website mit den neuesten Versionen von Fat-Free, Bootstrap 4 und JQuery die Website überarbeitet, um:
Verwenden Sie Systemschriften-Umgeschaltet von der Verwendung von Google-Schriftarten zur Verwendung von system-ui Schriftarten. Nach Verwendung von Google -Schriftarten muss der Browser des Benutzers eine Anfrage an Google für das Stylesheet und die erforderlichen Schriftdateien senden. Dies beinhaltet das Senden der IP -Adresse des Benutzers an Google, die der EU General Data Protection Regulation (DSGVO) nicht zulässig ist. system-ui weist den Browser an, dieselbe Schriftart zu verwenden, mit der das Betriebssystem Text angezeigt wird. Dies bietet einen ähnlichen Blick auf das, was der Benutzer auf den Systembildschirmen sieht, und beschleunigt die Startzeit der Seiten, da keine Schriftarten heruntergeladen werden müssen.
Self-Host-Bootstrap- und JQuery-Dateien-von der Verwendung von Inhaltsdeliefer-Netzwerken für Framework- und Bibliotheksdateien auf die Bereitstellung der Dateien von meinem Server ausgeschaltet, wodurch die DSGVO-Anforderung für die Nichtheizung von Benutzer-IP-Adressen mit anderen Websites erneut verwendet wird. Ich verwende jetzt WebPack, um JQuery, Bootstrap JavaScript, JQuery Locking Plugin und das JavaScript für die Site in eine Datei zu kombinieren (eine Datei wird schneller heruntergeladen).
Unterstützung von Vorlieben-reduzierter Bewegung-Während Boostrap die Benutzereinstellung bereits für reduzierte Bewegungen unterstützte, habe ich die JQuery-Animationen nicht angepasst. Ich mache jetzt.
Unterstützen Sie die Vorstufe des Farben-Schadens-Fügte ein Dark-Mode-Format für Benutzer hinzu, die ein dunkles Format und nicht ein Lichtformat bevorzugen.
Die Demo -Website funktioniert mit den neuesten Versionen von:
Und mit:
Dieser Code wird im Rahmen einer MIT -Lizenz bereitgestellt. Weitere Informationen finden Sie in der Lizenzdatei.
Fettfrei wird im Rahmen einer GNU Public Lizenz (GPL V3) bereitgestellt
Bootstrap wird unter einer MIT -Lizenz bereitgestellt
Die Offcanvas -Navigation wird im Rahmen einer MIT -Lizenz bereitgestellt
2018/09/23 - Erstveröffentlichung.
2019/01/02 -Validierte Die Website funktioniert mit fettfreien 3.6.5 und aktualisiert einige der Seiteninhalte für bessere Suchmaschinenergebnisse.
2019/05/10 - Validiert Die Website funktioniert mit JQuery 3.4.1 und Bootstrap 4.3.1.
2019/05/27 - Um den Abschnitt für die EU -Cookie -Mitteilung am Ende der Seite zu verschieben, da Google manchmal den Bekanntmachungstext auf einigen Suchmaschinen -Ergebnisseiten aufnahm.
2019/07/02 - Implementiertes display=swap auf den Google -Schriftarten, wodurch zumindest für Google -Schriftarten ein Schriftart Manager erforderlich ist (ich verwendete Font Face Observer).
2020/01/20 -Validiert Die Website funktioniert mit fettfreien 3.7.1 und Bootstrap 4.4.1 und hat einige geringfügige Änderungen an den Inhalt vorgenommen.
2020/07/05 -Validierte Die Site funktioniert mit fettfreien 3.7.2, Bootstrap 4.5.0 und JQuery 3.5.1, beseitigte die nichtminifizierten CSS-Dateien (lieferte nur minified CSS-Dateien auf der Website) und machte einige kleinere Änderungen an den Inhalt vor (einschließlich einer Erklärung, wie ich in VS-Code in Sass in VS-Code eintrifft).
2022/07/15 -Validierte Die Site funktioniert mit fettfreien 3.8.0, Bootstrap 4.6.1 und JQuery 3.6.0, wechselte von Google-Schriftarten auf die Verwendung von Systemschriften, fügte Unterstützung für reduzierte Bewegung und Dunkelmodus hinzu und aktualisierte den Inhalt.
2022/11/17 - Validierte Die Site funktioniert mit JQuery 3.6.1 und wurde auf normale und hochauflösende Webp -Bilder für helle und dunkle Modi mit Bild- und Quellelementen umgestellt.
2023/07/09 -Fügen Sie Link zu Bootstrap 5.3 mit dem fettfreien PHP-Framework-Repository hinzu.
2023/10/07 - Validierte Die Site funktioniert mit Bootstrap 4.6.2 und JQuery 3.7.1. Auf dem Host für die Demo-Website werden jetzt PHP 8.2 ausgeführt, sodass die Demo jetzt fettfrei 3.8.2 verwendet.
