Linking CSS/JS in Laravel's Blade Templates

Question

I noticed earlier that when I added parameters to my routes, this broke my views as it seemed to change the links to my CSS and JS files. After hours of trying to get the HTML package working in Laravel 5.1, I finally gave up and threw in the towel due to Composer issues.

I opted to just take the simple route and go back to linking them directly, however I am now struggling to get even this to work.

<link type="text/css" rel="stylesheet" href="{{ public_path() }}/assets/css/bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="{{ public_path() }}/assets/css/metismenu.min.css">
<link type="text/css" rel="stylesheet" href="{{ public_path() }}/assets/css/sb-admin-2.css">
<link type="text/css" rel="stylesheet" href="{{ public_path() }}/assets/css/font-awesome.min.css">
<link type="text/css" rel="stylesheet" href="{{ public_path() }}/assets/css/datatables.bootstrap.css">
<link type="text/css" rel="stylesheet" href="{{ public_path() }}/assets/css/datatables.responsive.css">

Rather than linking to the local file, its appending the entire string to my base URL and trying to link to that which is obviously wrong.

Current Link:

http://domain.com/home/roster/laravel/public/assets/css/bootstrap.min.css

Correct Link:

http://domain.com/assets/css/bootstrap.min.css

Just linking to "/assets/css/bootstrap.min.css" works fine until I add Route parameters. What can I do to get these links working short of hard coding the entire URL?

Whoever posted the answer, then edited and then deleted it, the edit worked great. If you would like to add it back, I will accept. Thanks! — user470760
– user470760, Commented Oct 22, 2015 at 0:38
Sorry about that, I found a new solution so I deleted it and trying to add a new one :D — kdlcruz
– kdlcruz, Commented Oct 22, 2015 at 0:39

manix · Accepted Answer · 2015-10-22 01:01:07Z

0

Very rare. I am working with L5.1 and looks good together with HTML package. Just to keep in mind. Require the following package:

"illuminate/html": "~5.0@dev"

Then run composer update. After the package is installed, edit config/app.php adding the provider:

 'Illuminate\Html\HtmlServiceProvider',

And facade:

'HTML' => 'Illuminate\Html\HtmlFacade'

Now, lets see some solutions to show your assets links:

Using html facade

{!! HTML::style('assets/css/bootstrap.min.css') !!}

Using raw code calling url() function:

<link type="text/css" rel="stylesheet" href="{{ url('assets/css/bootstrap.min.css') }}">

Using raw code calling URL facade:

<link type="text/css" rel="stylesheet" href="{{ URL::to('assets/css/bootstrap.min.css') }}">

As a note, do not use public_path() because it returns an absolute directory path like /var/www/html/laravel instead an url.

edited Oct 22, 2015 at 1:01

answered Oct 22, 2015 at 0:55

manix

14.7k11 gold badges74 silver badges112 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

kdlcruz · Accepted Answer · 2015-10-22 00:41:10Z

0

Try this one

<link href="<?php echo URL::asset('css/app.css'); ?>" rel="stylesheet" type="text/css">

I believe this will fix your problem

Another solution:

<link type="text/css" rel="stylesheet" href="{{ URL::to('/') }}/assets/css/bootstrap.min.css">

edited Oct 22, 2015 at 0:41

answered Oct 22, 2015 at 0:34

kdlcruz

1,37813 silver badges20 bronze badges

2 Comments

user470760 Over a year ago

As mentioned, I spent hours trying to get the HTML package working without any luck due to composer. It has been removed in Laravel 5.1 and only some community managed package is still available but apparently does not work for me.

kdlcruz Over a year ago

See updates, I think both of these will work for you.

Collectives™ on Stack Overflow

Linking CSS/JS in Laravel's Blade Templates

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related