如何自定义prestashop的布局问题

 我来答
己学好4
2017-01-04 · TA获得超过1.5万个赞
知道大有可为答主
回答量:1.1万
采纳率:91%
帮助的人:5033万
展开全部
prestashop默认是左、中、右3栏的布局形式,这一点让很多初入门的开发者很头痛,不知道如何才 能自定义Prestashop的布局。比如,首页是三栏的布局,但在产品详细页只空出右边栏出来,用来给产品详细信息,这样的话很多时候产品图片可以更 大,更清晰,而且当属性信息比较多的时候,也不会显的那么的拥挤。
比较笨但比较容易想到的做法就是,将header.tpl和footer.tpl中的左右边栏代码段都分别复制到其它页面的头部和尾部,再在这些页面注册左右边栏的模块挂载。这是最容易想到的办法,但也是最笨的办法。那有没有比较简单而有效的办法呢。
当然是有的,对Presashop操作比较熟练的人,特别是对模块的挂载比较熟练的人,应该知道,prestashop模块可以定义例外页面(具体可去这 里查看),比较A模块挂载在左边栏,定义了一个例外页面product.php,这样的话,当浏览其它页面的时候,我们能在左边栏上看到A模块显示,但浏 览product.php页面时,A模块是不显示的。
这就给了我们一个思路,既然模块可以识别浏览的哪个页面,再根据页面来判断是否显示。那么,我们是不是同样可以识别当前浏览的页面,再决定是否显示左、右边栏呢?答案是可以的。
研究代码之后,我们发现在tpl模板文件当中,我们可以使用这样一个变量$page_name,它就是当前浏览的网页名,比如浏览首页 index.php,那么$page_name就是index,如果浏览的是分类页category.php,那么$page_name就是 category,如果浏览的是产品详细页product.php,那么$page_name就是product。
有了这个变量,我们就可以分辨出当前浏览的哪一个页面,需不需要显示边栏区域,比如我们不想在产品页显示右边栏,修改footer.tpl代码如下:
{$HOOK_RIGHT_COLUMN}

修改为
{if $page_name != ’product‘}
{$HOOK_RIGHT_COLUMN}

{/if}
这样,当我们浏览产品页是会发现右边栏没有了,但是右边栏的空间还是占用着,怎么样让中间的区域能够占用空出来的右边栏区域呢。这个时候,需要修改 prestashop的CSS文件了,但普通的修改CSS会对其它的页面也造影响,怎么样才能够不对其它的页面布局产生影响呢?答案仍然是修改刚才的代 码。
{if $page_name != ’product‘}
{$HOOK_RIGHT_COLUMN}

{else}
{/if}
判断当前页面为产品页时,加载特定的CSS文件,这个CSS文件就是专门针对当前这种布局情况而专门写的CSS修改代码。如果不是此页面,该CSS则不会调用,当然也不会对其它页面造成影响了。
网易云信
2023-12-06 广告
UIkit是一套轻量级、模块化且易于使用的开源UI组件库,由YOOtheme团队开发。它提供了丰富的界面元素,包括按钮、表单、表格、对话框、滑块、下拉菜单、选项卡等等,适用于各种类型的网站和应用程序。UIkit还支持响应式设计,可以根据不同... 点击进入详情页
本回答由网易云信提供
无时无刻的相恋
2017-01-04 · TA获得超过2641个赞
知道大有可为答主
回答量:1.7万
采纳率:25%
帮助的人:2698万
展开全部
  1. prestashop默认是左、中、右3栏的布局形式,这一点让很多初入门的开发者很头痛,不知道如何才能自定义Prestashop的布局。

  2. 比如,首页是三栏的布局,但在产品详细页只空出右边栏出来,用来给产品详细信息,这样的话很多时候产品图片可以更大,更清晰,而且当属性信息比较多的时候,也不会显的那么的拥挤。    

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式