前言

Orchard在你的站点应用的默认主题叫做”Theme Machine”.该主题包括CSS样式和一个布局框架. Orchard 允许你选择或排除显示在你站点每个页面的布局. 默认情况下下图中蓝色高亮区域显示在主页中.

Navigation 包含一个菜单,新站点只有一个Home标签.TripelFirst, TripleSecondTripleThird显示在页面底部.

每个页面都有一个中心区(在本例中就是下图中,  "Welcome to Orchard" 到 "Thank you for using Orchard"部分) ,在本指南中我们称为Body.

虽然Theme Machine 已经定义许多区域,但是只有widgets被添加到那个区域的时候主页才会显示(Navigation, TripelFirst, TripelSecond 还有 TripelThird 这几个区域的内容之所以显示在主页上就是因为他们包含widgets)

修改默认布局

1) 从仪表盘中选择Widgets

Widgets管理页面默认打开的是’Default’ 布局,该布局中启用的区域会显示在所有页面上.图中Navigation 是启用的,图中 Main Menu widget 被标注为绿色表示已经添加到Defaut布局,因此我们在所有的页面上都能看到Main Menu Widget.

2) 选择HomePage 布局来看看那些区域在首页中被启用.

所有被添加到区域的Widgets 都会标记为绿色 (FirstLeaderAside, SecondLeaderAside 和 ThirdLeaderAside). 已经被添加到其他布局区域的Widgets 会标记为灰色 (Main Menu).

3) 移除Third Leader Aside widget.

移除后TripelThird 就不会显示在首页了

4)  在TripelThird 添加一个 widget

5) 选择 HTML Widget 作为widget 的类别

6) 设置widget  标题和内容

7) 保存新的 widget.

8) 刷新你的站点看到如下效果

新建一个布局

你可以新增一个布局来设定某些页面使用,比如你建了一个Downloads 页面.然后你可以摆放一些 widgets然他们只显示在Downloads页面.

1) 进入仪表盘,选择 Widgets. 然后点击 add a new layer 进行新页面的添加.

2) 为新的布局填写名字(Name),描述(Description), 还有规则(Rule) ,注意规则中 url"~/download" 代表download页面(创建页面的时候可以设置页面地址Permalink),  这是指示Orchard,如果访问download这个页面,那么该页面就显示我们新建的这个布局.

3) 添加一个 widget 到你的新布局中 ,我们选择 AsideFirst.

4) 选择 Html Widget.

5) 编写标题和内容

6) 保存以后刷新页面,选择Downloads页面查看效果.

原文:http://docs.orchardproject.net/Documentation/Getting-Started

(只翻译了修改首页布局部分)

