Magento eshop 1.7.0.2的响应式设计方法

时间:2013-09-30 08:23:51

标签: html css magento responsive-design media-queries

嗨开发人员和设计师

我第一次 - 自定义主题滑块,标签和其他设计元素改变 magento的默认css( styles.css

您如何建议接近已经制作的magento eshop,以便将其转变为响应式电子商店?

这可能吗?或者我将不得不从头开始改变整个CSS?

2 个答案:

答案 0 :(得分:1)

我一直在研究基于默认布局的自定义CSS,开始时你应该看看“CSS媒体查询”。也许你可以看http://getbootstrap.com来了解它是如何工作的,但这是一个广泛的例子。当您了解媒体查询的工作方式时,您应该能够更改当前布局的部分内容以进行响应。

答案 1 :(得分:1)

Magento有一个主题层次结构,因此可以“扩展”一个主题。

Magento有一个后备策略,以防它找不到特定的模板或js / css文件。它将首先查看

app/design/frontend/custom_package/custom_theme/
skin/frontend/custom_package/custom_theme

如果没有找到,那么它会查看:

app/design/frontend/custom_package/default
skin/frontend/custom_package/default 

最后,它将搜索:

app/design/frontend/base/default
skin/frontend/base/default

这意味着,如果现有主题位于app/design/frontend/existing_custom_package/default,您可以在 existing_custom_package 中创建新文件夹,例如app/design/frontend/existing_custom_package/responsive_theme然后只放置您需要覆盖的文件。当然,您需要在Admin -> System ->Configuration中将活动主题从默认更改为 responsive_theme

或者,如果您需要保持现有的CSS不变,请创建自己的响应相关文件,您只需将它们添加到现有主题中即可。只需将所需文件添加到path-to-custom-theme/layout/page.xml

相关问题