simple f3 bootstrap 5 multi lang site

一个简单的多语言网站，没有脂肪

使用Bootstrap 5和无脂肪PHP框架（但没有数据库 - 这不是CMS ）的简单多语言网站的前端 /后端设置。

概述

将Bootstrap 5与无脂肪的PHP框架相结合，以构建网站：

• 使用模板组装页面
• 提供干净的URL
• 支持自动语言选择
• 在共享服务器上工作
• 易于安装（只需复制和粘贴，不需要包装管理器）

以前，为了获得无脂肪和Bootstrap 4的经验，我使用Bootstrap 4和无脂肪创建了一个演示站点，并通过GitHub存储库共享了文件。

为了发布Bootstrap 5.3（支持黑模式）（并且不再支持Internet Explorer），我创建了一个新的演示站点和存储库。

演示

该存储库中的代码在https://sbf-bootstrap5.alwaysdata.net/上运行，该代码在提供PHP和APACHE的免费托管服务上运行。目的是使代码成为一个完全可行的软件包，而不仅仅是用于构建站点的裸露起点。

该设计不是CMS。没有数据库。所有内容均在配置文件，控制器文件和内容模板中，它们适用于静态站点。

应用设置

我所有用于演示网站，无脂肪配置，控制器和模板文件以及关联的SCSS，Image和JavaScript文件的文件都在此GitHub存储库中。引导和无脂肪文件可从引导和无脂肪中获得。

应该可以用其他网站的内容替换我的网站特定内容。

包括什么（不是全面列表）

无脂

• config.ini
• 路由
• 所有控制器文件
• 所有页面的模板

不包括无脂肪的文件 - 这些文件可从无脂肪中获得

引导程序

Bootstrap易于构建其可用类并使用SASS。我从标准的引导代码中更改了一些事情：

• 对于Bootstrap的OffCanvas菜单：
  • 使用Navbar Toggle-Button打开和关闭菜单（消除了菜单上关闭按钮的需求）
  • 单击相同页面时自动关闭菜单
  • 添加了一个选项，以将重点放在目标上而不是菜单按钮上 -需要修改模块。JS源文件
• 对于具有模态的全屏背景图像
  • 添加为背景静态图像中的is-fixed类，因此它可以与模态一起使用（Bootstrap具有该功能，但记录并未得到充分记录）

不包括引导程序 - 这些文件可从Bootstrap获得

一般网站的东西

• 用XHTML生成动态站点地图：替代语言的链接
• 利用preload和picture提供各种英雄图像（4个智能手机，4片和5个笔记本电脑/监视器），以选择浏览器以提高页面加载速度
• 使用FatFree的SMTP插件进行电子邮件
• 自定义错误响应页面

多语言支持

虽然演示网站的内容是英文，但演示确实有中文和韩国页面来展示多语言操作。中文和韩国主页是使用Google Translate从英语主页创建的。其余的中文和韩国页面仅用于证明导航，只有Google翻译英文页面的标题和描述。

使用系统字体

字体样式使用system-ui,操作系统用来显示文本的相同字体。这提供了与用户在系统屏幕上看到的相似的外观，并且由于没有字体可下载，因此它加快了页面启动时间。

黑暗模式

使用Bootstrap的颜色模式结构遵守用户的prefers-color-scheme: dark设置（设置时）。

兼容性

演示网站可与最新版本一起使用：

• 边缘（桌面和表面）
• Chrome（移动和桌面）
• Firefox（移动和桌面）
• Android（三星）Internet浏览器
• 歌剧（移动和桌面）
• Safari（移动和桌面）

除了显示一般内容外，该网站不与Internet Explorer合作。

许可

此代码是根据MIT许可提供的。有关详细信息，请参见许可证文件。

根据GNU公共许可（GPL V3）提供无脂肪

Bootstrap是根据MIT许可证提供的

更新

2023/07/09 - Bootstrap 5.3版本的初始版本。

2024/01/25 - 修改后的Navbar toggler和Bootstrap 5.3.2的验证用途。