2

I have created a subtheme of "omega kickstart theme" and I want to add some custom css files to it. I searched and got some solution(which didn't worked for me), the solution is as follows:

  1. create your custom css file and place it in css folder of your subtheme.

  2. edit your subtheme.info file(edit under optional css code of info file) as follows:

    css[yourthemename.css][name] = 'Your custom products styles'
    css[yourthemename.css][description] = 'This file holds all the product page CSS of your theme.'
    css[yourthemename.css][options][weight] = '12'
    

The other Solutions were as follows:

  1. Specify your custom css path file in info file as

    stylesheets[all][] = mycustomcss.css
    
  2. Make use of "drupal_add_css" function in template.php as follows

    function MYTHEMENAME_preprocess_node(&$variables) {
      if ($variables['view_mode'] == 'full') {
        $path = drupal_get_path('theme', 'MYTHEMENAME');
        drupal_add_css($path . 'MY-THEME-PATH');//PUT UR CSS FILE PATH
      }
    }
    

I tried this function twice with two different paths. First I gave path as '/css/mycustomcss.css' and second time I gave path as '/MYTHEMENAME/css/mycustom.css'.

UNFORTUNATELY NONE of these solutions worked for me. Am I missing something or is it something else?...please help.

  • Guys I got the answer. I was missing one line in code. here is what you have to do. in your .info file under optional css code write the following code. css[yourcustomcss.css][name] = Your custom products styles css[yourcustomcss.css][description] = This file holds all the product page CSS of your theme. css[yourcustomcss.css][options][weight] = 12 settings[alpha_css][yourcustomcss.css] = 'yourcustomcss.css' Now go and enable your 'yourcustomcss.css' in Appearance/yourthemename/settings/toggle-styles – maaz siddiqui Dec 3 '13 at 8:45
  • @JayendraKainthola Last time I checked newcomers must wait 8 hours before answering their own questions. See here. So your comment will not be applicable for 4 hours more. – Mołot Dec 3 '13 at 13:06
0

I was missing one line in code. here is what you have to do. in your .info file under optional css code write the following code.

css[yourcustomcss.css][name] = Your custom products styles 
css[yourcustomcss.css][description] = This file holds all the product page CSS of your theme. 
css[yourcustomcss.css][options][weight] = 12 
settings[alpha_css][yourcustomcss.css] = 'yourcustomcss.css' 

Now go and enable your 'yourcustomcss.css' in Appearance/yourthemename/settings/toggle-styles

0

To create a subtheme, follow all 10 steps mention in this article.

To add your own custom CSS files, add them in ./MYTHEMENAME/MYTHEMENAME.info if you need minimal configuration.

Otherwise, add your own MYTHEMENAME_preprocess_HOOK functions to ./MYTHEMENAME/template.php in your subtheme folder.

After you add your changes, add the following lines of code in ./MYTHEMENAME/template.php at the very bottom :

drupal_flush_all_caches();
drupal_theme_rebuild();

This should flush the cash and add your changes. Then, comment out these two lines and refresh your browsers. Your changes should now be included.

The easiest way to test whether your MYTHEMENAME_preprocess_HOOK function is actually being used, is to add nothing but one of the following options to that function (and remove it when it generates output) :

echo 'MYTHEMENAME_preprocess_HOOK used'; // native PHP
var_dump('MYTHEMENAME_preprocess_HOOK used'); // native PHP
debug('MYTHEMENAME_preprocess_HOOK used'); // Drupal specific

If you don't want to clutter ./MYTHEMENAME/template.php, you can also put your hooks in seperate files in the preprocess folder as described in the readme file.

TEMPLATE_preprocess_html() --> ./MYTHEMENAME/preprocess/preprocess-html.inc
TEMPLATE_preprocess_page() --> ./MYTHEMENAME/preprocess/preprocess-page.inc
TEMPLATE_preprocess_node() --> ./MYTHEMENAME/preprocess/preprocess-node.inc

Unfortunately, the documentation forgets to mention what would be suitable values for TEMPLATE. As you can see in the code in the process folder of inherited themes, TEMPLATE should be identical to MYTHEMENAME_alpha. It took me hours to figure that out.

For example, your page hook would be something like this if it was put in the file ./MYTHEMENAME/preprocess/preprocess-page.inc :

function MYTHEMENAME_alpha_process_page(&$vars) {
  //debug($vars);
}

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.