Xin chào lại một bài viết trong chuỗi Series Laravel cơ bản đó là hôm nay mình sẽ hướng dẫn bạn cách gọi tập tin CSS, Js và Boostrap vào trong Laravel.

Với PHP thuần khi đặt những file kia ngang hàng với nhau rồi gọi vào là chạy được. Nhưng Framework thì hoàn toàn khác. Các tập tin được đặt ở một khu vực riêng biệt. Và sẽ phải dùng lệnh để gọi vào.

Bước 1: Tại thư mục gốc mình sẽ thêm một thư mục con là assets

goi-css-js-bootstrap-laravel

Tiếp tục trong assets sẽ chứa các thư mục là css, js, bootstrap

goi-css-js-bootstrap-laravel1

Và bên trong những file này bạn tạo ra các file như style.css trong thư mục css, jquery trong js vv…

Bước 2: Vào thư mục C:\xampp\htdocs\thu_muc_laravel\resources\views tạo ra tập tin header.blade.php

Bạn dùng lệnh PHP <?php echo asset('duong_dan_thu_muc');?>

<link rel="stylesheet" href="<?php echo asset('assets/css/style.css')?>" type="text/css">
<link rel="stylesheet" href="<?php echo asset('assets/bootstrap/css/bootstrap.min.css')?>" type="text/css">

Hoặc bạn cũng có thể dùng

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

Hay là

<link rel="stylesheet" href="{{URL::asset('assets/css/style.css')}}">
<script type="text/javascript" src="{{URL::asset('assets/js/jquery.min.js')}}"></script>

Sau đó bạn hãy chạy website trên trình duyệt để xem kết quả.

Sau khi thêm xong bạn hãy viết một đoạn mã CSS hoặc Bootstrap vào file header.blade.php xem đã chạy được chưa. Nếu chưa cần kiểm tra lại đường dẫn thư mục bạn đã đặt đúng chưa.

Cùng chủ đề

Bình luận!

Xin lưu ý rằng tất cả các bình luận đều được kiểm duyệt theo chính sách bảo mật và tất cả các liên kết đều là nofollow. KHÔNG sử dụng từ khóa trong trường tên. Hãy để lại một cuộc trò chuyện cá nhân và ý nghĩa. *