[翻译]Orchard-修改首页布局的更多相关文章

  1. SharePoint Online 创建门户网站系列之首页布局

    前 言 SharePoint Online中创建首页布局,一般都是首先将美工提供的效果图,切图成为Html + Css + Script的形式,然后,将所有资源文件传到SharePoint Onlin ...

  2. 树莓派 Learning 002 装机后的必要操作 --- 00 修改键盘布局

    树莓派 装机后的必要操作 - 修改键盘布局 我的树莓派型号:Raspberry Pi 2 Model B V1.1 装机系统:NOOBS v1.9.2 上网查,发现树莓派的键盘布局不对,树莓派(ras ...

  3. IT兄弟连 HTML5教程 DIV+CSS网站首页布局示例

    首页的设计直接影响网站的整体形象,虽然没有一个统一的规范,但最好将其设计为大众化的,只要信息内容能够合理地编排即可,使用户可以方便地找到需要的信息.另外,首页的高度最好不要超过三个屏幕,页面中使用的颜 ...

  4. 01-02 Flutter仿京东商城项目 功能分析、底部导航Tab切换以及路由配置、架构搭建:(Flutter仿京东商城项目 首页布局以及不同终端屏幕适配方案)

    Flutter和Dart交流学习群:交流群:452892873 01Flutter仿京东商城项目 功能分析.底部导航Tab切换以及路由配置.架构搭建 02Flutter仿京东商城项目 首页布局以及不同 ...

  5. [翻译]Orchard如何工作

    Orchard一直是博主心中神一般的存在,由于水平比较菜,Orchard代码又比较复杂看了几次都不了了之了.这次下定决心要搞懂其工作原理,争取可以在自己的项目中有所应用.为了入门先到官网去学习一下相关 ...

  6. 关于修改test9ui布局的一些小笔记

    今早,上IT修真园里,看到师兄大娃很负责任的将我任务里的项目的排版,3,6,7的列了出来. 谢谢师兄,那么负责任的照看师弟. 言归正传,我一开始,直接按照师兄的指示,选择性的优先修改底部.效果也达到了 ...

  7. easyui源码翻译1.32--Layout(布局)

    前言 使用$.fn.layout.defaults重写默认值对象.下载该插件翻译源码 布局容器有5个区域:北.南.东.西和中间.中间区域面板是必须的,边缘的面板都是可选的.每个边缘区域面板都可以通过拖 ...

  8. 关于jeecms修改首页进行测试

    由于要学习,jeecms的标签使用,那么必须要有一个测试页.关于首页如何使之用之当测试页. 修改的步骤,找到web.xml文件修改 <welcome-file-list> <welc ...

  9. Django学习系列9:接着修改首页

    现在的功能测试还是失败的,继续修改代码,让其通过.因为HTML现在保存在模板中,可以尽情修改,无需编写额外的单元测试.我们需要一个<h1>元素 修改:lists/templates/hom ...

随机推荐

  1. 树型动态规划(树形dp)

    树型动态规划就是在“树”的数据结构上的动态规划,树型动态规划是建立在树上的,所以有二个方向: 1.根—>叶:这种题目基本上碰不到 2.叶->根:根的子节点传递有用的信息给根,完后根得出最优 ...

  2. Microsoft Azure 负载平衡服务

     Microsoft Azure 为在其中托管的虚拟机(IaaS) 和云服务(PaaS) 提供负载平衡服务.负载平衡支持应用程序伸缩,并且提供应用程序故障恢复以及其他优势. 可以通过以下方式访问负 ...

  3. 对开发中常见的内存泄露,GDI泄露进行检测

    对开发中常见的内存泄露,GDI泄露进行检测 一.GDI泄露检测方法: 在软件测试阶段,可以通过procexp.exe 工具,或是通过任务管理器中选择GDI对象来查看软件GDI的对象是使用情况. 注意点 ...

  4. UVA-Matrix Chain Multiplication(栈)

     Matrix Chain Multiplication  Suppose you have to evaluate an expression like A*B*C*D*E where A,B,C, ...

  5. nefu 462 fib组合

    nefu 462 fib组合 (斐波那契数列的通项公式以及推倒过程) 分类: 数学2014-05-21 10:27 190人阅读 评论(0) 收藏 举报 题目链接:http://acm.nefu.ed ...

  6. Android UI设计

    Android UI设计--PopupWindow显示位置设置 摘要: 当点击某个按钮并弹出PopupWindow时,PopupWindow左下角默认与按钮对齐,但是如果PopupWindow是下图的 ...

  7. Android Animation学习(一) Property Animation介绍

    Android Animation Android framework提供了两种动画系统: property animation (introduced in Android 3.0)和view an ...

  8. Windows Server 2012 R2 服务器管理器介绍和配置使用

    1. 服务管理器是用于管理系统服务的管理工具.一般常用于windows系统,使用这个工具你可以启动.停止服务:设置服务是自动.手动启动或禁用:查看某个服务的相关信息:设置服务以什么用户启动等等(一般包 ...

  9. zoj 3714 Java Beans

    /*很简单的一题,求连续的m位,求总和最多的值,循环找一下,就出来了*/ #include<stdio.h> ]; int main(int argc, char* argv[]) { i ...

  10. TabelView的多选模式

    @interface ViewController ()<UITableViewDelegate,UITableViewDataSource> @property(nonatomic,st ...