Dalam tutorial ini, Anda akan mempelajari contoh editor laravel bootstrap wysihtml5. Anda akan belajar cara menginstal editor wysihtml5 bootstrap di laravel. saya jelaskan langkah demi langkah bootstrap contoh editor lysvel wysihtml5. Anda dapat melihat contoh editor wysihtml laravel. Mari kita mulai dengan menggunakan bootstrap editor lysvel wysihtml.
Setiap kali perlu menggunakan kotak teks kaya di aplikasi laravel kami saat itu Anda dapat menggunakan editor html wysihtml5. Anda dapat dengan mudah menggunakan bootstrap wysihtml5 tanpa menggunakan perpustakaan apa pun di sini.
Bootstrap wysihtml5 menyediakan untuk menggunakan Elemen HTML untuk pemformatan konten teks. wysihtml5 memberikan daftar, unggah gambar, tautan, gaya font, huruf tebal, dll. di sini saya akan memberikan Anda contoh sederhana yang akan menunjukkan kepada Anda cara menambahkan dan menggunakan wysihtml5 di aplikasi laravel.
Anda bisa mendapatkan pratinjau di bawah ini:
Blade File Code:
Mari kita lihat contoh kode file blade sederhana menggunakan perpustakaan file cdn js:
<html>
<head>
<title>How to Use WYSIHTML5 Editor with Laravel? - Medikre.com</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://jhollingworth.github.io/bootstrap-wysihtml5//lib/css/bootstrap.min.css"></link>
<link rel="stylesheet" type="text/css" href="https://jhollingworth.github.io/bootstrap-wysihtml5//lib/css/prettify.css"></link>
<link rel="stylesheet" type="text/css" href="https://jhollingworth.github.io/bootstrap-wysihtml5//src/bootstrap-wysihtml5.css"></link>
<script src="https://jhollingworth.github.io/bootstrap-wysihtml5//lib/js/wysihtml5-0.3.0.js"></script>
<script src="https://jhollingworth.github.io/bootstrap-wysihtml5//lib/js/jquery-1.7.2.min.js"></script>
<script src="https://jhollingworth.github.io/bootstrap-wysihtml5//lib/js/prettify.js"></script>
<script src="https://jhollingworth.github.io/bootstrap-wysihtml5//lib/js/bootstrap.min.js"></script>
<script src="https://jhollingworth.github.io/bootstrap-wysihtml5//src/bootstrap-wysihtml5.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-8 offset-2 mt-5">
<div class="card">
<div class="card-header bg-info">
<h6 class="text-white">How to Use WYSIHTML5 Editor with Laravel? - Medikre.com</h6>
</div>
<div class="card-body">
<form method="post" action="" enctype="multipart/form-data">
@csrf
<div class="form-group">
<label>Name</label>
<input type="text" name="name" class="form-control"/>
</div>
<div class="form-group">
<label><strong>Description :</strong></label>
<textarea class="wysihtml5 form-control" name="description"></textarea>
</div>
<div class="form-group text-center">
<button type="submit" class="btn btn-success btn-sm">Save</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$('.wysihtml5').wysihtml5();
});
</script>
</body>
</html>Display Content:
setelah menyimpan konten textbox maka Anda dapat menampilkan seperti di bawah pada halaman daftar.
{!! $post->description !!}Sekarang Anda dapat memeriksa sendiri.
semoga bisa membantu ...
WYSIHTML5 bootstrap laravel 7 laravel 6 laravel
andriajah