2026世界杯官方帮助文档

模板文件“2026世界杯”位于您下载的压缩包内。请解压压缩包以找到模板文件及文档文件夹。

文件及文件夹结构如下所示：

1. assets/css — 包含CSS文件的文件夹。
2. assets/fonts — 包含字体文件的文件夹。
3. assets/images — 包含图片文件的文件夹。
4. assets/js — 包含JavaScript文件的文件夹。

使用FileZilla等FTP客户端将模板文件上传至服务器。

文件编辑与上传:

您可以通过代码编辑器（如VS Code）打开单个页面进行定制。完成所有定制后，如需上线网站，请将更新后的项目文件上传至您的域名托管服务器。文件上传可使用FileZilla等FTP客户端。

以下是加载在页面Head部分的主要CSS文件：

<!--====== Font Awesome ======-->
<link rel="stylesheet" href="assets/css/fontawesome.5.9.0.min.css">
<!--====== Flaticon CSS ======-->
<link rel="stylesheet" href="assets/css/flaticon.css">
<!--====== Bootstrap css ======-->
<link rel="stylesheet" href="assets/css/bootstrap.4.5.3.min.css">
<!--====== Magnific Popup ======-->
<link rel="stylesheet" href="assets/css/magnific-popup.css">
<!--====== Slick Slider ======-->
<link rel="stylesheet" href="assets/css/slick.css">
<!--====== Animate CSS ======-->
<link rel="stylesheet" href="assets/css/animate.min.css">
<!--====== Nice Select ======-->
<link rel="stylesheet" href="assets/css/nice-select.css">
<!--====== Padding Margin ======-->
<link rel="stylesheet" href="assets/css/spacing.min.css">
<!--====== Menu css ======-->
<link rel="stylesheet" href="assets/css/menu.css">
<!--====== Main css ======-->
<link rel="stylesheet" href="assets/css/style.css">
<!--====== Responsive css ======-->
<link rel="stylesheet" href="assets/css/responsive.css">

以下是加载在HEAD或BODY结束前的主要JavaScript文件：

<!--====== Jquery ======-->
<script src="assets/js/jquery-3.6.0.min.js"></script>
<!--====== Bootstrap ======-->
<script src="assets/js/bootstrap.4.5.3.min.js"></script>
<!--====== Appear js ======-->
<script src="assets/js/appear.js"></script>
<!--====== WOW js ======-->
<script src="assets/js/wow.min.js"></script>
<!--====== Isotope ======-->
<script src="assets/js/isotope.pkgd.min.js"></script>
<!--====== Circle Progress ======-->
<script src="assets/js/circle-progress.min.js"></script>
<!--====== Image loaded ======-->
<script src="assets/js/imagesloaded.pkgd.min.js"></script>
<!--====== Nice Select ======-->
<script src="assets/js/jquery.nice-select.min.js"></script>
<!--====== Magnific ======-->
<script src="assets/js/jquery.magnific-popup.min.js"></script>
<!--====== Slick Slider ======-->
<script src="assets/js/slick.min.js"></script>
<!--====== Main JS ======-->
<script src="assets/js/script.js"></script>

整体模板结构在各页面中保持一致，每个部分均由带有特定ID的section标签包裹。基本结构如下：

FIFA世界杯首页汇聚足球赛事直播中心、实时比分、世界杯赛程与热门球队动态内容，覆盖全球热门足球赛事与2026世界杯精彩比赛，支持高清流畅观看体验与多终端快速访问，帮助用户快速掌握世界杯最新赛事动态与足球资讯内容。

字体代码位于“style.css”文件中，路径为：assets/css/style.css

// Font Family
--base-font: 'Inter', sans-serif;
--heading-font: 'Poppins', sans-serif;

文件路径: assets/css/style.css

// colors
--base-color: #5b5675;
--heading-color: #141125;
--primary-color: #5138ee;
--light-color: #f8f7fc;
--yellow-color: #ffc800;
--border-color: #edebfd;

文件路径: assets/js/script.js

// 08. Feedback Slider One
if ($('.feedback-wrap').length) {
    $('.feedback-wrap').slick({
        dots: true,
        infinite: false,
        autoplay: true,
        fade: true,
        autoplaySpeed: 5000,
        arrows: false,
        centerMode: false,
        speed: 1000,
        slidesToShow: 1,
        slidesToScroll: 1,
    });
}  

更多信息请浏览链接：轮播图文档选项

请移除或注释掉以下代码文件路径：assets/js/script.js

// 15. WOW Animation
if ($('.wow').length) {
    var wow = new WOW({
        boxClass: 'wow', // animated element css class (default is wow)
        animateClass: 'animated', // animation css class (default is animated)
        offset: 0, // distance to the element when triggering the animation (default is 0)
        mobile: false, // trigger animations on mobile devices (default is true)
        live: true // act on asynchronously loaded content (default is true)
    });
    wow.init();
}

请移除或注释掉以下代码文件路径：assets/js/script.js

// 16. Preloader
function handlePreloader() {
    if ($('.preloader').length) {
        $('.preloader').delay(200).fadeOut(500);
    }
}
handlePreloader();

同时，请移除或注释掉以上所有HTML文件中的相关代码。

<!-- Preloader -->
<div class="preloader"></div>

请优化所有图片的KB、MB大小，并遵循占位符文件路径使用合适的图片尺寸：assets/images/..

- Tinypng

请压缩所有CSS文件，路径：assets/css/..

- CSS压缩工具

请压缩所有JS文件，路径：assets/js/..

- JavaScript压缩工具

请前往图片文件路径 'assets/images/...'，根据占位符图片的尺寸和名称替换您想要的图片。

我们将在未来基于最新技术更新项目，但您也可以自行更新模板以满足您的需求。

注意：所有图片仅用于预览目的，不包含在最终购买文件中。

图片来源: https://www.freepik.com/ https://pixabay.com/ https://unsplash.com/

字体: Inter Poppins

图标字体: Fontawesome Flaticon