2

As a total newbie in Drupal I asked myself where do I include a css file? (Using Drupal 6)

I wrote a web application with javascript, php and mysql and now I'm trying my first steps in migrating this application to Drupal. I already found out on Stackoverflow How to include css and javascript files.
Since i know now which function to use to include my css file, I don't know where.
Do I have to simply create a new module (named "mymodule" like in the example from stackoverflow)?
Or is the css file only applied to the module "mymodule"? If so, how can I apply it to a page filled with plain HTML?

2
  • Just as a matter of interest, if you're just starting out with Drupal - why Drupal 6? IMHO Drupal 6 is on the verge of not being maintained by many module maintainers, since they've moved on to Drupal 7 themselves. – Free Radical Mar 11 '14 at 11:08
  • because my company uses drupal 6 with lots of modules that are not available for drupal 7. So first we will migrate the web application to drupal 6 and maybe later we will upgrade to drupal 7, but this will be lot of work, since we have to rewrite some modules by ourselves or search for alternatives. – Jbartmann Mar 11 '14 at 11:14
1

As with anything, there's a few different ways to do it.

If you have a custom module (which IMO, you should, since you're porting a custom app), you can add any CSS required for your module in your module's page callback functions. CSS added this way only applies to that particular path. Just FYI if you want to have css apply to the entire site, you should put it in a theme.

So your module would look something like this:

function mymodule_menu() {
  $items['mymodule/blah'] = array(
    'page callback' => 'mymodule_page_blah',
  );
  return $items;
}

function mymodule_page_blah(){
  drupal_add_css(drupal_get_path('module', 'mymodule') . '/file.css', 'module', 'all', TRUE);
  ...
  return "<your blah page's html>";
}
4

To include your custom css say demo_global.css in your theme write following line in theme_name.info file of your theme folder-

      stylesheets[all][] = css/demo_global.css

Note: You must clear the cache to see the changes. For more information please refer https://drupal.org/node/171209

1

This is for a custom module, you put this in your .module file

In Drupal 6:

/**
 * Implements of hook_preprocess_page()
 */
function <YOURMODULE>_preprocess_page(&$variables) {
  $module_path = drupal_get_path('module', '<YOURMODULE>');
  drupal_add_css($module_path . '/css/file.css');
  $variables['styles'] = drupal_get_css();
}

In Drupal 7:

/**
 * Implements hook_preprocess_page().
 */
function <YOURMODULE>_preprocess_page(&$variables) {
   $module_path = drupal_get_path('module', '<YOURMODULE>');
   drupal_add_css($module_path . '/css/file.css');
}
1
  • I searched far and wide for this. My stylesheet did not get added in D6 until I used the line: $variables['styles'] = drupal_get_css(); – Mark Jul 20 '16 at 15:13
0

For creating a custom module please refer to following links:

To include a CSS file for all the pages of site you can do either of the following:

  1. Include it in the theme's info file as: stylesheets[all][] = FILENAME.css
  2. Include it in the module's info file as: stylesheets[all][] = FILENAME.css

Don't forget to clear the cache after adding the CSS file in the .info file.

However if you are including it in the module file than remember than it will get loaded only if the module is enabled.

To load the CSS file for particular node you can do the following in the module file:

/**
 * Implements hook_preprocess_node().
 */
function MODULE_NAME_preprocess_node(&$variables) {
  $node = $variables['node'];

  // Check if the node is the one on which you want to include the CSS file.
  if ((!empty($node)) && ($node->nid === $NODE_ID_ON_WHICH_YOU_WANT_TO_LOAD_CSS)) {
    drupal_add_js(drupal_get_path('module', 'MODULE_NAME') . "/FILENAME.js", "module");
    drupal_add_css(drupal_get_path('module', 'MODULE_NAME') . "/FILENAME.css", "module");
  }
}

Also you may check this link:
Adding style sheets
drupal_add_css

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.