Carivon

房车、露营车及旅居车维修服务中心

创建日期: 3/17/2019
作者: layerdrops
邮箱: [email protected]

感谢您购买 Carivon - 房车、露营车及旅居车维修服务中心。如果您有任何超出本帮助文件范围的问题,请随时通过我的用户页面联系表单发送邮件,或在支持中心提交工单。
非常感谢!


模板特性


  • 简洁干净的设计
  • 先进的Bootstrap 4框架
  • HTML5与CSS3
  • CSS3动画
  • 完全响应式设计
  • 所有文件均有详细注释
  • 兼容IE10+、Firefox、Safari、Opera、Chrome等主流浏览器
  • 详尽的文档

HTML结构


该HTML模板使用最新的 Bootstrap v3.3.4 且包含有效的HTML5标签。本主题为响应式布局,支持4列。内容区域的所有信息都嵌套在类中,并附带预定义类。

基本网格HTML

对于简单的两列布局,创建一个.container并添加适当数量的.col-md*列。

以此为例,我们使用了.col-md-4和.col-md-8,总共12列,构成完整的一行。


...
...

嵌套列

要在默认网格中嵌套内容,请在现有的.col-md*列内添加一个新的.container和一组.col-md*列。嵌套的行应包含一组列,其列数总和等于父级的列数。


一级列
二级
二级
二级列

CSS文件与结构


本主题主要使用了三个主要的CSS文件。第一个是 bootstrap.css,第二个是 style.css (用于此模板),第三个是 responsive.css 用于控制响应式布局。

如果您想编辑网站的特定部分,只需在CSS文件中找到相应的标签,然后向下滚动直到找到需要编辑的样式。


这些是加载到模板中、位于style.css文件顶部并标记为 导入的CSS.


@import url(bootstrap.min.css);
@import url(bootstrap-select.min.css);
@import url(owl.carousel.css);
@import url(owl.theme.default.min.css);
@import url(nouislider.css);
@import url(nouislider.pips.css);
@import url(jquery.bootstrap-touchspin.css);
@import url(magnific-popup.css);

@import url(animate.min.css);
@import url(hover-min.css);
@import url(../plugins/fontawesome-5/css/fontawesome-all.min.css);
@import url(../plugins/icofont/css/icofont.css);
@import url(../plugins/Carivon -icon/style.css);
                

字体

默认情况下,模板从Google Web Font服务加载此字体,您可以根据需要更换为更适合的字体。


@import url(https://fonts.googleapis.com/css?family=Muli:200,300,400,600,700,800,900);
                

jQuery与JavaScript


本主题引入了三种类型的JavaScript文件。

  • jQuery
  • 自定义脚本 (custom.js)
  • 部分插件

  • jQuery 是一个JavaScript库,能大大减少您需要编写的代码量。
  • 本站的大部分动画效果均由自定义脚本实现。有几个函数值得关注。

除了自定义脚本外,我还使用了几个“久经考验”的插件来创建效果。这些插件已打包,因此您无需手动编辑文件中的任何内容。唯一需要了解的是如何调用该方法。



这些是加载到模板中、位于Body部分末尾的JS文件。














                

谷歌地图设置


要编辑默认的联系地图,您需要修改其data-attribute。详情请参见下方截图。


以下是必需的属性:

  唯一ID

  data-map-lat

  data-map-lng

  data-map-zoom

MailChimp设置


我们添加了一个美观且功能齐全的MailChimp表单。您需要更新MailChimp的API和列表ID。


您可以在以下位置更改MailChimp的API密钥和列表ID: subscribe.php 您可以在inc/mailchimp/文件夹中找到此文件

联系表单设置


我们添加了一个美观且功能齐全的联系表单。您需要更新收件人姓名和邮箱地址。

您可以在以下位置更改收件人姓名和邮箱地址: sendemail.php 您可以在inc文件夹中找到此文件

教程


LOGO


现在开始更新模板。打开index.html文件并按照步骤操作。

大部分更新在所有页面中都是相同的。因此这里只说明一次。



    欧博官网

                

将“images/logo.png”替换为您的Logo图片URL来源或网站名称。


导航菜单


这是基本结构。


将您自己的菜单项添加到该ul li项中。如果您想添加下拉菜单,只需创建一个带有 sub-menu



页脚版权




                

将“© Copyright Carivon 2019 . All right reserved.”替换为版权信息。

来源与致谢


模板中使用的字体均为Google字体,您可以在Google Fonts API中找到它们。

使用的字体有:

Muli

Spartanmb


用于动画效果的文件:

hover.css (位于css文件夹中)

animate.css (位于css文件夹中)


使用的轮播插件:

Bootstrap Carousel

Owl Carousel


使用的插件:

Magnific Popup (位于js文件夹中)

jQuery Validation 欧博官网以欧博登录为核心,带来高效便捷的体验。

jQuery Circle Pogress 想了解更多欧博娱乐相关内容,尽在欧博官网。

Bootstrap Select 欧博官网围绕聚焦熱門遊戲,提供深度玩法解析不断创新,回应用户的真实需求。

isotope 精选整合豐富遊戲資訊,掌握最新動態内容,欧博官网与你一同发现更多精彩。

Gmap.js 欧博官网专注舉辦精彩線上活動,獎勵回饋玩家,为用户提供专业可靠的体验。

FontAwesome图标 (位于plugins文件夹中)

Icofont图标 围绕簡潔流暢的瀏覽體驗,隨時隨地暢玩,欧博官网持续打磨更优质的服务。

每段代码都附有详细注释,便于编辑。

支持


再次感谢您购买此主题。正如我一开始所说,如果您有任何与此主题相关的问题,我很乐意提供帮助。不保证一定能解决,但我会尽力协助。如果您有任何疑问,请随时通过支持中心联系我们。

发送邮件至: [email protected]

致力於為玩家打造一個高品質、互動性強的遊戲內容展示與交流平台。电话:+86 178 7469 3341邮箱:[email protected]微信:pcoubo_274