koalabs/modelo

一组视图,可作为html的基础模板

dev-master 2014-07-28 23:17 UTC

This package is not auto-updated.

Last update: 2024-09-24 01:33:04 UTC


README

Modelo是一组视图,可作为网站的非常基本的模板
它收集了网络上的最佳实践(参见 h5pb 或 Zurb的 Foundation),以便为大多数网站提供一个强大的起始模板

快速概述

Modelo由四个基本文件组成

  • master.blade.php
  • head.blade.php
  • body.blade.php
  • tail.blade.php

master.blade.php

master.blade.php 文件相当简单。
它通过添加 htmlheadbody 标签来 打开和关闭 页面。
它还包括其他三个文件(head.blade.phpbody.blade.phptail.blade.php)。

head.blade.php

正如其名称所指出的,这是您的网站的 <head>
在这里,我们添加基本元数据,并包含 css样式表javascript 文件。

body.blade.php

我们只是在这里包含内容。很简单。这里是发挥创意的地方。

tail.blade.php

我们还在这里添加了大部分的 javascript文件,以提高网站性能,以及一个用于 Google Analytics 的跟踪ID。

安装

在您的应用程序根目录中,打开 composer.json 文件,将包添加到 require 部分,使其看起来像这样

"require": {
       "laravel/framework": "4.0.*",
       "koalabs/modelo": "1.*"
},

打开命令行,在我们的应用程序根目录下,运行Composer更新,如下所示

php composer.phar update

现在让我们添加Modelo Service Provider。打开 app/config/app.php 文件,并在 providers 数组中添加以下行

'Koalabs\Modelo\ModeloServiceProvider'

您还可以发布配置文件,以避免在未来的更新中覆盖它们。只需输入

php artisan config:publish koalabs/modelo

配置

'vendor/koalabs/modelo/src/config/modelo.php' 中找到配置文件,并将其移动到 'app/config' 文件夹。

用法

您可以将 Modelo 作为任何视图的模板。
只需在文件开头添加此行

@extends('modelo::master')

页面的实际内容放入一个 content 标签中

@section('content')
  <!-- Yout content here -->
@stop

示例

假设您想制作一个 'about' 页面。
只需这样做

@extends('modelo::master')
@section('title') About Us @stop
@section('description') Some description for the meta tag here @stop

@section('content')
  <!-- The content goes here -->
@stop

这些都是基础。但通过利用Modelo的帮助标签和配置文件,您可以做更多的事情。

标签列表

主体

  • @section('content') 用于实际页面内容 That's it...

头部部分

如果您想为特定页面创建一个全新的 <head>,则可以这样做。
使用:@section('head')

在头部内部,我们还有其他标签

  • @section('title') 用于添加元标题。
  • @section('description') 用于添加元描述
  • @section('meta')用于添加自定义元数据(例如,例如,隐藏页面)
  • @section('styles') 用于向页面添加新的CSS样式集
  • @section('page_styles')如果您想使用贯穿整个网站的相同CSS样式,但还想包括一个新的样式。

尾部部分

  • @section('tail') 用于完全不同的尾部。
  • @section('page_scripts') 用于添加针对页面的脚本。

配置

config/modelo.php 文件中,您有这些选项

  • 定义网站的作者
  • 定义你的主要CSS文件所在路径。因为你 正在压缩文件并只提供单个,对吧?
  • 开启或关闭 jQuery。
  • 选择 jQuery 版本。
  • 选择你将提供给所有页面的脚本。
  • 开启或关闭 Google Analytics。