このページの翻訳:
- 日本語 (ja)
- English (en)
最近の更新
サイドバー
11_php:02_framework:01_laravel:28_laravel_voyger_front-end
28 Laravel Voyager フロントページ用意
Post
一覧ページ
Postのデータ一覧を表示するページ
1.コントローラ
コントローラ作成
※コントローラ内でテーブルを指定しない場合、同じ名前のテーブルを参照する。
php artisan make:model Post
下記ができる
app/Post.php
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Post extends Model
{
//
}
2.ルーティング
routes/web.php
Route::get('/foo', function () {
$posts = App\Post::all();
return view('home', compact('posts'));
});
3.Viewを作成
resources/views/home.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Homepage</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<br><br>
<div class="row">
@foreach($posts as $post)
<div class="col-md-3">
<a href="/post/{{ $post->slug }}">
<img src="{{ Voyager::image( $post->image ) }}" style="width:100%">
<span>{{ $post->title }}</span>
</a>
</div>
@endforeach
</div>
</div>
</body>
</html>
4.ページ完成
一覧のページが完成
シングルページ
個々のページへのアクセス
1.ルーティング
routes/web.php
Route::get('post/{slug}', function($slug){
$post = App\Post::where('slug', '=', $slug)->firstOrFail();
return view('post', compact('post'));
});
2.View
resources/views/post.blade.php
<!DOCTYPE html>
<html>
<head>
<title>{{ $post->title }}</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h1>{{ $post->title }}</h1>
<img src="{{ Voyager::image( $post->image ) }}" style="width:100%">
<p>{!! $post->body !!}</p>
</div>
</div>
</div>
</body>
</html>
3.ページ完成
Pages
1.コントローラ
php artisan make:model Pages
下記のコントローラが作成される
app/Pages.php
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Pages extends Model
{
//
}
2.ルーティング
routes/web.php
Route::get('pages/{slug}', function($slug){
$pages = App\Pages::where('slug', '=', $slug)->firstOrFail();
return view('pages', compact('pages'));
});
3.View
resources/views/pages.blade.php
<!DOCTYPE html>
<html>
<head>
<title>{{ $pages->title }}</title>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<h1>{{ $pages->title }}</h1>
<img src="{{ Voyager::image( $pages->image ) }}" style="width:100%">
<p>{!! $pages->body !!}</p>
</div>
</div>
</div>
</body>
</html>
4.完成
11_php/02_framework/01_laravel/28_laravel_voyger_front-end.txt · 最終更新: 2021/02/04 14:08 by matsui
特に明示されていない限り、本Wikiの内容は次のライセンスに従います： CC Attribution-Noncommercial-Share Alike 4.0 International
