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
skin/frontend/responsive/<storeViewName>/css/<MyDevName>/slideShow/mySlideShow.css
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):
media/arlian/slideShow/loading_icon/ajax-loader.gif
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 ?
Best Answer
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,