TinyMCE bietet die Möglichkeit, HTML-Textbereichsfelder oder andere HTML-Elemente in Editorinstanzen zu konvertieren. Es bietet verschiedene HTML-Formatierungstools für Text sowie für Bilder/Videos (in Bezug auf die Ausrichtung). Während der Integration in ein Projekt können Konfigurationen vorgenommen werden, was zu einer Flexibilität des Projekts führt.
Anpassen des TinyMce Editor 4, auch mit Ruby on Rails:
Menüschaltfläche hinzufügen:
Copy the complete contents from TinyMce-4 development package have it in your assets or public folder, it includes tinymce’s classes, langs, plugins and other files, scripts and everything you need.
Name a button, here I will name as R.design, on click drop down menu with a single item named “menu1” appears, onclick, the content is appended in the editor, don’t forget to include tinymce.min.js
tinymce.init({ selector: “textarea”, Setup: Funktion(Editor) { editor.addButton(‘report_design’, { type: ‘menubutton’, text: ‘R.Design’, Symbol: falsch, Speisekarte: [ {text: ‘menu1 ‘, onclick: function() {editor.insertContent(‘menu1’);}} ] }); },
Plugins: [ “advlist autolink lists link image charmap print preview anchor”, “searchreplace visualblocks code fullscreen”, “insertdatetime media table contextmenu paste moxiemanager”, “emoticons print textcolor” ], toolbar: “insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | emoticons | forecolor backcolor | print | menu “ }); selector: “textarea”
Gibt an, dass der Editor für den Eingabetyp Textbereich platziert wird.
Verwendung mit Schienen:
Speisekarte: [
<% @array.each tun |value| %> {text: ‘<%= value %>’, onclick: function() {editor.insertContent(‘<%= value %>’);} <% Ende %> ]
Ordnen Sie Symbolleistensymbole, Farbtext und Hintergrund neu an. Symbolleiste: “insertfile undo redo” Symbolleiste: “undo insertfile redo”
If the text color icon and background coloring is missing, all you need is to add the textcolor into your plugins;[…] first, then use the forecolor and backcolor in the toolbar, so the icon does appear in the editor toolbar.
All of the things you include/defined in tinymce/plugins/* folder can be used in the tinymce editor. toolbar: “forecolor backcolor”
Tischrand ändern:
Datei: tinymce/skins/lightgray/content.min.css Das hat Stil für die Tabelle angewendet. Rand: 1px gestrichelt #BBBBBB; Überschreiben Sie den Standardstil, einfach und vergleichsweise besser als der Standardstil. .mce-item-table, .mce-item-table td, .mce-item-table th, .mce-item-table caption { Rand: 1 Pixel einfarbig schwarz; border-collapse: Zusammenbruch; Schriftgröße: 14px; }
Untermenüpunkte:
Speisekarte: [ { text:’Menu item’, menu:[ {text:’sub1′,value:’val1′},{text:’sub2′,value:’val2′}], onclick: function() {editor.insertContent(‘<%= “submenu” %>’);} } ]
Using along with rails, onclick of a submenu item, item insertion into editor’s textarea space. Speisekarte: [ { text:’Student Basic Data’, menu:[<% @object.each do |data| %>{text:'<%= data %>’, onclick: function() {editor.insertContent(‘<%= data %>’);}},<% end %>] } ] Fenstermanager { text:’Name’, onclick: function() { editor.windowManager.open({ title: ‘Paper Margins’, Körper: [ {type: ‘textbox’, name: ‘first’, label: ‘first name’,value: ”}, {type: ‘textbox’, name: ‘last’, label: ‘last name’, value: ”} ], onsubmit: Funktion(e) { // Inhalt einfügen, wenn das Fensterformular gesendet wird editor.insertContent(‘First Name’ + e.data.first); editor.insertContent(‘Last Name’ + e.data.last); } }); } } Verwendung entlang von Schienen {text:’Margins’, onclick: function() { editor.windowManager.open({ title: ‘Paper Margins’, Körper: [ { type: ‘textbox’, name: ‘top’, label: ‘Margin top (cm)’, value: ‘<%=@report.top if @custom_report.top.present? %>’ } ], onsubmit: Funktion(e) {
<%= remote_function( :url => {:controller=>”controller”,:action => “action”}, :with => “‘margin_top=’ + e.data.top ” ) %>
} }); } }
RailsCarma verfügt über umfassende Erfahrung bei der Bereitstellung von RoR-Lösungen in den Bereichen Entwicklung, Bereitstellung, Verwaltung, Überwachung und Unterstützung Ihrer Apps auf der ganzen Welt und bietet Ihnen effiziente und vereinfachte Geschäftslösungen.
Mehr lesen :
- Eine einfache Möglichkeit, die Leistung Ihrer Rails-App zu steigern
-
Die Grundlagen zum Erstellen und Verwenden von Modulen in Rails
-
Was ist eine REST-API?
Abonnieren Sie die neuesten Updates
Über den Autor des Beitrags
