Good evening,
I started using Codeigniter as Framework for my newest projekt... and already got problems on the first page.
I want to link a CSS file to my site. It looks perfectly good in the Code. But just nothing happens.
<html>
<head>
<title>Tec.Net</title>
<?php
$this->load->helper('html');
echo link_tag($data['css']);
?>
</head>
<body>
<h1><?php echo $title ?></h1>
This is the code of my header.php
body {
background-image: url("application/views/images/Console Background.png");
color: white;
}
The standard.css
<html>
<head>
<title>Tec.Net</title>
<link href="localhost/TecNet/standard.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Home</h1>
<h2>this is a home site</h2> <em>© 2015</em>
</body>
</html>
And at last. The code i receive from Firefox. The Link is perfectly fine. If i try to access it directly from my browser it opens the css file. As inline CSS the code works perfect just that link refuses to work
EDIT:
my URL Structure for the controller.
http://localhost/TecNet/index.php/tecnet/view
And the controller itself
<?php
class Tecnet extends CI_Controller {
public function view($page = 'home')
{
if ( ! file_exists(APPPATH.'/views/pages/'.$page.'.php')) {
// Whoops, we don't have a page for that!
show_404();
}
$data['title'] = ucfirst($page); // Capitalize the first letter
$this->load->view('templates/header', $data);
$this->load->view('pages/'.$page, $data);
$this->load->view('templates/footer', $data);
}
}
?>
Try to load your style sheet like this:
<link rel="stylesheet" href="<?= base_url('TecNet/standard.css') ?>">
since CodeIgniter is based on the Model-View-Controller development pattern. Better you put resoures of css, img, js, etc.. in root folder instead on view like you did:
background-image: url("application/views/images/Console Background.png");
assume structures:
/standard.css
/assets/img/console-background.png
your standart.css file:
body {
background-image: url("assets/img/console-background.png");
color: white;
}
easy to call in view:
<link rel="stylesheet" href="<?= base_url('standard.css') ?>">
I use assests a bit differently in CI, load with controller dynamically, but maybe this can work for you:
<link href="<?php echo base_url(); ?>assets/css/your_style.css" rel="stylesheet" />
just replace path, so they will match to yours
Related
I have created two views ('main' and 'home_view'). Through a controller called 'Home' I load home_view through main view. But the result is not what I had written on the "home_view". Here below are my pages:
home_view:
<h1>Hello, from home_view </h1>
Home Controller contains the following code:
<?php
class Home extends CI_Controller
{
public function index ()
{
$data['main_view']="home_view";
$this->load->view('Layouts/main',$data);
}
}
?>
Main view. I created a folder in View folder called "Layouts" then in that folder I created "main" view. The Main view contains the following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meter charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="<?php echo base_url();?>assets/css/bootstrap.min.css">
<script src="<?php echo base_url();?>assets/js/jquery.js"></script>
<script src="<?php echo base_url();?>assets/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="col-xs-3">
</div>
<div class="col-xs-9">
<?php $this->load->view($main_view); ?>
</div>
</div>
</body>
</html>
the screenshot: https://i.stack.imgur.com/9YGX7.png
altering the statement in the controller I get the results but still, that object is visible:
`$data['main_view']= $this->load->view('home_view');
$this->load->view('Layouts/main',$data);`
the screenshot after altering in the controller code
I was avoiding to suggest you to load the view in advance and pass to the other view first, but since nothing seems to work for you. Do like this in your controller:
<?php
// the "TRUE" argument tells it to return the content, rather than display it immediately
$data['main_view'] = $this->load->view('home_view', NULL, TRUE);
$this->load->view ('Layouts/main', $data);
?>
Then put <?= $main_view ?> in your view at the point you want the menu to appear.
WARNING: When you pass a view this way (with the TRUE parameter ) you are converting all your view content into a string. This works most of the time, but once you have heavy data, or perhaps when you are passing arrays or JSON. it needs to be handled.
The reason I was getting no output but a bar, was typo error. In the heading section of the 'Main'view:
<meter charset="utf-8" >
I should have written this one:
<meta charset="utf-8">
"
It's possible to define a main color and a secondary color (hex-codes) in my application, those are saved to the db.
The secondary color for example is used for links. I don't want to say Text but instead <a href="#" class=secColor>Text</a> where .secColor has something like
.secColor {
color: $fromDatabase;
}
I'm using Laravel btw.
You can include a .php file as a css by using following code:
index.html:
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="style.php">
</head>
<body>
<!-- stuff goes here -->
</body>
</html>
style.php:
<?php
header("Content-type: text/css");
?>
//DB Query
.secColor{
color: <?php echo $fromDatabase;?>
}
You can do this:
Create new route rule:
Route::get('style/generate.css', function ($id) {
// take your color
$data['firstColor']= Colors::where('alias', '=', 'firstColor')->get();
...
return View::make('css.colors', $data)
});
And create new view in resources/views/css/colors:
.firstColor{
color: $colors['firstColor'];
}
And in your main views
I use this method for create js custom file
I'm trying to display some images using the background url in CSS but is not working. I put this code in one of my CSS selector
background:url(../assets/images/teksture2.png);
and view code
<!doctype html>
<html lang="en">
<head>
<meta content-type: "text/css" charset="UTF-8">
<title>Aplikasi Inventori Barang</title>
<link rel="stylesheet" href="<?php echo base_url("assets/css/layout.css");?>">
</head>
<body>
<div id="header">
<div class="image"><img src="<?php echo base_url("assets/images/logo.png");?>" alt="logo"></div>
</div>
</body>
</html>
and in controller file is
<?php
/**
*
*/
class Home extends CI_Controller
{
function __construct()
{
parent::__construct();
}
function index()
{
$this->load->helper('url');
$this->load->view('index');
}
}
?>
can you help me solve this problem?
Hope css and images folders exist inside the asset folder. Then in your css file, you have to use below code.
background:url(../images/teksture2.png);
Ok, let me explain:
I have a some files, something basic like this:
index.php
<html>
<head>
<title>Simple page</title>
</head>
<body>
<?php include 'home.php'; ?>
</body>
</html>
home.php
<div class="thisWillBeBlue">Still not blue</div>
style.css
.thisWillBeBlue {background: blue}
Now the question: Using php I want to insert the style.css inside the head tag, calling it from the file home.php. Well, I came out with a solution, but it was not very effective:
index.php
<?php $css = array();
$css[] = 'linktothecss.css'
?>
<html>
<head>
<title>Simple page</title>
<?php
foreach($css as $item){
echo "<link rel='stylesheet' href='".$item."' />";
}
?>
</head>
<body>
<?php include 'home.php'; ?>
</body>
</html>
But the problem it is, If I call the css from home.php it will be added to the array later, therefore it will not be echoed inside the head tag. Any ideas?
You could do it using ob_start() and ob_end_flush() functions
e.g.
index.php
<?php
$csspage = "default.css";
function loadCSS($buffer) {
global $csspage;
return (str_replace('{{ css }}', $csspage, $buffer));
}
ob_start("loadCSS"); ?>
<html>
<head>
<!-- the string {{ css }} is just a placeholder that will be replaced
with the new value of $csspage defined later in the code, otherwise
it will replaced with its initial value (default.css)
-->
<link href="{{ css }}" />
</head>
<body>
<?php include 'home.php'; ?>
</body>
</html>
<?php ob_end_flush(); ?>
home.php
<?php $csspage = "custom_style.css"; ?>
<div class="thisWillBeBlue">blue</div>
Further reference: http://it1.php.net/ob_start
I think you are looking for something like this ..(include a piece of code in their header files, so that it will allow you to add more stylesheets )
This will allow you to add more stylesheets to it on each page.
(add this to <head>)
<?php
if (!empty($styles) && is_array($styles)) {
foreach ($styles AS $style) {
echo '<link rel="stylesheet" href="/assets/css/'. $style .'">';
}
}
?>
You can put a variable at the top of an individual script if you need a specific stylesheet:
<?php
$styles = array('custom_style.css');
?>
CSS file references can be placed in the body of your code, if needed.
<body>
<link href="linktothecss.css" rel="stylesheet" type="text/css" />
<div class="thisWillBeBlue">
I'll be blue as soon as linktothecss.css finishes loading!
</div>
</body>
The only difference is that when in the HEAD, they are guaranteed to be loaded before the page is rendered. When they are in the BODY, there may be a split-second where they are still loading and the styles haven't been applied yet.
If you definitely want them in the HEAD, you could define the css requirements in a separate folder with the same file name, like so:
index.php:
<html>
<head>
<?php
include('css-requirements/home.php');
?>
</head>
<body>
<?php include('home.php'); ?>
</body>
</html>
and
css-requirements/home.php:
<link href="mycss.css" rel="stylesheet" type="text/css" />
<link href="myothercss.css" rel="stylesheet" type="text/css" />
I am stuck with a very basic problem. Ook the problem is this that I want a master template in which I can call the header, body and footer. I am unable to send title and css in header and also how can I send multiple css files. I am doing something like this:
This is the code in controller
$data['title'] = 'Login To WePOS';
$data['css'] = base_url().'style/login-box.css';
$this->load->view('templates/default',$data);
This is the code in header
<head>
<title><?php echo $title ?> - CodeIgniter 2 Tutorial</title>
<link href=" <?php echo $css;?>" rel="stylesheet" type="text/css" />
</head>
This is the code in template name as default
<html>
<?php
$this->load->view('templates/header', $data);
?>
<body>
<?php
$this->load->view('login/index', $data);
?>
</body>
<?php
$this->load->view('templates/footer', $data);
?>
</html>
hi there is different method to use template in codeigniter .
1- you can use this procedure
In controller
$data['main_content'] = 'login_view';
$data['title'] = 'Login To WePOS';
$data['css'] = 'login-box.css';
$this->load->view('templates/default',$data);
In template.php View
$this->load->view('header_view');
$this->load->view($main_content);
$this->load->view('footer_view');
in your main content variable you can pass the view file
if you want to add multiple css or multiple js files you can use MY_MARK idea as
$data['cssFiles'] = array(
'login-box.css',
'other.css'
);
and in your header file
if(is_array($cssFiles)){
foreach($cssFiles as $cssFile) {
<link href="<?php echo base_url() . 'style/' . $css; ?>" rel="stylesheet" type="text/css" />
}
}
Hope it helps.
You don't have to pass $data again in your default template.
<html>
<?php $this->load->view('templates/header'); ?>
<body>
<?php $this->load->view('login/index'); ?>
</body>
<?php $this->load->view('templates/footer'); ?>
</html>
This should allow you to pick up the $title and $css variables in your header as you have got currently.
With regards to sending multiple css files, create an array of files, like:
$data['cssFiles'] = array(
'login-box.css',
'other.css'
);
And modify the code in your header to be:
foreach($cssFiles as $cssFile) {
<link href="<?php echo base_url() . 'style/' . $css; ?>" rel="stylesheet" type="text/css" />
}
Hope that helps...