Alright so I am using index.php which is located inside my views folder as my main view. I load all other views inside it (as you can see from the code bellow).
Now when I make a route like about/(:any) it wont load any of my CSS or such..
Routes
$route['about'] = 'about'; // works fine
$route['about/(:any)'] = 'about/get_specific_about/$1'; //problematic one
Now this is my index.php
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" type="text/css" href="public/css/partials/header.css" />
<link rel="stylesheet" type="text/css" href="public/css/partials/footer.css" />
<link rel="stylesheet" type="text/css" href="public/css/<?php echo $meta['css']; ?>.css" />
</head>
<body>
<?php $this->load->view("partials/header"); ?>
<?php $this->load->view($meta['page']); ?>
<?php $this->load->view("partials/footer"); ?>
</body>
</html>
Now whenever I use the route with (:any), the code will load the view but it wont be able to find for example footer.css or header.css.. If I used for example ../public/css/header.css then it will...
Code for the About controller
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class About extends CI_Controller {
private $data = [
'meta' => [
'page' => "pages/about",
'css' => "about",
'description' => "test"
],
];
public function index()
{
$this->load->helper('html');
$this->load->view('index', $this->data);
}
public function get_specific_about($user) {
$tmp_data = [];
$tmp_data['meta']['css'] = "profiles/".$user;
$tmp_data['meta']['page'] = "profiles/".$user;
$tmp_data['meta']['description'] = "test";
$tmp_data['meta']['extended'] = true;
$this->load->view('index', $tmp_data);
}
}
Use absolute URL links for href
<head>
<link rel="stylesheet" type="text/css"
href="<?php echo base_url('public/css/partials/header.css'); ?>>" />
<link rel="stylesheet" type="text/css"
href="<?php echo base_url('public/css/partials/footer.css'); ?>" />
<link rel="stylesheet" type="text/css"
href="<?php echo base_url("public/css/{$meta['css']}.css"); ?>" />
</head>
If you're not using .htaccess' to rewrite URLs withoutindex.phpthen substitutesite_urlforbase_url`.
Related
I have a strange problem. Im usining Codeigniter with MaterializeCSS. I want to create navs to create menu. The problem is when I use localhost/page everything works fine, navbars are visible, but When I'll use a site.url, page looks like materalize is not included. I don't know what to do. I can quess there is something with URL in browser
Controller:
class main extends CI_Controller {
public function __construct()
{
parent::__construct();
$this->load->database();
$this->load->view('head');
$this->load->view('index');
}
public function index()
{
$this->load->model('quiz_model');
$data['result'] = $this->quiz_model->get_data();
$this->load->view('content/quiz', $data);
}
public function addquestion()
{
$this->load->view('content/addquestion');
}
}
index.php
<?php
$this->load->helper('html');
$this->load->helper('url');
?>
<nav>
<div class="nav-wrapper">
Logo
<ul id="nav-mobile" class="right hide-on-med-and-down">
<?php echo '<li>web page</li>' ?>
<?php echo '<li>Dodaj pytanie</li>' ?>
</ul>
</div>
</nav>
head.php
<!DOCTYPE html>
<html>
<head>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>
<title>Strona</title>
</head>
<body>
<div class="container">
You need to set the base url you have IP showing in url.
config/config.php
$config['base_url'] = 'http://localhost/yourprojectname/';
You need to change few line :
Controller :
...
public function __construct()
{
parent::__construct();
$this->load->database();
$this->load->helper('url'); // move url helper here, so it could be used on head view
$this->load->view('head');
$this->load->view('index');
}
...
head.php :
<!DOCTYPE html>
<html>
<head>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="<?php echo site_url() ?>css/materialize.min.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="<?php echo site_url() ?>js/materialize.min.js"></script>
<title>Strona</title>
</head>
<body>
<div class="container">
I have created a controller in codeigniter.
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Main extends CI_Controller{
public function login(){
$this->load->view('view_login');
}
}
and Below is my view.
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Voyager</title>
<link href="../../assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="../../assets/css/bootstrap.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<table>
<tr>
<td>
<div class="panel panel-heading">
This is Heading
</div>
<input type="submit" class="btn btn-primary">
</td>
</tr>
</table>
<p class="footer">Page rendered in <strong>{elapsed_time}</strong> seconds. <?php echo (ENVIRONMENT === 'development') ? 'CodeIgniter Version <strong>' . CI_VERSION . '</strong>' : '' ?></p>
<script src="../../assets/js/bootstrap.min.js" type="text/javascript"></script>
<script src="../../assets/js/jquery-3.2.1.min.js" type="text/javascript"></script>
<script src="../../assets/js/bootstrap.js" type="text/javascript"></script>
</body>
</html>
With this Code, Page is rendered but CSS is not applied.
Am I missing something?
Another question which I have is Why do we need helper, I have added code to autoload helper. Why do we need that?
You have to add full path to get CSS styles
CodeIgniter is a MVC structure and file actually call from controller so we can't get actual path so we have to add Full Url of any file so we can not get any type of issue or error.
<link href="<?php echo base_url('assets/css/bootstrap.min.css'); ?>" rel="stylesheet" type="text/css"/>
<link href="<?php echo base_url('assets/css/bootstrap.css'); ?>" rel="stylesheet" type="text/css"/>
And also change your config/config.php file
$config['base_url'] = 'http://localhost/yoursitefolder'; // you can set your working url
Is files really 2 folders up before assets ?
folder1/folder2/assets ???
Go to your config.php and set base_url:
$root=(isset($_SERVER['HTTPS']) ? "https://" : "http://").$_SERVER['HTTP_HOST'];
$root.= str_replace(basename($_SERVER['SCRIPT_NAME']), '', $_SERVER['SCRIPT_NAME']);
$config['base_url'] = $root;
and then in your view:
<link href="<?php echo base_url();?>assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="<?php echo base_url();?>assets/css/bootstrap.css" rel="stylesheet" type="text/css"/>
and same in scripts
<script src="<?php echo base_url();?>assets/js/bootstrap.min.js" type="text/javascript"></script>
This is my directory:
miuse/application
miuse/application/views/templates/header.php
miuse/bootstrap/css
miuse/bootstrap/js
miuse/bootstrap/fonts
This is my controller code:
<?php
class page extends CI_controller{
public function view($page= 'home')
{
if(!file_exists(APPPATH.'views/pages/'.$page.'.php'))
{
show_404();
}
$data['title']='Moodlist home';
$this->load->view('templates/header', $data);
}
}
?>
This is my view code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>
<?php echo $title; ?>
</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link rel="stylesheet" href="http://localhost/miuse/bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="header.css" type="text/css">
</head>
<body>
<header class="container">
<div class="row">
<h1 class="col-sm-4">List</h1>
<nav class="col-sm-8 text-right">
<p>Home</p>
<p>Category</p>
<p>About us</p>
</nav>
</div>
</header>
</body>
</html>
when i run my view normally in a browser it shows proper output but when i load it with codeigniter view then it shows different output which i dont want.
I guess your header.css file is not being loaded.
Put the header.css file in miuse/bootstrap/css directory.
And change your code from,
<link rel="stylesheet" href="header.css" type="text/css">
to
<link rel="stylesheet" href="http://localhost/miuse/bootstrap/header.css" type="text/css">
When loading css and other stuff I would recommend using base_url() in your head area
<head>
<link rel="stylesheet" type="text/css" href="<?php echo base_url('bootstrap/css/bootstrap.css');?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/header.css');?>">
</head>
Make sure you have set the base url in config.php and autoload the url helper.
For each page on the site I have a header and footer, so I decided to create a template for both then just include them on each page.
<?php include_once("header.php")?>
contents of the page...
<?php include_once("footer.php")?>
header.php contains:
<!DOCTYPE html>
<head>
<title>Items Page</title>
<link rel="stylesheet" href="assets/css/item.css">
<script src="assets/css/item.js"></script>
</head>
<body>
<header>
contains a navigation bar
</header>
footer.php contains:
<footer>...</footer>
</body>
</html>
The above codes are for the Items page however I also have Users page they both have the same footer and header markup however different linked CSS and JS files. How can change <link> and <script> inside the <head> tag on the header.php include file if the user navigates to the user page, for example: mysite.com/user/blabla.
The correct link for the Users page should be:
<link rel="stylesheet" href="assets/css/user.css">
<script src="assets/css/user.js"></script>
Use this format in all pages
<?php
$page_title = "title_here";
$cssfiles = array("path/to/css1.css", "path/to/css2.css", ...);
$jsfiles = array("path/to/js1.js", "path/to/js2.js", ...);
?>
<?php include_once("header.php")?>
contents of the page...
<?php include_once("footer.php")?>
And in header.php
<head>
<title><?php echo $page_title;?></title>
<?php
foreach($cssfiles as $css){
?>
<link rel="stylesheet" href="<?php echo $css;?>">
<?php
}
foreach($jsfiles as $js){
?>
<script src="<?php echo $js;?>"></script>
<?php
}
?>
</head>
Try this way
User Type Page
<?php
$pageType = 2; // USER
?>
<?php include_once("header.php")?>
contents of the page...
<?php include_once("footer.php")?>
in other pages
<?php
$pageType = 1; // OTHER
?>
<?php include_once("header.php")?>
contents of the page...
<?php include_once("footer.php")?>
and in header
<!DOCTYPE html>
<head>
<?php if ( $pageType == 1 ) { ?>
<title>Items Page</title>
<link rel="stylesheet" href="assets/css/item.css">
<script src="assets/css/item.js"></script>
<?php } else if ( $pageType == 2 ) { ?>
<title>User Page</title>
<link rel="stylesheet" href="assets/css/user.css">
<script src="assets/css/user.js"></script>
<?php } ?>
</head>
Split up your nav and header include.
header.php
<!DOCTYPE html>
<head>
<title>Items Page</title>
<link rel="stylesheet" href="assets/css/item.css">
<script src="assets/css/item.js"></script>
nav.php
</head>
<body>
<header>
contains a navigation bar
</header>
whatever.php
<?php include_once("header.php")?>
<link rel="stylesheet" href="assets/css/user.css">
<script src="assets/css/user.js"></script>
<?php include_once("nav.php")?>
session_start();
if($_SESSION['user'])
{
?>
<link rel="stylesheet" href="assets/css/item_user.css">
<script src="assets/css/item_user.js"></script>
<?php
}
else
{
?>
<link rel="stylesheet" href="assets/css/item.css">
<script src="assets/css/item.js"></script>
<?php
}
?>
Try to set every page a variable for css and javascript like so:
$css = 'assets/css/user.css';
$javascript = 'assets/css/user.js';
<?php include_once("header.php")?>
contents of the page...
<?php include_once("footer.php")?>
on the header page you need to call those variable:
<!DOCTYPE html>
<head>
<title>Items Page</title>
<link rel="stylesheet" href="<?php echo $css; ?>">
<script src="<?php echo $javascript; ?>"></script>
</head>
<body>
<header>
contains a navigation bar
</header>
You can do like this
header.php
if(!isset($custom_css)) {
echo '<link rel="stylesheet" href="assets/css/item.css">';
}
if(!isset($custom_js)) {
echo '<script src="assets/css/item.js"></script>';
}
And in your users files, give values to $custom_css and $custom_js before including header
user.php
$custom_css = '<link rel="stylesheet" href="assets/css/user.css">';
$custom_js = '<script src="assets/css/item.js"></script>';
<?php include_once("header.php")?>
In Codeigniter I have a view theme-fonts.php that I am loading in another view page.php.
page.php
<?php $this->load->view('theme-fonts'); ?>
<script type="text/javascript">
try{
var fontsArray = <?php json_encode($font_list); ?>;
console.log(fontsArray);
}catch(err){
console.log(err.message);
}
</script>
Following is the definition inside my theme_fonts.php file:
<link href="http://fonts.googleapis.com/css?family=Aclonica" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Michroma" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Paytone+One" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Denk+One" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Wendy+One" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Fjalla+One" rel="stylesheet" />
<?php
$font_list = array();
array_push($font_list,"Aclonica");
array_push($font_list,"Michroma");
array_push($font_list,"Paytone+One");
array_push($font_list,"Denk+One");
array_push($font_list,"Wendy+One");
array_push($font_list,"Fjalla+One");
?>
So my question is how to access php array from view theme-fonts.php in main view page.php?
Regards: Jehanzeb
in MVC frameworks singleton class is available from everywhere, so you need store you variable to some property in your case the best place is config object,
$this->config->set_item('item_name', 'item_value');
read about CI config
You need to pass the array to your view:
<?php $this->load->view('theme-fonts', array('font_list' => $font_list); ?>
I suggest rather declaring the array in your controller and passing it to the main view, that way the array will be available in all the views you load.
Well after I solved the issue, I feel that it was a stupid question. As I am loading theme-fonts view inside page view and not in parallel. I can simply write my script code in theme-fonts view. This will in turn write it to my page view.
page.php
<?php $this->load->view('theme-fonts'); ?>
theme-fonts.php
<link href="http://fonts.googleapis.com/css?family=Aclonica" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Michroma" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Paytone+One" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Denk+One" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Wendy+One" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Fjalla+One" rel="stylesheet" />
<?php
$font_list = array();
array_push($font_list,"Aclonica");
array_push($font_list,"Michroma");
array_push($font_list,"Paytone+One");
array_push($font_list,"Denk+One");
array_push($font_list,"Wendy+One");
array_push($font_list,"Fjalla+One");
?>
<script type="text/javascript">
try{
var fontsArray = <?php print(json_encode($font_list)); ?>;
console.log(fontsArray);
}catch(err){
console.log(err.message);
}
</script>