การใช้งาน Theme Bootstrap Backend[Laravel4][Laravel][Ubuntu]
การทดสอบนี้ เป็นการใช้ theme ของ Edmin ซึ่งสามารถทำการดาวน์โหลดได้ ที่นี่
เมื่อทำการดาวน์โหลดมาแล้วจะได้ไฟล์ edmin.zip
ก๊อบไฟล์ edmin.zip ที่ได้นำไปไว้ที่ /var/www/laravel/public/
เปปิดโปรแกรม Terminal
ใช้คำสั่งเพื่อไปที่เก็บไฟล์
cd /var/www/laravel/public
unzip edmin.zip
mv bootstrap/* .
rm -rf bootstrap/
จากนั้นทำการสร้าง folder ใหม่ขึ้นมา เก็บไว้ใน /var/www/laravel/app/views/
ชื่อ theme
ก๊อบไฟล์ ที่อยู่ใน /var/www/laravel/public/code/ ซึ่งประกอบด้วย .html ไปใส่ไว้ใน Theme
(มีทั้งหมด 12 ไฟล์)
ทำการเปลี่ยนนามสกุลไฟล์ทั้งหมด จาก .html เป็น blade.php
ทำการแก้ไขไฟล์ routes.php ซึ่งอยู่ใน /var/www/laravel/app/ โดยเพิ่มคำสั่งข้างล่างนี้
Route::get('/activity', function()
{
return View::make('Theme.activity');
});
Route::get('/charts', function()
{
return View::make('Theme.charts');
});
Route::get('/form', function()
{
return View::make('Theme.form');
});
Route::get('/index', function()
{
return View::make('Theme.index');
});
Route::get('/message', function()
{
return View::make('Theme.message');
});
Route::get('/other-login', function()
{
return View::make('Theme.other-login');
});
Route::get('/other-user-listing', function()
{
return View::make('Theme.other-user-listing');
});
Route::get('/other-user-profile', function()
{
return View::make('Theme.other-user-profile');
});
Route::get('/table', function()
{
return View::make('Theme.table');
});
Route::get('/task', function()
{
return View::make('Theme.task');
});
Route::get('/ui-button-icon', function()
{
return View::make('Theme.ui-button-icon');
});
Route::get('/ui-typography', function()
{
return View::make('Theme.ui-typography');
});
จากนั้นทำการแก้ไขไฟล์ ที่อยู่ใน folder Theme ทั้งหมด
แก้ไข
ส่วนของ Head ให้เป็นดัง Code ข้างล่าง
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Edmin</title>
<link type="text/css" href="code/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link type="text/css" href="code/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet">
<link type="text/css" href="code/css/theme.css" rel="stylesheet">
<link type="text/css" href="code/images/icons/css/font-awesome.css" rel="stylesheet">
<link type="text/css" href='code/http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600' rel='stylesheet'>
</head>
จากนั้น เติม
code/ ไว้ใน Url ของรูปทุกเช่น
จาก user.png เป็น code/user.png
แก้ไขคำสั่งที่มี .html ให้ลบ .html ออก
ทำให้ครบ 12 ไฟล์
สามารถเปิดการใช้งาน Url ได้ที่ : http://localhost/index
No comments:
Post a Comment