load css in CodeIgniter? - css

Currently I am using CodeIgniter_2.1.3 and my problem is my css file is not work, but i think it load well because when I view the source code and click the following href link it help me to view the css file.
<link rel="stylesheet" type="text/css"
href="http://localhost/CodeIgniter/_css/style.css"
media="screan" charset="UTF-8" title="no title" />
I keep my css file in CodeIgniter/_css directory and I use the following code ::
<link rel="stylesheet" type="text/css"
href="<?php echo base_url('_css/style.css');?>"
media="screan" charset="UTF-8" title="no title" />
I also use the following but no effect.
<link rel="stylesheet" type="text/css"
href="<?php echo base_url();?>_css/style.css"
media="screan" charset="UTF-8" title="no title" />

Make sure you have loaded URL helper :
$this->load->helper('url');
Inspect using firebug or other web development tools for browsers if valid link has been printed on your link href.
If everything seems fine, then refresh the page. Ctrl + F5 which fetches the file from server again.
URL Helper: Codeigniter Guide

Is that localhost address what you're using? That's only going to work if you're running the browser on your server . . . spelling screen correctly would help as well.

Related

codeigniter view not finding css. Working on test server

Hi I have the following file set up inside public_html
/application
/views
index.php
/assets
/css
styles.css
kube.min.css
/js
js.js
and a few other things in there, some of the js files actually seem to be working, because it's picking up Paypal buttons but the links are no different at the start. Examples below.
<link href='http://fonts.googleapis.com/css?family=Handlee' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://deborahspsychicreadings.com/_/assets/css/kube.min.css" />
<link rel="stylesheet" href="http://deborahspsychicreadings.com/_/assets/css/styles.less.css" rel="stylesheet/less" />
<link rel="stylesheet" href="http://deborahspsychicreadings.com/_/assets/css/start/jquery-ui-1.10.4.custom.min.css" />
<script src="assets/js/jquery-ui-1.10.4.custom.min.js"></script>
<script src="assets/js/js.js"></script>
<script src="assets/js/paypal.js"></script>
On the test site the path is a bit different (for the actual folders) because it's not in the root. The same files as above are also inside a folder called index, but when I try this on the client server it doesn't work at all.
Tried adding ../ or ./ or / to the beginning or http://sitename.com/ after reading other suggestions but nothing seems to be working.
please use site_url() function
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/kube.min.css'); ?>">
You need to use base_url() of codeigniter. Use the following syntax:
<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/css/styles.css">
Please make sure that you configure your base_url in config.php at line 17.

bootstrap asp.net--Not working in Clients

I have developed a asp.net website(.aspx) using the bootstrap and the total look and alignments were good while debugging the code in my local system using IE10.
once the code is deployed in a asp.net server the button styles and the alignments of the controls in html table tags were totally different from the local site .
Please share your ideas for resolving the issue.
I have used the below tags in the master page.
<link href="Content/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="Content/bootstrap.min.css" runat="server" rel="stylesheet" type="text/css" />
<link href="Content/bootstrap-theme.css" runat="server" rel="stylesheet" type="text/css" />.
.
.
.
.
<script src="Scripts/jquery-2.1.1.js" type="text/javascript"></script>
<script src="Scripts/bootstrap.min.js" type="text/javascript"></script>
thanks.
My issue got resolved.
all the resources were linked correctly but the issue was due to the default browser version the pages are getting rendered.
So I needed to add the below the meta tag in the master page. After which all the pages were loading fine.
[link] meta http-equiv="X-UA-Compatible" content="IE=edge" />
Thank you all for the suggestions and help.
You do not need both versions of bootstrap.css - for production server use the minified version(s).
For example:
In your master page:
<webopt:BundleReference runat="server" Path="~/Content/bootstrap.min.css" />
In your Bundle.Config.cs class:
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/css").Include(
"~/Content/bootstrap.min.css"));
}
As regards setting the correct path in master page, this is a known bug and an easy way to get it right is to drag the CSS file from VS Solution Explorer to the head section of your master page in code view.

CSS is missing when rendering an html page with codeigniter

