anunatak/anunatheme

安装: 12

依赖: 0

建议者: 0

安全: 0

星级: 1

关注者: 2

分支: 0

开放问题: 0

语言:CSS

类型:wordpress-theme

dev-master 2017-02-17 14:30 UTC

This package is not auto-updated.

Last update: 2024-09-23 15:20:41 UTC


README

AnunaTheme 是一个基于 Sage 的 WordPress 入门主题,加入了 Laravel Blade。

如果你在寻找一个完整的、生产就绪的主题,请继续前进。AnunaTheme 是一个骨架,包含最基本的设计风格,并作为开发者的起点。

特性

要求

Ajax 请求

在 AnunaTheme 中,Ajax 被简化了。

PHP

在服务器端,在您的 lib/ajax.php

Ajax::create('my_cool_action', function($request) {
	echo $request->get('cool_parameter_from_request');
});

$request 对象是 Symfony\Component\HttpFoundation\Request 的一个实例。请查看文档以获取使用说明。

CoffeeScript

在客户端,在您的 assets/scripts/plugins/routes.coffee

new Ajax 'my_cool_action', ( (response) ->
	console.log response
),
	cool_parameter_from_request: 'You are cool!'

客户端 Ajax 类接受以下参数

  • action:发送请求的操作。
  • callback:回调函数。
  • data(可选):数据对象
  • method(可选):请求要使用的方法。默认为 'GET'

404 页面

我们在主题中集成了一个有趣的 404 页面。当您的访问者到达一个不存在的页面时,他们可以玩永远受欢迎的 Snake 游戏。游戏背后的代码由 Nick Pierson 提供,他在此期间熟悉 JavaScript。我们对它进行了一些小的调整,允许我们修改颜色并监听事件。请参见插件 GitHub 页面

基于 DOM 的路由

Sage 有一个称为基于 DOM 的路由的功能。在 AnunaTheme 中,您也可以以同样的方式路由您的项目,但我们使用了一个名为 jquery-dom-router 的优秀 jQuery 插件。

我们已设置此配置,您可以在 assets/scripts/plugins/routes.coffee 中添加您的 DOM 路由。

Blade

Blade 是出色 Laravel 框架的模板语言。Anunablade 基于它创建所有模板,归功于 Blade for Wordpress

所有主题文件都使用 "Bladed" 并准备好使用 Blade 语法。由于 Blade 类似于自己的主题包装器,因此我们已删除 Sage 的包装器。

例如,查看 index.php 文件,了解如何扩展布局。

所有模板文件位于 templates 目录中。文件夹 cache 作为 WordPress 模板文件的缓存(例如,WordPress 模板层次结构搜索的所有模板文件)。

Gulp

在主题的 gulpfile 中定义了多个任务以实现良好的工作流程。

  • images 将优化位于 assets/images 的图像。
  • scripts 将编译 CoffeeScript 和 Browserify。
  • styles 将编译 SCSS。
  • watch 将监视文件并在需要时运行任务。

在开发过程中将创建源映射,并且输出将不会被压缩(stylesscripts)。要创建生产就绪文件,只需在运行 gulp 时添加 --production 参数(gulp --production)。

命名规范

AnunaTheme 中的所有函数都遵循 Sage 的命名规范。这意味着它们被命名空间化。

重命名到您的主题

要使用您自己的主题名称,请按照以下步骤在项目根目录下的所有文件中进行搜索和替换。

  1. 命名空间:搜索 AnunaTheme\(区分大小写)并将其替换为 YourNamespace\
  2. 文本域:搜索 'anunatheme'(区分大小写)并将其替换为 'your-textdomain'
  3. 主题名称:搜索 AnunaTheme(区分大小写)并将其替换为 Your Theme Name

入门指南

  1. 安装 Composer 依赖项:composer install
  2. 安装 NPM 软件包:[sudo] npm install
  3. 安装 Bower 依赖项:bower install
  4. 首次运行 Gulp:gulp watch(更多选项请参阅文档)

文档

Sage 文档可在 https://roots.io/sage/docs/ 查找。