I want to add a css file to my template. I created the template.php into the folder : kohana-v3.3.5\application\views. Into this folder, I created an other folder called "css" and inside it, there is my styles.css with some code.
For now, my template file is :
<html>
<head>
<link href="/css/bootstrap-3.3.6-dist/css/bootstrap.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<div class="row">
<div class="col-md-12 banner">
Persyst
</div>
</div>
<?php echo $content; ?>
</body>
</html>
I don't understand why the links for my css files aren't working.
I saw something with HTML:style() but it doesn't work either.
Thanks for your help !
Using HTML::style() is a good idea. The reason why it fails is because you put the assets folder inside the template folder. The latter is outside of web access (or should be) and is only used internally.
Kohana routes everything through the index.php file, so this is the level your stylesheets, scripts and images belong.
<html>
<head>
<?php
print HTML::style('vendor/bootstrap-3.3.6-dist/css/bootstrap.css') ."\n"
. HTML::style('assets/css/styles.css');
?>
With a directory structure like
application
modules
system
assets
css
js
vendor
bootstrap
Related
In my project that is developed in laravel, i am trying to use a style.css file using blade engine. but it's not working for me anybody have better idea let me know.
Here is my code sample
<link href="{{ asset('/css/style.css')}}" rel="stylesheet" type="text/css">
it's tag is not working but when i'm us following it's working.
<link href="{{ asset('public/css/style.css')}}" rel="stylesheet" type="text/css">
now i want to now best practices of adding css files and how to include other files. like i've file header.blade.php it hold all css file link now i want to include header.blade.php in home.blade.php file both file in view directory.
Placed your css file inside laravel_project/public/css folder and use the link it into your view like:
<link href="{{asset('css/style.css')}}" rel="stylesheet" type="text/css"/>
I think this will help you Thanks.
I think your style.css is stored in public/css directory thats why it allow second you have provided.
And now your header.blade.php holds all your css files so you have to follow laravel's structure in layout if u have app.blade.php or any layout then its perfect otherwise you have to make it own
Sample app.blade.php (stored at views/layout/)
<!DOCTYPE html>
<html>
#include('layouts.partials.header') // path to your header.blade.php
#yield('content')
#include('layouts.partials.footer') // path to your footer.blade.php
</html>
Now this is your layout and you can use your layout and your header as well as footer in your view file like i am creating one blog_list.blade.php which is stored at views directory
blog_list.blade.php
#extends('layouts.app') // we are extending app.blade.php
#section('content')
// here whatever your content
#endsection
You can find more details on laravel's official site laravel-5.4
I hope it helps you. thank you.
I had to call my resources/includes/header-test.php from a subfolder called subfolder/mypage.php. That was solved with the following code, but gave me a new problem.
<?php include __DIR__.'/../resources/includes/header-test.php'; ?>
The folder structure can be seen here:
The problem is now that the css is not called when I go to mypage.php. So how can I call my css, so it is working in the php files there is in the root directory, and in the subfolders?
testProject/index.php -> css is working
testProject/subfolder/mypage.php -> css is not working
header-test.php
<html>
<head>
<link href="css/style.css" rel="stylesheet" />
</head>
<h1>THIS IS THE HEADER FROM INCLUDE</h1>
index.php
<?php include 'resources/includes/header-test.php' ?>
<body>
<h2 class="font">THIS IS THE INDEX BODY</h2>
<p>The css works on this page when I link to the css like this in the header:</p>
<p>link href="css/style.css" rel="stylesheet" </p>
MyPage subfolder link
</body>
</html>
mypage.php
<?php include __DIR__.'/../resources/includes/header-test.php'; ?>
<body>
<h2 class="font">THIS IS THE BODY OF SUBFOLDER/MYPAGE.PHP</h2>
<p>The css does not work when I link like this in the header</p>
<p>link href="css/style.css" rel="stylesheet"</p>
</body>
</html>
style.css
.font {
color: red;
}
This is a problem with the css/style.css path being relative the the file. You should prefix it with / to tell the page to load the asset from the 'root' of the web directory. In short it should be /css/style.css and that will work for both pages.
You should note that the root of the web directory, is different from the file server root. If you're developing locally and have a file such as index.html that lives in /path/to/your/website/ and you view it in your browser with /path/to/your/website/index.html, it will break the path to the asset.
I recently asked a question about my php includes and received the answer. Now that the include accesses the correct file, my html/css/javascript web pages show some hope. The only issue is that the php includes of the pages have this look:
Instead of this:
Is there a way for the php includes to access the css files? My current code for one page that contains the includes is:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css" type="text/css" />
<script type="text/javascript" src="main.js"></script>
<title> Water Polo, The Best Sport</title>
</head>
<body>
<div class="wrapper">
<?php
include'../includes/header.php';
?>
<?php
include'../includes/navbar.php';
?>
<div class= "content">
</div>
<?php
include'../includes/footer.php';
?>
</div>
</body>
</html>
Header.php
<?php echo'<div class ="header">
<h1>The Best Sport</h1>
<h1 class="sitetitle">AllWaterPolo</h1>
<img src ="img/51wmckj8p1l__sx300__1.png" class="wpball" alt="Water Polo Ball" />
<h2 class="homeScreenLink"> Water Polo!</h2></div>';>
To develop the website I am currently using MAMP and running the code which is in a folder by putting it in htdocs.
I took the header out of the php include and made the css file work with the document, but one thing remains the same. The code that I included in the document via php does not take on the effects of the css document, but the header, which now is out of the include and is written write in the document works. Is there a way to allow the code which has been included via php to access the working css file? If it would facilitate the answering process, I'll post any necessary pictures. Just comment below.
You have correctly identified the problem, that the HTML cannot find the CSS. That is directly because of this tag:
<link rel="stylesheet" href="styles.css" type="text/css" />
Specifically, this part of the tag:
href="styles.css"
You have told your code to look for the styles.css file in the same directory as the index.php file. Is that correct?
Usually, the web site structure looks like this:
public_html
- css
- js
- includes
- img
Your website seems to be structured like this:
includes
public_html
Imagine yourself inside the index.php file. All files that are INCLUDEd become part of index.php, as if they were there originally. So, you are expecting to find the CSS file here (as per your <link rel="stylesheet" tag):
public_html/style.css
If they are really inside a CSS folder, then perhaps this will fix it:
<link rel="stylesheet" href="css/styles.css" type="text/css" />
Update:
No need to echo out your HTML in PHP, you can literally just do this:
header.php
<div class ="header">
<h1>The Best Sport</h1>
<h1 class="sitetitle">AllWaterPolo</h1>
<img src ="img/51wmckj8p1l__sx300__1.png" class="wpball" alt="Water Polo Ball" />
<h2 class="homeScreenLink"> Water Polo!</h2>
</div>
If the other include files are similar, then it appears your rendered file will all be HTML. Therefore, the next step is: where is your style sheet? Try this. In the address bar of your browser, type:
localhost/styles.css
And see if your stylesheet appears. If not, try this:
localhost/css/styles.css
If the second one works, then change this:
<link rel="stylesheet" href="styles.css" type="text/css" />
to this:
<link rel="stylesheet" href="css/styles.css" type="text/css" />
Note: I might not have your path structure correct. Amend as required.
Short answer = no.
You may want to look into using SASS. Besides minifying the css files, you can also set it up so the main (in your case styles.css) pull from several SASS files. For example you could have the following SASS files: main.scss, header.scss, navbar.scss, & footer.scss. If your IDE supports SASS, when you save any one of these files it can automatically compile all four into your styles.css file. Then all you need is to reference that one file and you are set.
http://thesassway.com/beginner/how-to-structure-a-sass-project
I have a function in my admin controller called "login" which uses the 'login.php' view in application/views/admin/. I have the 'header.php' and 'footer.php' views included at the top and bottom of this file as shown below:
<?php include ('/application/views/layout/header.php'); ?>
The header and footer are included correctly in all my other views, but when included in the 'login.php' view, the asset files are not found. Here is my 'header.php' view:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="./application/assets/bootstrap/css/bootstrap.min.css" >
<link rel="stylesheet" type="text/css" href="./application/assets/style.css" >
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="./application/assets/bootstrap/js/bootstrap.min.js" ></script>
<title><?php echo $page_title; ?></title>
</head>
<body>
<div class="container-fluid text-center">
<div class="row">
<div class="span12">
<img src="./application/assets/signature.jpg" class="img-responsive center-block" style="margin-top: 20px;">
</div>
</div>
</div>
Here is the file structure of my application:
application
-+assets
---+css
------style.css
-+controllers
----admin.php
----page.php
-+views
---+layout
------header.php
------footer.php
---+admin
------home.php
------login.php
----home.php
I have used firebug to try and solve the problem, and the console is giving me a 404 error. It is adding the controller name 'Admin' into the filepath of the css file for some reason as seen below, as well as my .js files and the image:
/my_project/admin/application/assets
Any ideas as to why this could be? I have used mod_rewrite on the project in my .htaccess file.
For including header and footer I think better way this answer:
adding header and footer codeigniter to controller
...
And for to refer to CSS and JS file use CodeIgniter URL helper. You must load the helper And use this helper:
https://ellislab.com/codeigniter/user-guide/helpers/url_helper.html.
Config base_url() in config.php file. Then link to your CSS and JS like this answer:
Code Igniter simple base url css
If you use Codeigniter framework I recomend to use a standart function loading view instead include() function.
For example, Codeigniter support function View() to load your HTML code at web page.
Call function like as:
$this->load->view(template);
At your case you need to put next code at your controller file login.php, where you want load header template. Look like as:
$this->load->view("layout/header.php");
Also, dont use incude(); The better write: include_once();
If you will work furthe with inheritance classes you have problems.
Read more about here: enter link description here
I intent to create a template PHP file, this template will only serve the design, not the content. The purpose is to decrease the development time in a sense that when creating a new PHP file or new module, I can only need to concentrate on the main function of that PHP file not the design. Once I created the new file using the template, it should be able to display the consistent design and serve its specific function.
The issue is that I am not sure on how to make the design of the template works and applied to all of the new files created regardless of the location (as long as it is within the root directory).
As an example:
root directory (www.example.com): /
homepage (www.example.com/index.php): /index.php
css file: /style/style.css
template file: /template.php
newly created file (www.example.com/subone/find/css/file.php): /subone/find/css/file.php
another newly created file (www.example.com/subtwo/locate/css.php): /subtwo/locate/css.php
Content of the homepage (which is created base on the template.php, but the CSS file location is hard coded):
<html>
<head>
<title>Testing</title>
<link rel="stylesheet" type="text/css" href="style/style.css" />
</head>
<body>
<div id="header">logo and login form goes here
<div class="nav"> navigation goes here;</div>
</div>
<div id="main">main content goes here;</div>
<div id="footer">footer goes here; </div>
</body>
</html>
but, when I created a new file, /subone/find/css/file.php
the location of the css must be changed and specified manually, like this:
<html>
<head>
<title>Testing</title>
<link rel="stylesheet" type="text/css" href="../../../style/style.css" />
</head>
<body>
<div id="header">logo and login form goes here
<div class="nav"> navigation goes here</div>
</div>
<div id="main">main content goes here;</div>
<div id="footer">footer goes here;</div>
</body>
</html>
So, what I want to achieve is that, when creating a new file (/subone/find/css/file.php), I don't need to do anything, I can straight away concentrate on the main section:
<html>
<head>
<title>Testing</title>
...style.css is handled automatically
</head>
<body>
<div id="header">logo and login form goes here
<div class="nav"> navigation goes here</div>
</div>
<div id="main">main content goes here;
<?php
//I can continue to edit the file from this line onward
echo "I am concentrating on the main function of file.php right now!!";
?>
</div>
<div id="footer">footer goes here;</div>
</body>
</html>
example page can be seen at (only the desired design): neoborn.kodingen.com
I accept any answers as long as it can achieve my intention (template).
Thank you :)
Why don't you use absolute paths when referring to CSS files and other resources in your template file?
For example:
<link rel="stylesheet" type="text/css" href="/style/style.css" />
There are 2 options,
Use absolute paths for your css files <link rel=stylesheet href="/style/style.css">
Use HTML's <base> element to cause all relative paths on the page relate to it.
I would use a easy to install template engine. That will help speed up development and still give you the freedom to do whatever PHP you like.
Try http://www.raintpl.com/ that should be quick and easy for you to install and get back to coding the pages. If you include it in your PHP inc folder, it will be available for every PHP file you create. So you won't need to add an include line at the top of each PHP file.
Index.php
<?php define('BASE_URL', 'http://localhost'); ?>
Template.php
<link rel="stylsheet" type="text/css" href="<?php echo BASE_URL; ?>/style/style.css ?>" />