Merhaba arkadaşlar bu yazımda sizlere Tinymce Editör’de Html Body Taglarını Kaldırma konusundan bahsedeceğim.
TinyMce Html Editörü, içerikleri görsel kısımdan istenilen şekillerde düzenleyip belirledikten sonra o biçimde ekranda göstermemizi sağlayan bir text editördür. Örneğin bir paragrafta yazının belli bir kısmını kalın,italik olarak yazabiliriz. Başlık gibi yazı stilleri ekleyebiliriz. Bunları görsel kısımdan düzenlediğimizde tinymce editörü bir Html kodu üretir. Bu üretilen html kodu çıktısını da Html ya da Metin kısmından görebiliriz.
TinyMce Editör Görünümü
Bir ürün yönetimli site düşünelim. Ürün detay sayfasına girdiğimizde açıklama alanında bazı özellikleri vurgulamak isteyebiliriz ya da kullanıcı bunları vurgulama, renklendirme gibi özellikler isteyebilir. Bunları yapabilmesi için TinyMce editör ya da başka bir editör var olup gerekli düzenlemeleri yapabilir.
TinyMce editör de bu düzenlemeleri yaparken body tagları içerisine oluşturulan html kodunu gösterir. Fakat biz bunu sitemizde göstermek istediğimizde sitenin görünümünde bir kaymaya sebep olabilir. O yüzden bu editörün otomatik olarak oluşturduğu html kodunda bulunan <Body> tag’ını kaldırmamız gerekebilir. Bu tag’ı kaldırmak için:
TinyMce Plugin‘lerinde bulunan FullPage özelliğini kaldırdığımızda body tag’leri artık html kodu çıktısında bulunmayacaktır. Bu plugin, ilgili sayfamıza eklememiz gereken TinyMce scriptinde bulunur. Aşağıda script örneğinde plugin’leri görebilirsiniz.
tinymce.init({ selector: 'textarea', height: 500, theme: 'modern', plugins: 'print preview fullpage powerpaste searchreplace autolink directionality advcode visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists textcolor wordcount tinymcespellchecker a11ychecker imagetools mediaembed linkchecker contextmenu colorpicker textpattern help', toolbar1: 'formatselect | bold italic strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify | numlist bullist outdent indent | removeformat', image_advtab: true, templates: [ { title: 'Test template 1', content: 'Test 1' }, { title: 'Test template 2', content: 'Test 2' } ], content_css: [ '//fonts.googleapis.com/css?family=Lato:300,300i,400,400i', '//www.tinymce.com/css/codepen.min.css' ] });