반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 코로나19
- 소액임금체불
- Sentinel
- php
- auth
- 사업자계좌
- vue
- Blade
- 이더리움
- reactnative
- 당사자표시정정신청서
- Bootstrap
- cartalyst
- javascript
- 체당금
- Java
- Python
- as후기
- elasticSearch
- 코로나
- Tutorial
- Eclipse
- win32
- 전자소송
- Laravel
- 보정명령
- 개인사업자
- blockchain
- 홈택스
- 인민공원
Archives
- Today
- Total
그냥 사는 이야기
Laravel 5.3 Blog System - Bootstrap theme view 본문
반응형
Bootstrap 적용
Clean Blog theme 를 down 받는다. 그래서 모든 폴더(css, img, js, less, mail, vendor)를 public 밑으로 복사해 둔다.
View 추가
resources/views/layouts/app.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Study Blog System</title>
<!-- Bootstrap Core CSS -->
<link href="/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Theme CSS -->
<link href="/css/clean-blog.min.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-default navbar-custom navbar-fixed-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
Menu <i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="index.html">Study</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="/">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Sample Post</a></li>
<li><a href="#">Contact</a></li>
@if (Auth::guest())
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Members<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="{{ url('/login') }}">Login</a></li>
<li><a href="{{ url('/register') }}">Register</a></li>
</ul>
</li>
@else
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
{{ Auth::user()->name }}<span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a href="{{ url('/logout') }}"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();">
Logout
</a>
<form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;">
{{ csrf_field() }}
</form>
</li>
</ul>
</li>
@endif
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Page Header -->
<!-- Set your background image for this header on the line below. -->
<header class="intro-header" style="background-image: url('/img/post-bg.jpg')">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
@yield('header')
</div>
</div>
</div>
</header>
<!-- Main Content -->
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<div class="post-preview">
@yield('content')
</div>
@yield('pagination')
</div>
</div>
</div>
<hr>
<!-- Footer -->
<footer>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
<ul class="list-inline text-center">
<li>
<a href="#">
<span class="fa-stack fa-lg">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-twitter fa-stack-1x fa-inverse"></i>
</span>
</a>
</li>
<li>
<a href="#">
<span class="fa-stack fa-lg">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-facebook fa-stack-1x fa-inverse"></i>
</span>
</a>
</li>
<li>
<a href="#">
<span class="fa-stack fa-lg">
<i class="fa fa-circle fa-stack-2x"></i>
<i class="fa fa-github fa-stack-1x fa-inverse"></i>
</span>
</a>
</li>
</ul>
<p class="copyright text-muted">Copyright © Your Website 2016</p>
</div>
</div>
</div>
</footer>
<!-- jQuery -->
<script src="/vendor/jquery/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
<!-- Contact Form JavaScript -->
<script src="js/jqBootstrapValidation.js"></script>
<script src="js/contact_me.js"></script>
<!-- Theme JavaScript -->
<script src="js/clean-blog.min.js"></script>
</body>
</html>
resources/views/home.blade.php
@extends('layouts.app')
@section('header')
<div class="post-heading">
<h1>{{ $post->title }}</h1>
<h2 class="subheading">{{ $post->description }}</h2>
<span class="meta">
{{ $post->created_at->format('M d,Y \a\t h:i a') }} By
<a href="{{ url('/user/'.$post->author_id) }}">{{ $post->author->name }}</a>
</span>
</div>
@endsection
@section('content')
@if ($post)
<div class="">
{!! $post->body !!}
</div>
@if (Auth::guest())
<p>Please login to Comment</p>
@else
<div class="">
<h3>Leave a comment</h3>
</div>
<div class="panel-body">
<form class="" action="/comment/add" method="post">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
<input type="hidden" name="on_post" value="{{ $post->id }}">
<input type="hidden" name="slug" value="{{ $post->slug }}">
<div class="form-group">
<textarea required="required" placeholder="Enter comment here" name="body" class="form-control"></textarea>
</div>
<input type="submit" name='post_comment' class="btn btn-success" value="Post">
</form>
</div>
@endif
<div class="">
@if ($comments)
<ul style="list-style: none; padding: 0">
@foreach($comments as $comment)
<li class="panel-body">
<div class="list-group">
<div class="list-group-item">
<h3>{{ $comment->author->name }}</h3>
<p>{{ $comment->created_at->format('M d,Y \a\t h:i a') }}</p>
</div>
<div class="list-group-item">
<p>{{ $comment->body }}</p>
</div>
</div>
</li>
@endforeach
</ul>
@endif
</div>
@else
// 404 error
@endif
@endsection
resources/views/layouts/appadmin.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Styles -->
<link href="/css/app.css" rel="stylesheet">
<!-- Scripts -->
<script>
window.Laravel = <?php echo json_encode([
'csrfToken' => csrf_token(),
]); ?>
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
@yield('content')
</div>
</div>
</div>
<!-- Scripts -->
<script src="/js/app.js"></script>
</body>
</html>
resources/views/auth/login.blade.php, register.blade.php
@extends('layouts.appadmin')
...
'Development > Web' 카테고리의 다른 글
Laravel 5.3 Blog System - Admin Dashboard - All Posts (0) | 2020.01.23 |
---|---|
Laravel 5.3 Blog System - Admin Dashboard (0) | 2020.01.23 |
Laravel 5.3 Blog System - Post And Comments (2) | 2020.01.22 |
Laravel 5.3 Blog System - Setup Database (0) | 2020.01.22 |
Laravel 5.3 Sentinel - Visitors & Manager (0) | 2020.01.21 |
Comments