EE2.x Module development reference images in css and views

Question

I'm building a a module and I am having trouble trying to load images for my css styles and views..

is there a way to do this?

file stucture: third_party:

• module
  • javascript
  • css
  • views

I have tried '../images/file.png' but no go as obviously the path is incorrect on page render.

Answer 1

You'll need to use the themes folder to use assets like images. So use a file structure like this:

/system/expressionengine/system/third_party/my_addon/[your-addon-files]
/system/expressionengine/system/third_party/my_addon/views/[your-addon-view-files]
/themes/third_party/my_addon/css/[css-files]
/themes/third_party/my_addon/images/[your-images]
/themes/third_party/my_addon/javascript/[your-js]

Then you can use ../images/my-image.png in your css files.

Use ee()->cp->add_to_head() to add the CSS to the CP's head-element.

Use ee()->cp->add_to_foot() to add any JS to the footer of the CP.

See also:

• http://ellislab.com/expressionengine/user-guide/development/usage/cp.html (for CP stuff)
• http://ellislab.com/expressionengine/user-guide/development/constants.html (for getting the paths to the themes folder)