I've crawled forums far and wide for a solution for this, but to no avail.
I'm running an app on a localhost and I want to link to my CSS styles in my html page.
The general consensus is that I should use base_url() . "css/main.css" to create a link.
The PROBLEM lies in the fact that I want other people on my network to be able to use my app. But when they link to my page from their computer, they see
link rel="stylesheet" type="text/css" href="http://localhost/codeigniter/css/main.css
which of course does not load the CSS to the page, as the css files are on my localhost, not theirs.
Please tell me there's an elegant solution to this problem. Codeigniter is driving me kind of nuts.
modify the $config["base_url"] value to the IP address assigned to your computer. Like:
$config["base_url"] = "http://192.168.1.5/codeigniter/";
What you need here is to setup base url as per ENVIRONMENT
switch(ENVIRONMENT) {
case 'localhost':
$config['base_url'] = 'http://localhost/codeigniter/whatever/';
break;
case 'anothercomputer':
$config['base_url'] = 'http://anotherdomain.com/';
break;
default: //live
$config['base_url'] = 'http://yourdomain.com/';
}
obviously you'll need to setup ENVIRONMENT const to all these values by checking e.g. $_SERVER['SERVER_NAME'] etc in the index.php
There is 3 Ways of adding css style to your document most common way is external,
use this code to get style from external file.css:
<link rel="stylesheet" type="text/css" href="your_css_file_location.css" />
the css file should be at .css format,
another way is by using internal, the style tag goes between the tags ,
<style type="text/css"> your style here </style>
and last the inline,
<body style="background-color: #FF0000;">
hope you got this, have a nice day.
Related
Hey I am working on a Client's website that is built using Social engine , there is one weired issue I am facing.
Let me explain :
The website was working fine at original url let say www.abc.com , but as soon as I changed the url and tried to access the website from IP address associated with it, it was still working but just the home page and all other pages aren't loading some CSS/JS files .
I tried to move everything to my local server , but that couldnt help either and same issue was there at local server.
please see the image http://prntscr.com/860xmq
I am trying to fix it from last week but no luck please advice me how I can fix this issue.
Thanks
What is the problem
From the Screenshot it is clear that few of the .css and .js are not found i.e., it is not pointing to exact path.
How to fix it
Make sure that you are pointing it to correct location.
Note :
Make sure that you have used the correct path i.e.,
For CSS :
<link rel="stylesheet" type="text/css" href="css/yourcssfile.css">
and not something like
<link rel="stylesheet" type="text/css" href="localhost/yourprojectfolder/css/yourcssfile.css">
if you use PHP, then you can add this :
<?php
$base_url = "http://".$_SERVER['HTTP_HOST'].preg_replace('#/+$#','',dirname($_SERVER['SCRIPT_NAME'])=="\\"?"":dirname($_SERVER['SCRIPT_NAME']))."/";
?>
<link rel="stylesheet" type="text/css" href="<?php echo base_url; ?>css/yourcssfile.css">
so when you change your server name/domain it will adjust automatically.
I have a website hosted by siteground, and my custom 404 page is SOMETIMES missing it's stylesheet. I contacted support but they saw it working fine, assumed I just codded it wrong, and told me to get help form a professional web programmer... (of course I did test before contacting them to be sure it was not my fault)
Anyways, the way that siteground allowes you to create a custom 404 page is to add your html code to a form in your control panel, wich creates a 404.shtml in your main folder. The .shtml contains all your html. I have done the following test to narrow down the problem.
created a not404.html in my main folder with code copy pasted from my 404.shtml that is in the same folder. It loaded with my stylesheet applied no problem.
tried prompting a 404 page with both bad hyperlinks, and by typing pages that do not exist. When I am having the problem with my stylesheet missing, none of thease pages have css, but when I am not having the problem, they all have css applied.
What I think it is: I think that the 404.shtml is not really in my main folder, but just appears to be there, and sometimes that link breaks and the 404.shtml is actualy acessed somewere else on sitegrounds server, therefor the style link would not work properly. This would explain the intermittent css failor. But this is just logic, not understanding.
The only thing I can think of that would be wrong on my end is if there is more than one way to link stylesheets, and my way is a bit unstable. Here is the format I use.
<link type='text/css' rel='stylesheet' href='css/404.css'>
I know this might be a difficult question, but it would be pretty satisfying to figure this out and inform them of the problem with their site.
Change the href for the style tag to be absolute. So this:
<link type='text/css' rel='stylesheet' href='css/404.css'>
Becomes this:
<link type='text/css' rel='stylesheet' href='/path/to/css/404.css'>
css/404.css is a relative path. If the path is something like /path/to/nonextant/page it will try to load the stylesheet from /path/to/nonextant/page/css which does not exist.
Use an absolute path:
/css/404.css
can someone explain what is the difference in accessing CSS in browser by putting question mark ? in the end and why the new CSS is not making any affects on Website.
I have deployed a new CSS on web server but its not making any affect.
I tried to open the URL in browser as below:
www.mysite.com/styles/css/main.css
and it loads the older version of CSS.
Then I tried it as below and it loads the new version of CSS.
www.mysite.com/styles/css/main.css?
After doing all this. New CSS change does not affecting the website. Its still displaying the old design.
Kind Regards
You need to add something after the ? then change it when you change the CSS. What is happening is a browser will cache anything that doesn't change for a specific period, it does that by checking file names. so main.css? is still main.css? Anything after the question mark is a query string, generally it's used to pass data to a particular file. In this case it's just used to change the file string so the browser will update it every time it changes without affecting the file itself.
There are a couple of ways you can handle this, the first is manually changing the version, probably the easiest idea if you have a single header file, as in a template system that always loads the same head data.
<link rel="stylesheet" type="text/css" href="assets/css/main.css?ver1/>
Then on next change:
<link rel="stylesheet" type="text/css" href="assets/css/main.css?ver2/>
If you'd rather do it automatically you can add a bit of PHP script to the css line like this:
<link rel="stylesheet" type="text/css" href="assets/css/main.css?time=<?php echo filemtime('./assets/css/main.css');?>" />
This is essentially adding a value that changes every time you save the file and results in something like this, the next time I save the file that time= value will change:
<link rel="stylesheet" type="text/css" href="http://localhost/refficient/trunk/assets/css/main.css?time=1350305706" />
browser cache is the reason,Adding ? after css is not recommended.Open your hosting space and clear cache and thread pool as well.
i'm using MAMP on my MacBook Pro as a local server. PHP and MySql are running fine. However, i have a strange issue with CakePHP - CSS only works on homepage of my site and only by the two following paths:
'localhost' and 'localhost/index.php'
Using 'localhost/index.php/' however returns just the bare unstyled markup as does all other pages in the site. How can a slash a the end break the CSS?
A few searches have suggested this could possibly be a mod rewrite issue in apache, but i'm out of my depth to be honest - i don't know how to test if changes i make turn mod rewrite on.
As CSS works only for 2 specific paths, could it perhaps be a problems with my routes? I only have 2 defined - '/' and '/index.php/' - and they are both the same.
Any help will be greatly appreciated,
James
It looks like your MAMP configuration (or Apache within MAMP has mod_rewrite disabled. It looks like you have to follow http://documentation.mamp.info/en/mamp-pro/advanced-functions/edit-configuration-files instructions, edit template for apache's httpd.conf, search for mod_rewrite and uncomment this line in config template.
The problem is most likely as tbwcf says that you're trying to load the CSS files using relative file paths, but you should always use CakePHP's helpers to add resource files to the layout:
<?php echo $this->Html->css('style'); ?>
The above will output
<link rel="stylesheet" type="text/css" href="/css/style.css" />
The benefit is that if you install the app to some other directory the path changes automatically:
<link rel="stylesheet" type="text/css" href="/other/directory/css/style.css" />
Do not use relative file paths like ../css. It will break the layout again in all but the simplest cases.
The slash at the end of the markup is most likely breaking the file path to your stylesheet. For example if your css is referenced as
<link rel="stylesheet" href="css/stylesheet.css" />
then adding the slash to the page URL would mean you'd need to jump back a step to get to the same stylesheet as it would no longer be in the same folder as the page you're on.
So you could add
../ before the reference like <link rel="stylesheet" href="../css/stylesheet.css" />
Or possibly an easier solution in this case would be to reference your stylesheet absolutely like:
<link rel="stylesheet" href="http://localhost:8888/project/css/stylesheet.css" />
I got "dump" isp that always cached internet pages and its css for at least 1 day.
Although the css / js in the server changed, the presented css are not changed (i have been clear my cache everytime)
how to "tell" my isp not to cache some files like css and js ?
thank you !!
at the moment: i'm using proxy to check a under developed web so that it don't get cached ..
The way Stack Overflow itself solves this problem is to add a version parameter to the CSS and JS URLs, which refer to the version of the referenced files:
<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=4542">
Every time the referenced files change, the href attribute of the link tag is updated in the HTML code, thus supporting caching and updated referenced files.
You could try to append some random string to every request of an external file like:
<link href="/css/style.css?cachekiller=1337" media="screen" rel="stylesheet" type="text/css" />
where the 1337 in the above code should be generated randomly for every request e.g.
<?php time() ?>
or something
You can include these documents directly in your HTML files, between <script> or <style> tags. It will obviously make all your HTML files bigger, but that's basically what you're asking.
It's the only way you can be 100% sure that your CSS and JS is not cached at all.