0

I am updating magento rwd theme and style sheet and its style is bulild on saas. What is best way to edit the theme so that it remain remain responsive and my new addition also build on responsive design.

Should i edit in css files of in saas files? I only need to update style.css file i think.

Magento version: 1.9.2.1

0

follow this link. in this it will show you how to edit the rwd. i hope this will help you..

Step 1 – Create your Directory Structure

  1. Once you have Sass and Compass installed you will need to find the responsive theme code, which are located in the following directories:

    • app/design/frontend/rwd
    • skin/frontend/rwd

Notice that ‘rwd’ is a whole package that has inside a theme called ‘default’.

2 Now, you must create the directories for your new custom package which will be based on the rwd package: - app/design/frontend/yourpackagename/yourthemename - skin/frontend/yourpackagename/yourthemename 3 Create an ‘etc’ directory in the location below

  • app/design/frontend/yourpackagename/yourthemename/etc

4 Create a theme.xml file in the location below

  • app/design/frontend/yourpackagename/yourthemename/etc/theme.xml
    1. Add the following code to the theme.xml file to configure the theme fallback

Magento C.E:

  • rwd/default

Step 2 – Copying the files

1 You must copy all the images files from:

  • skin/frontend/rwd/default/images

To:

  • skin/frontend/yourpackagename/yourthemename/images

2 You can copy all the scss files from:

  • skin/frontend/rwd/default/scss

To:

  • skin/frontend/yourpackagename/yourthemename/scss

Although this approach will result in having duplicates of files that you will never want to edit. So after you copy all of the files, you can delete the following folders:

skin/frontend/custompackage/customtheme/scss/core/
skin/frontend/custompackage/customtheme/scss/function/
skin/frontend/custompackage/customtheme/scss/layout/
skin/frontend/custompackage/customtheme/scss/mixin/
skin/frontend/custompackage/customtheme/scss/module/
skin/frontend/custompackage/customtheme/scss/override/
skin/frontend/custompackage/customtheme/scss/vendor/

After you delete these folders from you theme, they will fallback on the RWD default theme, See the fallback structure.

  1. Make sure you copy the file config.rb which is required by compass in the location below:

    skin/frontend/yourpackagename/yourthemename/scss/config.rb

Put the following code inside config.rb, make sure you change “yourpackagename” and “yourthemename” for your own directory names.

Community Edition:

# note: this should never truly be referenced since we are using relative assets
http_path = "/skin/frontend/yourpackagename/yourthemename/"
css_dir = "../css"
sass_dir = "../scss"
images_dir = "../images"
javascripts_dir = "../js"
relative_assets = true

add_import_path "../../../rwd/default/scss"

output_style = :expanded
environment = :development
  1. You have to copy only the files that you would want to override from:

    app/design/frontend/rwd/default/template
    

    To:

    app/design/frontend/yourpackagename/yourthemename/template
    
  2. The best practice for changing magento layouts is using a local.xml file.

    app/design/frontend/yourpackagename/yourthemename/layout/local.xml

Step 3 – Configure Magento Admin

Now in the Magento Admin Panel go to

System > Configuration > GENERAL > Design


In Package, in the Current Package Field put yourpackagename
In Themes, in the Default field put yourthemename
And click Save Config button at the top.

You may have to flush the cache from System > Configuration > Cache Management if prompted.

  • i copy app\design\frontend\rwd to app\design\frontend\customtheme and skin\frontend\rwd to skin\frontend\customtheme Its not best one as duplicay is there and i will move my custome theme inside RWD but for now its working ok. Whats you view – Jai Sep 23 '15 at 8:13
  • If it working ok don't move inside rwd theme pckg – Qaisar Satti Sep 23 '15 at 8:49
  • Yes its working good and I am updating inside my custom theme. – Jai Sep 23 '15 at 10:39
  • If i edit any saas file ie _product_list.scss then and save it. Did it saas complier execute after saving or do i have to do anything more? – Jai Sep 23 '15 at 14:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.