I am trying to learn Codeigniter. I have built a simple MVC following the tutorials on the CI site. This is my controller...
<?php
class Pages extends CI_Controller {
public function view($page = 'home'){
if(!file_exists(APPPATH.'/views/pages/'.$page.'.php')){
show_404();
}
$data['title'] = ucfirst($page);
$this->load->view('templates/header', $data);
$this->load->view('pages/'.$page, $data);
$this->load->view('templates/footer', $data);
}
}
Here is the header template...
<html>
<head>
<title><?php echo $title ?> - WurkWithUs</title>
<link rel="stylesheet" href="http://localhost/ci/CodeIgniter_2.1.2/css/bootstrap.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="http://localhost/ci/CodeIgniter_2.1.2/css/custom.css" type="text/css" media="screen"/>
</head>
<body>
<h1>Wurk With Us</h1>
The style sheets work when I use an absolute path like the one above. However if I try to use something like...
<link rel="stylesheet" href="<?= base_url()?>css/bootstrap.css" type="text/css" media="screen"/>
I get a blank page. When I "view page source" my style line looks like...
<link rel="stylesheet" href="
I have tried to follow the suggestions here and I get the same results i.e. document stops being parsed at the "href=" line.
What am I doing wrong? Is there a better way to load my stylesheets?
I've had this issue many, many times. I'd bet money you're not loading in the URL helper. It does not autoload, so either load it in your controller or autoload it.
If you choose to lead it in your controller, call
$this->load->helper('url');
before you load the view.
The reason you see the href blank in the source is because there was a PHP error at that point (it could not find the method base_url())
Try this:
<?php base_url("css/bootstrap.css"); ?>
Thanks
Try this in your controller
$this->load->helper('html');
and this in the head tag
<?=link_tag('css/style.css')?>
I think you need to load the "url" helper.
Load your helper in autoload.php
Like that way :: $autoload['helper'] = array('url');
This will auto load your helper every time. So, you need not to load it again and again in every controller.
or
If You want to load this helper for specific controller, then load the helper in your controller call
Like that way :: $this->load->helper('url');
Related
I have used css w/ codeigniter plenty of times in the past but I am just not able to configure it on a new server setup. I have looked at almost all the answers on Stack overflow but none of them seem to be working for me. I have created a very basic set of files for testing -
Controller (codeigniter/application/controllers/Pages.php)
<?php
class Pages extends CI_Controller{
public function testthis(){
$this->load->helper('url');
$this->load->view('testcss2');
}
}
?>
View (codeigniter/application/views/testcss2.php)
<html>
<head>
<title>CSS styled page</title>
<link rel="stylesheet" type="text/css" href="<?php echo base_url();?
>testcss.css">
</head>
<body>
<!-- Main content -->
<h1>Testing CSS styled page for codeigniter</h1>
<p>Welcome to my styled page!
<p>CSS Styled page
<address>7th July 2017
</address>
</body>
</html>
Config.php
$config['base_url'] = 'http://localhost/';
autoload.php
$autoload['helper'] = array('url');
The testcss.css file was placed in the root html folder on Ubuntu but I ended up copying it in almost every directory out of frustration of it not getting picked up.
The result -
The page gets displayed successfully but without any styling. If I copy the contents of the css file and paste it in the view file inline using the style tag, the css works ! But not while using external css.
Why is using css with codeigniter so frustrating !!!
For example your project name is "ProjectName",
Add folder assets and place css file inside of it.
Here in config change base_url
$config['base_url'] = 'http://localhost/ProjectName/';
After that in view use this way
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/testcss.css');?>">
I hope it will work for you.
If feel any issue please let me know. Thank you
Controllers/pages.php
<?php
class Pages extends CI_Controller{
function __construct() {
parent::__construct();
$this->load->helper('url');
}
public function index() {
$this->load->view('testcss');
}
}
?>
views/testcss.php
<html>
<head>
<title>Load css and javascript file in codeigniter</title>
<!--Load style.css file, which store in css folder.-->
<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/style.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'>
</head>
</html>
Sometimes, you need to give permissions to use css and js from root. Putting them into folder gives you way to manage and include all from same path.
I am currently trying to load a css file into a CodeIgniter view in the follow manner:
<link rel="stylesheet" href="<?php echo base_url(); ?>css/style.css">
A blank page is loaded. It seems that when I call the base_url function in the view the page doesn't load because the same thing happens when I call base_url() else where in the view but the page actually loads without css when I remove the calls to that function. Is there something that I need to require in order for the page to load?
From: http://ellislab.com/codeigniter/user-guide/helpers/url_helper.html
This helper is loaded using the following code:
$this->load->helper('url');
The following functions are available:
...
You need to first load the helper either in the method called, or in the class constructor.
Try import annotation.
<style> #import url('<echo base_url()?>/css/styles.css'); </style>
You could do like this:
<link href="<?php echo base_url('assets/css/bootstrap.min.css') ?>" rel="stylesheet">
I Just downloaded CodeIgniter 2.1.3 and Trying to import css into via header_controller,
I have tried SOF: CodeIgniter - Loading CSS, CI_Help_page and codeigniter CSS problem (SitePoint Form Thread). I'm currunlty utterly confuse and Can't find the simple Answer. Does any one out there has a one step answer on how to Import CSS and JS on CodeIgniter version 2.1.3.
I have : register.php
<?php
class register extends CI_Controller {
public function index()
{
//Get header
$this->load->view('header');
//Any other class
$this->load->view('register');
}
}
than header.php
<?php
?>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<link rel="stylesheet" href="<?php echo base_url();?>css/bootstrap.css" type="text/css" media="screen"/>
<title>DMP</title>
</head>
<body>
Here is my project folders: Project folders.png (incase you want to guid me on where can I place CSS)
Thanks.
Only guessing, but in order to be able to use base_url() you need to load the url helper in your controller. Also, as #hakre already said in the comments turn on your error reporting.
class register extends CI_Controller {
public function index()
{
$this->load->helper('url');
//Get header
$this->load->view('header');
//Any other class
$this->load->view('register');
}
}
This should work
<link rel="stylesheet" href="<?php echo base_url('css/bootstrap.css')?>" type="text/css" media="screen"/>
Add this on your view page:
<link rel="stylesheet" href="<?php echo base_url();?>css/bootstrap.css" type="text/css" media="screen"/>
I am kinda newbie to CodeIgniter. Somehow I set up the development environment and ready to go. But loading the CSS, JS into page seems a lot more confusing. Before moving, I googled a lot but the base_url solution is not helping.
Part of View :
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href="css/jquery-ui-1.8.21.custom.css" rel="stylesheet">
<link href='css/fullcalendar.css' rel='stylesheet'>
<link href='css/fullcalendar.print.css' rel='stylesheet' media='print'>
<link href='css/opa-icons.css' rel='stylesheet'>
<link href='css/uploadify.css' rel='stylesheet'>
Controller :
public function dashboard()
{
$this->load->helper('url');
$this->load->view('templates/css_styles');
$this->load->view('templates/top_bar');
$this->load->view('templates/left_menu');
$this->load->view('pages/dashboard');
$this->load->view('templates/footer');
$this->load->view('templates/js_end');
}
public function index()
{
$this->load->helper(array('form'));
$this->load->view('login');
}
route.php :
$route['default_controller'] = "welcome/dashboard";
$route['404_override'] = '';
$route['dashboard'] = 'welcome/dashboard';
If I put the dashboard method as default controller, the page is loading fine. But when I change it to just welcome, which is a login form and redirect to welcome/dashboard, the page doesn't load any CSS. Just all HTML texts. The dashboard page is just pure HTML, no PHP code written yet.
Please help me what might causing this.
What's wrong with base_url()?
<link href="<?php echo base_url('css/bootstrap-responsive.css')?>" rel="stylesheet">
make sure you load URL helper, I recommend autoloading it: go to application/config/autoload.php and add it to the helper array:
$autoload['helper'] = array('url');
You can use the link_tag() in html_helper.php to help get the paths correct.
First load the helper (I usually have it autoloaded)
$this->load->helper('html');
Then you can reference css like this:
echo link_tag('css/bootstrap-responsive.css');
The advantages are the function tries to build the correct absolute URL to the css file and it automatically sets the rel attribute to stylesheet and the type attribute to text/css.
Also you should have Chrome, Safari, or Firebug for Firefox so that you can inspect the code and see if the CSS files are being loaded or if they are not found. This will help with debugging.
Make sure you have a leading slash before your css folders:
<link href="/css/bootstrap-responsive.css" rel="stylesheet">
And make sure that the files are indeed located in /css off your web root, not inside the application folder.
first you need load helper url
$this->load->helper('url');
and then on controller
$this->data =site_url()."your css file";
then on your view
<link rel="stylesheet" type="text/css" href="<?php echo $css; ?>">
its simple.you can view full article load css/js
Here is a part of my CI code:
class page extends CI_Controller {
var $Page;
public function __construct() {
parent::__construct();
$this->Page = 1;
$this->load->model('posts_model');
$this->load->helper('url');
}
public function index() {
$data['posts'] = $this->posts_model->get_posts($this->Page);
$this->load->view('header');
$this->load->view('main', $data);
$this->load->view('footer');
}
function page_num($page) {
$this->Page = $page;
$data['posts'] = $this->posts_model->get_posts($this->Page);
echo $this->Page;
$this->load->view('header');
$this->load->view('main', $data);
$this->load->view('footer');
}
}
And this is link tag of my View File:
<link rel="stylesheet" type="text/css" href="css/indexpage.css" media="all"/>
When I open the index file (/My-Site/), CSS works fine, but when I open for
example the url :
" /My-Site/page/page_num/3 ",
the page opens but with no CSS styles!
Can any body help me please?
use base_url() function to get the url of the site
base_url() gives the url of the website where the index file is located.
eg: /My-Site/
or you can give the file location as the parameter: base_url('/css/indexpage.css') then use it as <link rel="stylesheet" type="text/css" href="<?php echo base_url('/css/indexpage.css');?>" media="all"/>
Try it.
you can use base_url() in your css. see below code.
<link rel="stylesheet" href="<?php echo base_url(); ?>css/style.css" type="text/css" media="all" />
1 -
change it to :
<link rel="stylesheet" type="text/css" href="<?php echo base_url('css/indexpage.css');?>" media="all"/>
and you sould already know this , in
application/config/config.php
set
$config['base_url'] = 'www.yorsite.com';
2 -
you have to include the css only in one of your views
i.e
if you have include it in the header.php file
do not add it to the main.php or footer.php
It is usually a good practice to use
<base href="<?php echo base_url(); ?>" />
in your head section of the view page.
That way you don't have to worry about adding base_url to all your href and src attributes.
So if your css file is in codeigniter/assets/css folder, just use
<link type="text/css" rel="stylesheet" href="assets/css/style.css" />
Similarly for subsequent scripts and css you can just use "assets/js/filename" or "assets/css/filename".
Change URL here:
<link rel="stylesheet" type="text/css" href="css/indexpage.css" media="all"/>
to:
<link rel="stylesheet" type="text/css" href="/css/indexpage.css" media="all"/>
Slash at the beginning will point to domain without any sub categories.
When working with codeigniter remember that the only page that outputs HTML is the index.php file so your css should be relative to this file or you use absolute url. You can create a folder anywhere some developers create an asset folder at the webroot here they place their javascript folder image folder and css folder. But the safest way to go is to use absolute links for your assets-Javascript, css, and images.
The easiest way to use absolute link is to use base_url("assets/css/indexpage.css");
This is how to use it:
Load url helper in any of your controllers. $this->load->helper('url);
In your view the area where you want to do the linking use the base url function.
It depends on where you have placed the css file. Try ../css/indexpage.css