我个人认为Magento模板制作的难点在于不了解Magento的架构,不会调动block。Magento的block调动几乎都是靠xml。在下面的内容会提及如何操作。

制作Magento模板的前提是:你要会Html,div+css。不管你想做什么模板,这个都是基础。如果想要做出个精致的Magento,还必须精通div+css。因为涉及到一个浏览器的兼容问题,当你在Firefox下打开你的Magento商城看着感觉是很完美,但是到了IE6下完全变形,而且中国还有50%左右的人用IE6。

在制作Magento模板之前,首先要选一个比较简单的模板,然后在此基础上做。我个人推荐使用Blank模板,这个模板比较干净,图片除了必须的 几乎没有,而且css也很精简。我刚开始做Magento模板的时候用的是Default的模板,这个模板的css文件很大,而且等模板完成后,会有很多无用图片。曾经做一个项目的时候,客户死死的抓住网站的css文件太大,让我相当的头疼。废话有点多,现在开始正题。

Magento模板最主要的地方是首页,首页完成,Magento模板就完成30%左右了。我个人习惯是先改头部和尾部,这两个地方是所有页面都有的。头部的东西都在app\design\frontend\default\你的主题\template\page\html\header.phtml里面。底部的东西都在app\design\frontend\default\你的主题\template\page\html\footer.phtml里面。这两块的话都是靠css修改的,没什么好说的。我重点讲下中间部分的布局等。

Magento的布局对于新手来说,是比较困难的。如果英语好的话建议去看看官方的介绍http://www.magentocommerce.com/design_guide/articles/intro-to-layouts,现在网上也有很多翻译好的了,想要的可以去找找。我个人认为布局就是把已有的block放到应该的地方,一般都是在xml里面调动。我介绍下catalog.xml,其他的就不说了,原理都一样,而且大部分的布局都可以在catalog里面实现。app\design\frontend\default\你的主题\layout\catalog.xml,进入后你可以看到类似的注释“Default layout, loads most of the pages”,这些注释的意思就是你所改的是什么地方的布局,例如:“Default layout, loads most of the pages”这句说的就是网站默认布局。接着往下看,会看到很多的<reference >标签,这些都是需要在page.xml里定义过后,这里才能用,这里先不详细介绍了。这些“name”有“left”,“right”,“header”等等,从字面上我们就能看出来他们所指的位置,“left”是指左边栏,“right”指右边栏,“header”指头部。各个<reference >标签里会包含多个<block>block就是我要调用的功能模块了。例如经常会有人问怎样把左边的什么移到右边,这个问题很好解决,在“left”里找到对应的block放到右边,这样就成功了。是不是觉得很简单,这篇就先讲到这,没写过这样的教程,可能讲的不详细,如果有不懂的可以留言。

magento 如何制作模板的更多相关文章

  1. Magento修改邮件模板内容

    Magento 默认邮件模板 都是带着官方的标志和一些官方的基本信息.为了建立品牌形象我们需要把邮件模板中的所有官方信息换成自己的信息.修改步骤如下: 1.找到Magento的邮件模板文件(这里以 e ...

  2. Vue2.0 【第二季】第5节 Template制作模板

    目录 Vue2.0 [第二季]第5节 Template制作模板 第5节 Template制作模板 一.直接写在选项里的模板 二.写在template标签里的模板 三.写在script标签里的模板 Vu ...

  3. iOS Xcode制作模板类-b

    为什么要定义模板类 遵守代码规范可以提高代码可读性, 降低后期维护成本. 当我们定下了一个团队都认同的代码规范, 如我们要求所有的viewController的代码都得按照下面来组织: #pragma ...

  4. Magento 2 Block模板终极指南

    /view/frontend/page_layout/2columns-left.xml <layout xmlns:xsi="http://www.w3.org/2001/XMLSc ...

  5. AD 文档信息设置和制作模板

    原理图文档模板制作方法一.在DXP2004/AD6.0/AD6.3原理图设计环境下,新建一个自由原理图文档.单击:文件→新建→原理图,或者使用快捷键Ctrl+N打开Files资源面板,在“新建”项目下 ...

  6. iOS Xcode制作模板类

    转载请注明出处http://blog.csdn.net/uxyheaven/article/details/48419963 为什么要定义模板类 遵守代码规范可以提高代码可读性, 降低后期维护成本. ...

  7. 织梦dedecms模板调用标签大全-提高制作模板速度

    关键描述调用标签: ——————————————————————————–模板路径调用标签: {dede:field name=’templeturl’/}—————————————————————— ...

  8. vue - 制作模板

    1. 选项模板 2. template模板 3. script标签模板 <!-- 选项模板 --> <!DOCTYPE html> <html lang="en ...

  9. magento优化之模板静态化

    最近首页很慢,运行magento profile检查的时候,发现首页某个templat运行时间占了一半,大概6s. 用magento自带的缓存,尝试把代码中的collection缓存起来,但不知道为啥 ...

随机推荐

  1. visudo使用笔记

    目录前言一.介绍二.配置文件简介三.实战配置 前言:    su 的确为管理带来方便,通过切换到root下,能完成所有系统管理工具,只要把root的密码交给任何一个普通用户,他都能切换到root来完成 ...

  2. 《A_Pancers》团队作业6—团队项目系统设计改进与详细设计

    一.团队项目系统设计改进: 1.分析项目系统设计说明书初稿的不足,特别是软件系统结构模型建模不完善内容: 在上一次的项目系统设计说明书中没有很好的完成软件系统结构模型的建模设计,只做了基本的系统项目原 ...

  3. java日期操作 大全

    先来一个:  取得指定月份的第一天与取得指定月份的最后一天  http://iamin.blogdriver.com/iamin/847990.html ));             }       ...

  4. 【Golang】 可以自动生成测试用例的库--gotests

    简介 gotests是一个Golang命令行工具,它可以使编写Go的测试代码变得容易.它能基于目标源文件的函数和方法生成数据驱动测试用例,并且在此过程会自动导入任何依赖. 下面是gotests在使用S ...

  5. TP5框架whereor

    whereOr方法 Db::table('think_user') ->where('name','like','%thinkphp') ->whereOr('title','like', ...

  6. python面试题(转自https://www.cnblogs.com/wupeiqi/p/9078770.html)

    第一部分 Python基础篇(80题) 为什么学习Python? 通过什么途径学习的Python? Python和Java.PHP.C.C#.C++等其他语言的对比? 简述解释型和编译型编程语言? P ...

  7. SpringBoot中的数据库连接池

    内置的连接池 目前Spring Boot中默认支持的连接池有dbcp,dbcp2, tomcat, hikari三种连接池. 数据库连接可以使用DataSource池进行自动配置. 由于Tomcat数 ...

  8. DataGridView1

    for (int i = 0; i < DataGridView1.SelectedRows.Count; i++)    { //第i行第一列 String ai1= DataGridView ...

  9. FMUtils.KeyboardHook 轻量级键盘监听器

    Nuget添加引用 Install-Package FMUtils.KeyboardHook 调用示例: var KeyboardHook = new Hook("Global Action ...

  10. java服务突然被挂掉,停止服务处理方案

    一.问题背景 该问题出现在我们测试环境.测试环境部署了很多java应用. 其中一个数据服务(主要提供订单交易数据聚合查询),用着用着就服务挂掉了也就是进程没有了. 二.分析过程 1.了解服务器配置  ...