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.
Related
So I am developing a pretty hefty WordPress website where I am using the 320press Twitter Bootstrap theme and I am utilizing LESS CSS.
Some general info to know:
WordPress 3.5
Bootstrap 2.0
LESS 1.3.3
Everything has been working alright on the WordPress side, the Bootstrap side, etc. But...I had a heck of a time getting LESS to work correctly. I downloaded the less-1.3.3-min.js file from lesscss.org and dropped it in the appropriate folder. I then referenced it in the header.php file. I know all of things are correctly linked up because if you View Source on the page and click the less-1.3.3.js reference it loads perfectly.
Here's what the section of code looks like in my header.php file
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/css/fonts.css">
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/css/custom.css">
<link rel="stylesheet/less" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/less/bootstrap.less">
<link rel="stylesheet/less" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/less/responsive.less">
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/library/js/less-1.3.3-min.js"></script>
So as instructed on the LESS website I loaded the script after I loaded CSS files. Things should start happening correct? No. So I played around a lot and couldn't figure it out.
<-- Readers text when LESS isn't working
I then found the regular "less-1.3.3.js" file on GIT and downloaded it. BOOM everything worked.
<-- this is how it should look (the word "Readers")
Woohoo, victory dance.
Not so fast....
When I shrink my browser down to 979px or under there is a massive gap under the nav.
This gap should be more like this:
Ok, maybe I messed up some CSS...after about 4 hours of investigating I noticed that the Bootstrap.css file that gets compiled is showing twice. Once as a linked stylesheet:
and then again as an embedded stylesheet.
Using the Web Developer Extension in firefox I delete all of the embedded styles and everything looks great. But I can't figure out what's dumping that into the site head other than something that the javascript. Does this happen to everybody?
Any ideas? Of course it's an internal-network only development environment so I can't share a URL with you but I have thrown in a few screenshots to show what I'm talking about.
Help me please! My brain is fried trying to find this issue.
Thanks.
Thanks to Scott Simpson for the direction here. I was looking everywhere but the functions.php file which is my first issue.
I commented out the responsive.css in the funcitons.php file and that fixed it. I knew it was going to be something dumb.
Thank you again.
I'm hosting a (very) small website on dropbox. I don't even have a domain name for it, I just need an easy way for my not so technology savvy teacher to access it and using an online service like wordpress or tumblr seemed like too much trouble and not as effective as I would like. I plan on putting it in my public folder and just sending her that link, something I've done in the past to show my friends websites I've made in class.
However, for some reason, CSS formatting isn't working. This is a problem I've noticed in the past but at the time wasn't important. I have it relatively linked in my head tag and it works when I pull up the files saved on my hard drive. Its only when I try to access it through dropbox do I notice this problem.
I've looked and it doesn't seem like anyone else has had this problem, I've only found multiple references to dropbox supporting CSS so I have no idea why this is happening.
This is the link in my code, and it's inside the head tag:
<link rel="stylesheet" type="text/css" href="css/format.css" />
Any help would be much appreciated. ^^
EDIT: Here's the page, there's not much on it yet but there's suppossed to be background formatting behind the navigation links in the top.
https://dl-web.dropbox.com/get/Public/EPortfolio/WritingAndForum.html?w=947f0aa1
To give an example expanding on Cfreak's comment, you would need to individually share the CSS file, then reference it in the HTML like this:
<link rel="stylesheet" type="text/css" href="https://dl.dropbox.com/u/1234567/cssfile.css">
A much easier way (and more correct) is to put your stylesheet in a folder called css and then have a relative link to it with "./" It gets you out of the long url trouble.
<link rel="stylesheet" type="text/css" href="./css/styles.css">
I have this head
<head>
<title>TITLE</title>
<link rel="stylesheet" type="text/css" href="<?php echo FO_CSS_PATH . 'all.css'; ?>" />
<script type="text/javascript" src="<?php echo FO_JS_PATH . 'jquery-1.8.0.min.js'; ?>"></script>
</head>
FO_CSS_PATH and FO_JS_PATH is correct and fully working on all other browsers.
First of all when I click on a link and open new page, the css is fully loaded (I can see it in developer tools from ie). I don`t think I have any error in my css because if I press F5 (refresh), the page is fully loaded.
So, when I open a page, the css is loading but not working. If I press F5 it is fully working.
PS. I found the same problem on this website: http://forums.asp.net/t/1180199.aspx/1/10, but i'm not working with ASP and there I didn't find a good solution.
First, try with the actual path of the CSS file (no PHP at all) to see if the problem persists. If so, double-check if the problem occurs on another PC with the same version of IE. If the problem is still there, you will have to try another new CSS file that you just created with some random properties just to test.
If it still not work only on some specific versions of IE, I would check for the charset used to create your file (with a great text editor like notepad++). Be sure that the charset used to save the file is the same as the one declared in your php header() or html meta.
It really looks like IE isn't detecting properly the charset of your CSS file or your PHP/html page. When it refreshes, it now detects properly.
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.
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" />