I'm aware this is similar to numerous existing posts but after looking at a number of others I wasn't able to solve my problem. I'm attempting to load a folder full of html files I've been supplied with. I didn't write them but I have been modifying them to integrate them into an existing system.
I've tried three ways of opening them, with varying success:
1) Simply right click on 'index.html' and go 'open with' and select a browser. This works perfectly!
2) Place the whole folder contents, unchanged, onto my server under 'public_html/cat/html' and navigating to the url 'localhost/cat/html/index.html'. This returns a '404 page not found error'.
3) The strange one. Place the html files in the 'application/view' folder, separate the included css and javascript files and place them in existing folders 'public_html/css' and 'public_html/js' and update the links to them in the html files appropriately. These now look something like:
<link type="text/css" href="css/cat/style.css" rel="stylesheet" />
If I load this page by running a function that uses CodeIgniter's $this->load->view(...) function it finds the index file but loads it with no css and with broken links to the other pages. I've explored the page source and seen that the link is exactly as above but clicking gives an error that reads "404 Not Found...The requested URL /css/cat/style.css was not found on this server".
I've attempted to use the base_url() function (and site_url()) like this:
<link type="text/css" href="<? base_url('css/cat/style.css') ?>" rel="stylesheet" />
and it yields the same result on the surface but examining the page source reveals the link line has become:
<link type="text/css" href="" rel="stylesheet" />
which seems to be even worse!
Any hints?
Thanks for reading
Try the following:
<link type="text/css" href="<?php echo base_url('css/cat/style.css') ?>" rel="stylesheet" />
base_url() functon simply return value, you should take a care for displaying returned value to output! :-)
Have you correctly configure you config file in codeIgniter ?
Or shorthand
<link type="text/css" href="<?=base_url('css/cat/style.css') ?>" rel="stylesheet" />
Then view your page source and copy the link from there to your browser, see if you can access it.
Can try this code <link type="text/css" href="<?=base_url('css/cat/style.css');?>" rel="stylesheet" />
if it doesn't work, you could try <link type="text/css" href="<?=base_url('css/cat');?>/style.css" rel="stylesheet" />

Less.js not parsing .less files

I have tried everything and this makes absolutely no sense! I previously had Less.js working just fine on my site, then I decided to use WP_Less because of some of its added features but then ran into issues when implementing BuddyPress. VERY long story (and day) short I am trying to get back to the basics and I can't seem to get Less.js to just work. I've turned off all plugins and removed all the code except what is in the header so there should be no outside conflicts
the header.php has this code:
<link rel="stylesheet" type="text/css" media="all" href="<?php get_bloginfo( 'stylesheet_directory' );?>/style.css" /> <!-- WP Theme Style -->
<link rel="stylesheet" type="text/css" media="all" href="<?php get_bloginfo( 'stylesheet_directory' );?>/style.css" /> <!-- Theme Less Styles -->
<link rel="stylesheet/less" type="text/css" href="<?php get_bloginfo( 'stylesheet_directory' );?>/css/less/style.less" /> <!-- Style.JS -->
This results in only the the less.js and the default style.css loading no style.less:
If I modify the style.less call to this:
<link rel="stylesheet" type="text/less" href="<?php get_bloginfo( 'stylesheet_directory' );?>/css/less/style.less" />
then they all load but the style.less does not get parsed:
Nothing I have tried down to its simplest form based on their documentation has worked and I simply don't understand why, I've set this up on other sites with no issues before.
If anyone can help you thank you SO MUCH, this is time sensitive and very urgent right now.
In my case, LESS was silently failing due to parsing errors.
In order to debug less.js, open javascript console in your browser (i.e. F12) and type:
less.env = "development";
less.refresh();
I've filed a report to less.js project, so they could fix this.

ASP.NET CSS file in master page

In my application I have next problem. I created master page and some content pages, some of which are located in the nested folders. In the master page I added the link to .css file
<link href="default.css" rel="stylesheet" type="text/css" />
But pages are located in the nested folders can't use this .css file. How can I fix this? I want to have one .css file for all pages (:
Thanks!
<link href="~/default.css" rel="stylesheet" type="text/css" />
This problem can be resolved by adding next code in master page
<style type="text/css" runat="server">
#import '<%= ResolveUrl("~/default.css")%>';
</style>
But designer of VS can't process this and you couldn't view your styles in it.
The css shouldnt be relative to the master page but rather it should be relative to the location of the Page instance using the master page. In most cases this will be the same thing but I would always try to use either a fully qualified path or a site relative path
Fully qualified path
<link href="http://some.site.com/mysite/styles/default.css" rel="stylesheet" type="text/css" />
or a relative path (note this might not work if you have a version which can only host one site but many apps such as WinXP)
<link href="/default.css" rel="stylesheet" type="text/css" />
Win xp relative path
<link href="/path/to/application/default.css" rel="stylesheet" type="text/css" />
If you using website under website, change in subfolder masterpage CSS link
<link href="Styles/Site.css" rel="stylesheet" type="text/css" />
change with below
<link href="../Styles/Site.css" rel="stylesheet" type="text/css" />
The way you defined you style sheet means: the style sheet is in the same folder as the page which uses it.
If you want to have one style sheet for all pages you should put in in one place (I prefer /assets/css folder in the application root) and define the path using this folder:
<link href="/assets/css/default.css" rel="stylesheet" type="text/css" />
The other way to archieve this is to use Themes, in this case styles will be added automatically.

Resources