Langsung ke konten utama

Cara Menambahkan Plugin Upload Gambar pada TinyMCE

Berikut langkah-langkah untuk menambahkan plugin upload gambar dalam texare dengan TyniMCE 4:
1. Download TinyMCE
Download plugin di https://www.tinymce.com/, usahakan pakai versi terbaru yakni v4. Jika sudah masukan folder tinymce di dalam framework laravel di folder public/js (terserah).

2. Instal plugin upload image
TinyMCE sendiri tidak menyediakan fitur upload image untuk versi yang free, jadi kita harus memakai plugin dari luar. Silahkan download pluginnya di http://justboil.me/. Kalau sudah download, ekstrak, copy foldernya, pindahkan ke dalam tinymce/plugins/, setelah dipaste rename nama folder menjadi jbimages.
justboil.me-master à ubah menjadi jbimages
Kemudian kita integrasikan ke dalam framework laravel, di dalam artikel-input.php, paste kode/perintah JS ini (didalam tag head).
<head>
<html>
<title>Tutorial Menambah TinyMCE kedalam PHP</title>
<head>

<script type="text/javascript" src="tinymce4/js/tinymce/tinymce.min.js"></script>
<script type="text/javascript">

tinymce.init({
  selector: "textarea",
 
  // ===========================================
  // INCLUDE THE PLUGIN
  // ===========================================
           
  plugins: [
    "advlist autolink lists link image charmap print preview anchor",
    "searchreplace visualblocks code fullscreen",
    "insertdatetime media table contextmenu paste jbimages"
  ],
           
  // ===========================================
  // PUT PLUGIN'S BUTTON on the toolbar
  // ===========================================
           
  toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image jbimages",
           
  // ===========================================
  // SET RELATIVE_URLS to FALSE (This is required for images to display properly)
  // ===========================================
           
  relative_urls: false
           
});

</script>

</head>
<body>
<table>
<tr>
<td>Judul</td>
<td>:</td>
<td><input type="text" name="judul"></td>
</tr>
<tr>
<td>subjudul</td>
<td>:</td>
<td><input type="text" name="subjudul"></td>
</tr>
<tr>
<td>Artikel</td>
<td>:</td>
<td><textarea name="artikel"></textarea></td>
</tr>
</table>
</body>
</html>
Karena yang itu gambar, jadi teman-teman silahkan copy di sini http://justboil.me/ (TinyMCE 4.x Example).
Kalau sudah teman-teman tinggal buat saja form textarea.
3. Config
Tinggal kita set up alamat folder untuk menyimpan file gambar, pada tinymce/plugins/jbimages/config.php.
$config['img_path'] = '/sma/images'; // --> folder web di lokal / folder gambar hasil upload
            $config['upload_path'] = $_SERVER['DOCUMENT_ROOT'] . $config['img_path']; // Physical path. [Usually works fine like this]


Alamat foldernya di public ya...
Label:

Postingan populer dari blog ini

Transformasi Lorentz (relativitas Kecepatan)

Pada transformasi Galileo telah dikemukakan bahwa selang waktu pengamatan terhadap suatu peristiwa yang diamati oleh pengamat yang diam dengan pengamat yang relatif bergerak terhadap peristiwa adalah sama ( t = t’ ) . Hal inilah yang menurut Einstein tidak benar, selang waktu pengamatan antara pengamat yang diam dan pengamat yang bergerak relatif adalah tidak sama ( t ≠ t’ ) . Transformasi Lorentz pertama kali dikemukaan oleh Hendrik A. Lorentz, seorang fisikawan dari Belanda   pada tahun 1895. Karena waktu pengamatan oleh pengamat yang diam pada kerangka acuan S dan pengamat yang bergerak pada kerangka acuan S’ hubungan transformasi pada Galileo haruslah mengandung suatu tetapan pengali   yang disebut tetapan transformasi.   Sehingga persamaan yang menyatakan hubungan antara koordinat pada kerangka acuan S dan S’ dituliskan sebagai berikut : Transformasi Lorentz          x’ =   ϒ (x – v.t), y’ = y, z’ = z    dan    t’ ≠ t                   .... (9.6) Kebali
Baca selengkapnya

Gaya Pemulih pada Pegas

1.   Gaya Pemulih   Gaya pemulih dimiliki oleh setiap benda elastis yang terkena gaya sehingga benda elastis tersebut berubah bentuk. Gaya yang timbul pada benda elastis untuk menarik kembali benda yang melekat padanya disebut gaya pemulih. Akibat gaya pemulih tersebut, benda akan melakukan gerak harmonik sederhana. Dengan demikian, pada benda yang melakukan gerak harmonik sederhana bekerja gaya pemulih yang selalu mengarah pada titik kesetimbangan benda. a. Gaya Pemulih pada Pegas Pegas adalah salah satu contoh benda elastis. Oleh karena sifat elastisnya ini, suatu pegas yang diberi gaya tekan atau gaya regang akan kembali ke keadaan setimbangnya mula-mula apabila gaya yang bekerja padanya dihilangkan. Perhatikan gambar, anggap mula-mula benda berada pada posisi y = 0 sehingga pegas tidak tertekan atau teregang. Posisi seperti ini dinamakan posisi keseimbangan. Ketika benda ditekan ke bawah (y = –) pegas akan menarik benda ke atas, menuju posisi keseimbangan. Sebaliknya jik
Baca selengkapnya

Teori Kuantum Planck

Perkembangan teori tentang radiasi mengalami perubahan besar  pada saat Planck menyampaikan teorinya tentang radiasi benda hitam. Planck mulai bekerja pada tahun 1900. Planck mulai  mempelajari sifat dasar dari getaran molekul-molekul pada dinding rongga benda hitam. Dari hasil pengamatannya Planck membuat simpulan sebagai berikut. Setiap benda yang mengalami radiasi akan memancarkan energinya secara diskontinu (diskrit) berupa paket-paket energi. Paket-paket energi ini dinamakan kuanta (sekarang dikenal sebagai foton) . Energi setiap foton sebanding dengan frekuensi gelombang radiasi dan dapat dituliskan : E = h f                     dengan  :  E  =  energi foton (joule)                   f   =  frekuensi foton (Hz)                   h  =  tetapan Planck (h = 6,6.10 -34 Js) Jika suatu gelombang elektromegnetik seperti cahaya memiliki banyak foton maka energinya memenuhi hubungan berikut.         E = nhf Persamaan yang sangat berkaitan dengan hubungan di atas adal
Baca selengkapnya