I'm new to magento (using it from only 1 weeks) and I'm trying to use the following instruction from a css file located in


which I think is the good place and practice. I'm using the following instruction for which I have an issue:

.mySlider {        
    background-image: url(<media_base_url>/arlian/slideShow/loading_icon/ajax-loader.gif) !important;        

I have stored my loader img also where I think it is the right place to do so (but I may be wrong):


My issue is how can I reference the correct path to ajax-loader.gif into the css file ? I know I can use Mage::getBaseUrl('media') from a php/phtml file and {{media url='....'}} from CMS/static html but despite all my google search, I didn't find any way to reference the media path in Magento style to be used in a css file.

May someone tell me how to do that or what is the good practice to achieve this if my approch is wrong in the magento world ?

1 Answer 1


As per my knowledge there is no Magento way you can do this.
media folder in Magento is to store media resources like product images, category images, cached images, etc.
If you want to use your image in a CSS file then it is better approach to put them inside your skin_image folder. e.g. skin/frontend/responsive/<storeViewName>/images/<MyDevName>/slideShow/loading_icon folder.
And use this in your CSS file like,

.mySlider {        
    background-image: url(../../../images/<MyDevName>/slideShow/loading_icon/ajax-loader.gif) !important;        

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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