How can I directly edit HTML and CSS?

Category: 

  • Question

I know there is the CSS Injector module, but instead of finding the blocks I want to edit, I want to directly go in and write the code myself or upload .html and .css files somehow. Is that possible on Drupal and if so, how do I do it? If not, can I do it on scripts.mit.edu?

6/18/14

You can by adding 'style="{insert styles here}"' inside your tags, but it's not the cleanest and it only applies for that specific tag. CSS Injector is much easier to use and do. It does the same thing as adding a to your header but can be applied to one or more pages. I'd highly recommend putting most if not all of your styles in a CSS Injector style page. If you do want to add it to the node code itself, switch to Full HTML for the edit and they click on the Source button in the top left of the WYSIWYG edit bar.

6/19/14

I just posted this tip elsewhere, but you might find it handy as well: If you're looking to quickly dig in and override the base theme's CSS yourself, you can copy and paste that code into a CSS Injector rule, and tweak it as needed. That way, you'll know what selectors the base theme is using, and by using CSS Injector, you'll know that your changes will "win" in the cascade.

For example, to override the main menu styles of a default site, grab the main theme CSS. Copy and paste this path after your site's base URL to see the MIT Adaptive theme's main CSS:

/sites/all/themes/mit_adaptive/css/mit_adaptive.css

If you're looking to override the CSS set by a module, or the responsive stylesheets, you can use the same trick. To get to other CSS files, you can grab their paths out of the <head> of your page source.

6/25/14