as you all know, ASP.NET includes each CSS stylesheet in the App_Themes's Theme folder inside the page. No discussion.
But now, I'm facing a little problem having lots of CSS files in a theme and willing to use a static content domain. I would like to load all the static content of my website from the static domain (not only CSS, but also icons, images, etc.), but let's now pay attention only to CSS.
My question is
Is it possible to override the behaviour of Page class, and for each CSS file found in Theme's folder, rewrite the <link> tag with the correct URL of the static content domain? I have nothing preventing me to deploy files into http://static.domain.com/App_Themes/Theme path, so at least adding a prefix to the tag is fine.
Thank you in advance.
Yes, you can. You can have a custom base page class write the CSS files it finds in the folder. Though, I'm not sure you can override the default behavior of the themes feature, so the easiest way is to move the CSS files outside of the default themes. Then, you can use the System.IO objects to read the directory, access the file, and generate the link.
HTH.
An alternate method is to write an http module. Have the module inspect the html being sent back to the client.
If it detects a style sheet reference, change the location that the style sheet is pulling from.
This works for the other items as well, such as images etc.
Related
Newbie question as stated above. How do I access the public folder of laravel in .css file? I have a custom css and I want to get the url of the image.
You can not use the asset() or public_path() functions there, they will not get called from a css file but you can use the traditional way to access file like this
../css/want_to_import.css
This is the only way you can access a file in a css file, unless you're writting your css dynamically then possibilities are different.
If your domain points to your public folder, you can reference it using /
Let's imagine you want to display a JPG file as a background image.
public/image/background.jpg
In your CSS, you can use background-image:url('/images/background.jpg')
I'm trying to refactor a nodeJs project and my css is in my .ejs file. I need to put some dynamic data in my css file. I need to have dynamic data in my css, when my css is in my EJS file it's good.
But when I put my css into an external file, nothing happens!
So, how can I inject ejs tag in my external stylesheet file?
This is one of the questions to which one has to ask you - why do you want to do that? You are asking about a solution to a problem that you didn't describe.
By suspicion is that you are trying to use a templating system for something that could be done with a CSS preprocessor like Sass or Less. Particularly Less can be easily used on both the client side and server side. See http://lesscss.org/#client-side-usage
Now, if you really want to use a templating system created for HTML to generate CSS then you will have to take few things into account: You need to store your CSS templates somewhere where your HTML templates are stored, not where you store your static assets like images. Then, your server will have to serve your generated CSS with a correct MIME type. Then, your HTML will have to reference the styles using a URL to your generated CSS that will be generated on every request instead of being served directly from disk.
The way it works now, Meteor automatically finds CSS files in the client directory and renders it without having to call it in the HTML's header tag.
However, how would I be able (if it's even remotely possible) to associate one particular CSS file or files to just one HTML page?
I recently purchased a theme for one section of my website that I didn't want to bother creating myself, since I hate doing UI for my main page myself. But when I place the CSS files of this template with the ones I have for the other template I use, one template's CSS files overwrite the other, so everything ends up looking like a huge jumbled mess.
I hope I'm being clear with my question. Is there a way to get around this?
So, if there's not a way to keep the file from being included in meteor, you could add a class to the body tag of the page you want the styles to appear in, then prepend that class to the beginning of the styles in your new stylesheet, ex: .yourBodyClass#stylehseetID, .yourBodyClass.stylesheetClass
if you put your stylesheet in the public folder, it will be treated as a static file, but then it should go in the header which is rendered by Meteor, and since Meteor is a single page app (SPA), it only has one header for the whole application.
If you need specific styles for a page, you can use some prefix for your css classes. That's probably the easiest.
Can't style my menu css,i tried to change in master-ccda(my site www.blobus.on.kg)It helps for 5 minutes than changed back.Please help me to find place where i can change it.
You use a rocketheme/gantry template. Your website has compression/caching enabled for the css. This is enabled either by the template settings or another compression/caching system plugin. Therefore what you get as a final css file, is a dynamically generated compressed css file. Any edits you are doing on this file are getting lost, as soon as the system will generate a new final master.css file.
You need to disable these functions while you are building your website. Doing so will stop the compression of all the css files into one and you will see what rules and from which files your menu and other elements/sections of your website inherit their styles.
In addition keep in mind that it is best to avoid making changes on the core files of your template/extensions.
Gantry templates allow you to create a custom css file where you can put your own css overrides.
The custom css file need to be place inside the css folder of your template and usually needs to have a name of this convention: rt_templatename-custom.css.
I'm running into a bit of a problem with my search plugin CSS. It doesn't apply some of the CSS rules I placed on /plugin/searchable/webroot/css/searchable_style. I think it is being overridden by the cakephp default CSS which I used with my application. Should I edit the generic css for my application or there's a way to bypass the generic CSS then apply what's on /plugin/searchable/webroot/css/searchable_style? I also tried
css('/searchable/css/searchable_style'); ?>
and put it on every view and it worked but not all.
Thank you,
Lyman
Place your css file *searchable_style* to webroot/css folder: then use it in app/views/layouts/default.ctp (if you have) OR include this line to your home or landing layout
echo $this->Html->css('/searchable/css/searchable_style');
This will definitely work. but if you rename the plugins folder to plugin as your question, then it will cause problem. Please check all folder naming and retry.