你的位置:HBcms宏博内容管理系统 HBcms使用帮助 自定义表单 正文
HBcms使用帮助
  1. 如何安装
  2. 快速入门
  3. 自定义表单
内容搜索
热门内容
  1. 美化前台表单的外观(..
  2. 下拉菜单(单选框,多..
  3. 输入框的式样和预设值
  4. 基本属性的用途
  5. 表单模型应用范例:投..
  6. 表单模型属性含义
  7. 后台属性的含义
  8. 数据库字段优化
  9. 填写规则和提示文字
  10. 高级属性和模板缓存
推荐内容
  1. 输入框的式样和预设值
  2. 基本属性的用途
  3. 表单模型应用范例:投..
  4. 表单模型属性含义
  5. 添加字段的时候,提示..
  6. 数据库字段优化
  7. 美化前台表单的外观(..
  8. 高级属性和模板缓存
  9. 填写规则和提示文字
  10. 后台属性的含义
美化前台表单的外观(表单模板)
  •  添加时间:2009-06-01 发表时间:2009-06-01 人气:4691
  • 前台表单的地址是:

    http://你的域名/hbcms/user/add_my_form.php?tb=表单模型变量名

    默认的,本程序会自动检测您使用的模板目录里是否有 user_add_my_form_表单模型变量名.tpl.html 这个模板文件

    如果有这个模板文件,那么程序就直接显示此模板文件的内容。 如果这个模板文件不存在,那么程序会自动读取会员的默认模板 user_index.tpl.html

    如何对自动生成的表单进行外观美化呢? 比如修改颜色,修改录入框的布局和位置,增加javascript特效。

    有办法!

    上面我们提到前台的表单都会读取 user_add_my_form_表单模型变量名.tpl.html 这个模板文件,

    所以,我们可以将默认产生的表单源代码,复制,粘贴到 user_add_my_form_表单模型变量名.tpl.html 这个模板文件里去,然后对源代码直接进行修改和美化。

    实施步骤:
    1. 先在后台制定好表单的所有字段,预览前台的录入表单页面看效果,直到基本满意为止
    2. 查看前台的录入表单页面的源代码,将表单部分全部复制。
    3. 在现有的模板目录,创建一个模板文件 user_add_my_form_表单模型变量名.tpl.html (建议将user_index.tpl.html 复制,重命名即可),将刚才复制的表单源代码粘贴到合适的位置。然后删除模板文件里的 <{$data_ary.user_panel.body}> 字符串(这是默认的表单输出)。
    4. 对模板文件里的表单源代码进行修改和美化,如调整位置,布局,可以一行并列排放多个录入框、加入更多的css变量来控制外观、加入更多的javascript来控制表单验证和其他特效。
    5. 完成了,预览看效果吧!
    要注意的事情:
    1. 对表单源代码进行美化的时候,不要修改录入框的name=变量名。
    2. 通过上面步骤制作的表单模板,不能再自动根据后台的字段调整而变化了。后台的每次调整,你可能都需要对此表单模板进行手工调整。
    3. 你可以先把表单源代码粘贴到dreamwaver等编辑软件里去排版,美化后,再放到模板文件里去。
    4. 大致上来说,此表单模板相当于一个HTML静态页面了。所以,一定要先在后台全部设置好所有的字段后再来制作此模板文件。如果需要重新查看程序自动生成的表单源代码,请此模板改成其他的名称,这样再刷新前台表单页面就可以看到自动生成的表单源代码了。
  • 点这里复制本页地址发送给您QQ/MSN上的好友
  • 相关文章
  • 相关评论
  • 本文章所属分类:首页 HBcms使用帮助 自定义表单