Laravel 5 css,js and image files are not loading - php

I am trying to load css, js and images files kept inside my public/css/assests folder. Link which i have been giving is
<link rel="stylesheet" href="/public/css/assets/js/jquery-ui/css/no-theme/jquery-ui-1.10.3.custom.min.css">
But when i open my page in browser it gives error that is
GET http://localhost:8000/public/css/assets/js/jquery-ui/css/no-theme/jquery-ui-1.10.3.custom.min.css net::ERR_ABORTED
Please tell me what to do to resolve the error.

you can use asset() to load css and js and images from public folders.asset will point to public folder
<link rel="stylesheet" href="{{asset('css/assets/js/jquery-ui/css/no-theme/jquery-ui-1.10.3.custom.min.css')}}">
asset()
asset() will generate a URL for an asset using the current scheme of the request (HTTP or HTTPS):

please use asset() function
<link rel="stylesheet" href="<?php echo asset('css/assets/js/jquery-ui/css/no-theme/jquery-ui-1.10.3.custom.min.css'); ?>">
asset() gives full url of your root directory

/ points to public folder by default, so remove /public
<link rel="stylesheet" href="/css/assets/js/jquery-ui/css/no-theme/jquery-ui-1.10.3.custom.min.css">

Related

I cannot link my css and and image to my html

I tried to link a css to html in laravel and link an image (both css and image are in public folder) but it does not work. I tried using asset and url but it does not work either. I don't understand what is wrong. This is how I wrote the link:
<link rel="stylesheet" href="/css/styles.css">
<img src="/img/logo-kitsune-dojo.jpg" alt="logo kitsune dojo">
I have already tried asset and url. They don't work. I want mi css and my imagen to link.
use asset() function generates a URL
<link rel="stylesheet" type="text/css" href="{{ asset('css/styles.css') }}">
<img src="{{ asset('img/logo-kitsune-dojo.jpg') }}" alt="logo kitsune dojo">
In Laravel, you can use asset() helper function to link assets like CSS and images:
<link rel="stylesheet" href="{{ asset('css/styles.css') }}">
<img src="{{ asset('img/logo-kitsune-dojo.jpg') }}" alt="logo kitsune dojo">
Make sure that the assets path is correct and that the files are in the public directory of the project.
You may solve this problem by using asset() helper function
For css link: If your css exist in public folder folowing this directory you may use this
For Image: If your image exist in public folder folowing this directory you may use this
**To link a CSS page in Laravel, you can follow these steps:
1Create a CSS file in the public folder of your Laravel project. For example, you can create a file named style.css in the public/css folder.
2In your HTML file, add a link to the CSS file in the head section. You can use the asset function provided by Laravel to generate the URL to your CSS file.**
<head>
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
</head>
**3.Make sure that the URL generated by the asset function is correct. The URL should start with the base URL of your Laravel application, which is usually the root directory of your project.
That's it! Your CSS file should now be linked to your HTML file, and the styles defined in your CSS file should be applied to your HTML content.**
**To add an image to a web page in Laravel, you can follow these steps:
1 Place the image file in the public folder of your Laravel project. For example, you can create a folder named images in the public folder and place your image file in it.
2 In your HTML file, use the img tag to display the image. You can use the asset function provided by Laravel to generate the URL to your image file.**
<img src="{{ asset('images/image_name.jpg') }}" alt="Image description">
**4 Replace image_name.jpg with the name of your image file.
5 Make sure that the URL generated by the asset function is correct. The URL should start with the base URL of your Laravel application, which is usually the root directory of your project.
That's it! Your image should now be displayed on your web page.**

CSS not loading with codeigniter

IM trying to load some css directly within my view file, but its not working.
in my view file I have this.
<link href="<?php echo base_url(); ?>assets/css/core.css" rel="stylesheet" type="text/css" />
The assets folder is at the same level as Application
when I view source on the webpage it shows me this
demo.example.com/assets/css/core.css
but when i click the link to see if it's working the url becomes this...
http://demo.example.com/admin/demo.example.com/assets/css/core.css
not sure what I am doing wrong? Should I be adding something to my htaccess file?
Thanks in advance.
You don't need to include the base_url() in your path because the webserver already knows your at www.example.com/admin and auto includes that.
Just use
<link href="/assets/css/core.css" rel="stylesheet" type="text/css" />
Edit: Or actually you need to include the http: prefix on your base_url like wolfgang1983 said.
See this answer on CSS absolute and relative link paths. https://stackoverflow.com/a/17621358/3585500

How use absolute link in href header

I work on my website but I have a problem with the links in the href.
My CSS and javascript files are in this folder (in the root of my site):
assets/stylesheets/file_css.css
For now the links of my href looks like this:
<link rel="stylesheet" href="./assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="./assets/fonts/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="./assets/stylesheets/custom.css">
<link rel="stylesheet" href="./assets/stylesheets/media-queries.css">
I call it in all my php files with :
require_once __DIR__.'/layouts/header.php'
Problem:
When I want to create a folder to sort my files eg views (folder found at the root of my site)
Looks like views/test.php
All href don't work, console error :
test.php:10 GET http://localhost/mywebsite/views/assets/bootstrap/css/bootstrap.min.css
test.php:11 GET http://localhost/mywebsite/views/assets/fonts/font-awesome/css/font-awesome.min.css
test.php:12 GET http://localhost/mywebsite/views/assets/stylesheets/custom.css
In fact, my CSS aren't in views folder.
I tried many things
1 - <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css">
error => test.php:10 GET http://localhost/assets/bootstrap/css/bootstrap.min.css
2 - <link rel="stylesheet" href="<?php echo __DIR__ ?>/assets/bootstrap/css/bootstrap.min.css">
error => test.php:10 Not allowed to load local resource: file:///C:/wamp/www/mywebsite/layouts/assets/bootstrap/css/bootstrap.min.css
I thought to put href="/mywebsite/assets/bootstrap/css/bootstrap.min.css" in the first link, it works locally but not on the server
I really need help, I start having too much PHP file at the root
Thank you

Twitter Bootstrap Path Breaks When Not on Homepage

I am currently testing my website on the local server. I have issues with twitter bootstrap's path in my header view.
On my homepage this path works fine:
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
When I move to sub-page via link:
<a href="index.php/home_controller/getFilmDetails?id...
Which translates to:
http://localhost/www.mywebsite.co.uk/index.php/home_controller/getFilmDetails?id=114
Controller code:
$this->load->view('/header/header_home');
$this->load->view('movies_details_view',$data);
$this->load->view('footer_home');
Path to twitter bootstrap does not work, and I need to change the path to:
<link href="/bootstrap/css/bootstrap.css" rel="stylesheet">
How do I make the path work on all pages?
In your Controller do this:
$this->load->helper('url');
$this->load->view('/header/header_home');
$this->load->view('movies_details_view',$data);
$this->load->view('footer_home');
Inside you header view do this:
<link href="<?php echo base_url('/bootstrap/css/bootstrap.css') ?>" rel="stylesheet">

Loading CSS, JS in CodeIgniter

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

Categories