Jump to content

Search the Community

Showing results for tags 'ckeditor'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Welcome to ProcessWire
    • News & Announcements
    • Showcase
    • Wishlist & Roadmap
  • Community Support
    • Getting Started
    • Tutorials
    • FAQs
    • General Support
    • API & Templates
    • Modules/Plugins
    • Themes and Profiles
    • Multi-Language Support
    • Security
    • Jobs
  • Off Topic
    • Pub
    • Dev Talk

Product Groups

  • Form Builder
  • ProFields
  • ProCache
  • ProMailer
  • Login Register Pro
  • ProDrafts
  • ListerPro
  • ProDevTools
  • Likes
  • Custom Development

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

Found 99 results

  1. I doubt nobody has seen this issue before… when I have an <h2> or <h3> or the likes in a CKEditor-body-field and I delete that header, the h-tag is applied to whatever comes next in line. I'm obviously talking about the WYSIWYG-view. Similar bugs occur when applying an h-tag, that tag sometimes encloses the next line as well. Could be that this happens when the next line is in the same "block"-element and not technically a new line but separated with a <br> but not always… When will a new version of CKEditor for PW be released or what's a competitive alternative at this point?
  2. Hi. Sometimes when I select text in a textarea field outfitted with CK Editor, it fails to register as a "Block Style" and therefore the custom styles I have specified for block-level elements are not displayed in the Styles drop-down menu. If I open the page in an incognito window and select the same elements, the Block Style styles appear as expected in the Styles menu. Is this a caching issue of some kind? I've played with turning on and off the HTML "quality assurance" options as well as putting my custom styles directly within the CKEditor folder in the /wire directory. Once the field stops registering the selection of block-level elements, it also seems to have simultaneously stripped the custom styles that had been successfully applied to these block-level elements previously. Not sure what to do next.
  3. An inputfield for displaying markup editable via CKEditor. The module is intended for use with the Form Builder module. Allows blocks of static text to be included within a form, which can be edited in the form settings using CKEditor. Usage Install the Markup CKEditor module. In the Form Builder module settings, add "MarkupCKEditor" to "Inputfield types to use with FormBuilder". In your form settings, add a new field of type "Markup CKEditor". Enter the text you want to show in this field using "Markup Text" on the "Details" tab. Screenshots http://modules.processwire.com/modules/inputfield-markup-ckeditor/ https://github.com/Toutouwai/InputfieldMarkupCKEditor
  4. Hello all, I'm having a moment with CKeditor and hoping someone will be able to assist. I want to change the structure of the table plugin to automatically add the following: Schema.org markup to signify it's a table. Aria-label and roles for each of the table elements. At the moment if I add them in manually, the plugin removes them. I'd like to have this as default. Here is an example: Additional classes. The plugin has the option for a table ID, but where possible I'd rather use classes. I have searched far and wide on the ol Google but struggling on this. I'm not the most experienced and would appreciate any direction on this. It's mainly a case of where best to make said adjustments. Thank you in advance! Liam
  5. It would be fantastic if we could set different configurations for CKEditor fields based on template or user roles. Like described on https://weekly.pw/issue/14/ under "More CKEditor upgrades", we can use config files in /site/modules/InputfieldCKEditor/ to store settings per field. E.g. for the body field this would be /site/modules/InputfieldCKEditor/config-body.js. Maybe this logic could be extended to something like /site/modules/InputfieldCKEditor/config--field-body--template-home--role-mycustomrole.js. I was coming over from Joomla to PW couple of years ago and there we had an excellent CKEditor integration called JCE where you could define settings per user role etc. Maybe I am wrong but up to now we need to create additional fields if we need editor config settings per template. If there already is a way to do that I'd be happy to know.
  6. Hi all and thanks for the great work on PW! One thing I find I have to do on any new site is add the Justify plugin to textarea fields as it is such a widely required feature for text headings in content. ANy chance this could be added to the core an automatically be installed on new textarea fields using CKEditor? Thank you!
  7. Hello, I am currently building a intranet which will be hosted on the local network of a company. This intranet has many links to files on their fileserver with the protocol file://. So for example the links look like this file://domain.tld/filename.ext When I try to insert such a link into a URL field, I get the error, that only the protocol http:// is allowed. When I try to insert such a link into a CKEeditor link, it gets stripped out. Is it possible to insert such links into the FieldType URL and CKEditor. I know that I could use a FieldType Text or insert a RewriteRule in the .htaccess file, but I am looking for a more elegant solution. 😉 Regards, Andreas
  8. Does anyone knows if there is a way of selecting a iframe inside a textfield(using ckEditor)? I mean I have a Iframe with this code: <iframe allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0" height="315" scrolling="no" src="https://www.youtube.com/embed/PMaFJjZDrYM" width="100%"></iframe></p> but it's not getting responsive in iPhones.. So anyone know how can I select it via code for making it responsive? Thank you,
  9. On one particular site, CKEditor behaves rather weird: When I copy and paste "normally", i.e. CTRL + V, there is an alert popping up "do you really want to leave this page?". If you cancel, the text is pasted into the field. If not, you get redirected to the frontend of the page you just edited, and the changes are lost. The "paste from Word" button doesn't work. CTRL + SHIFT + V works, but all formatting is lost (apart from paragraphs). I'm using inline editor mode, ACF + Purifier are activated. I know that if I disable those two, CTRL + V works, but I won't do that, since CKE then saves all the garbage code from MS-Office. Has anyone ever come across this issue? I tried with Chrome + FF. No JS errors.
  10. Hi folks. I'm building a Formbuilder form to create new advert pages in a marketplace. Formbuilder is ideal for this. I need to add a description field that allows text to be added with line breaks etc. so showing a CKEditor field would be ideal (i.e. exactly like the field I'm typing into right now)!. Does anyone know if it's possible to add a CKEditor field to the front end presentation fo a Formbuilder field, maybe via a module or such? Many thanks!
  11. Hello. I never though about it before but when I insert image into CKeditor field I don't get ALT tag filled from image that has it. Do I have to do it manualy for inserted image or Im doing something wrong?
  12. If you've ever needed to insert links to a large number of files within CKEditor you may have found that the standard PW link modal is a somewhat slow way to do it. This module provides a quicker way to insert links to files on the page being edited. You can insert a link to an individual file, or insert an unordered list of links to all files on the page with a single click. CKEditor Link Files Adds a menu to CKEditor to allow the quick insertion of links to files on the page being edited. Features Hover a menu item to see the "Description" of the corresponding file (if present). Click a menu item to insert a link to the corresponding file at the current cursor position. The filename is used as the link text. If you Alt-click a menu item the file description is used as the link text (with fallback to filename if no description entered). If text is currently selected in the editor then the selected text is used as the link text. Click "* Insert links to all files *" to insert an unordered list of links to all files on the page. Also works with the Alt-click option. Menu is built via AJAX so newly uploaded files are included in the menu without the page needing to be saved. However, descriptions are not available for newly uploaded files until the page is saved. There is an option in the module config to include files from Repeater fields in the edited page. Nested Repeater fields (files inside a Repeater inside another Repeater) are not supported. Installation Install the CKEditor Link Files module. For any CKEditor field where you want the "Insert link to file" dropdown menu to appear in the CKEditor toolbar, visit the field settings and add "LinkFilesMenu" to the "CKEditor Toolbar" settings field. http://modules.processwire.com/modules/cke-link-files/ https://github.com/Toutouwai/CkeLinkFiles
  13. Hi all, Having a strange problem with my CKeditor custom styles. Trying to add standard bootstrap classes to the image alignment options. But for some reason if I add multiple classes to the centred image option it disappears from the editor drop down. But with only one class it works. So this works: { name: 'Left Aligned Photo', element: 'img', attributes: { 'class': 'float-md-left img-fluid' } }, { name: 'Right Aligned Photo', element: 'img', attributes: { 'class': 'float-md-right img-fluid' } }, { name: 'Centered Photo', element: 'img', attributes: { 'class': 'img-fluid' } }, But this doesn't: { name: 'Left Aligned Photo', element: 'img', attributes: { 'class': 'float-md-left img-fluid' } }, { name: 'Right Aligned Photo', element: 'img', attributes: { 'class': 'float-md-right img-fluid' } }, { name: 'Centered Photo', element: 'img', attributes: { 'class': 'w-100 img-fluid' } }, Note the slight difference to the last line. I've tried escaping the hyphens in case it was that but doesn't help. Any ideas.... #puzzled!
  14. I have a CKEditor Textarea in a page template. Some users like to add text in them by pasting from Word document. This leads to internal server error when saving page. When using paste without formatting (cmd + shift + V), page is saved normally, so I assume error has something to do with Word's hidden characters that cause issues in many other programs as well. (I don't have Word myself, so I debugged this with video chat with user. I forgot to ask to check code view, so I'm not sure if they are visible there.) Is there a way in ProcessWire/PHP to sanitize Textarea input from these hidden characters, or can I prevent this by changing editor settings (listed below, if it helps)? I don't like leaving error handling rely to user action - somebody always forgets to do things specific way and it weakens user experience. Textarea formatting: none (htmlspecialchars off) field type: CKEditor content type: markup/html experimental markup/html settings: all on acf: on html purifier: on additional purify settings: all on extra allowed content: none add-ons: pwimage, pwlink, sourcedialog sourcedialog settings: none disabled add-ons: image, magicline
  15. I was wondering if there's a way to set an absolute path instead of relative when linking to a file in CKEditor? Any help would be appreciated.
  16. HELLO! I always struggle adding additional functionality, buttons and other settings to the CKeditor and I guess other people might have the same issue at times. For those who are CKeditor aces would you share your settings in this post to help others with what I guess should be a simple task to extend the default settings. Extra color select and text formating toolbar Format, Styles Bold, Italic, Underline, -, RemoveFormat TextColor, BGColor JustifyLeft , JustifyCenter, JustifyRight, JustifyBlock NumberedList, BulletedList, -, Blockquote PWLink, Unlink, Anchor PWImage, Table, HorizontalRule, SpecialChar PasteText, PasteFromWord Scayt, -, Sourcedialog extra allowed content small[*] section font[style] span[style]{!color} code[*] custom config options colorButton_colors: ec4626,ffde43,00aaeb,004a87,7b9320,ffffff extra plugins colorButton
  17. I added some custom styles to the CKeditor menu bar using the example mystyles.js and the PW tutorial. This worked fine for fields when editing on the frontend. But none of our custom styles showed in the backend editor dropdown unless we edited the core copy of mystyles.js in wire/modules. Is this correct behaviour, a bug or a mistake on my part? Tried clearing cache, logging in/out etc but the backend ignores our custom styles in the site/modules path.
  18. Hi, what do i have to do, to allow the i tag and the h4 class in the CKEditor? In the Extra Allowed Content box (setup field -> input) i wrote "i(*);h4(*)". But when i type <h4 class="uk-panel-title"><i class="uk-icon-credit-card-alt"></i>Unsere Bankverbindung:</h4> the CKEditor still strips the complete i tag and the h4 class from the source. Mario
  19. Hello, is it possible to configure CKEditor to have syntax highlighting enabled in Source and/or Sourcedialog? Coming from MODX i had this feature enabled and now I'm trying to find a solution for PW too. I'd like to have both the WysiWyg Editor and the Source editor with syntax highlighting enabled in on field. Andy plugins to achieve this? Greetings, Martin
  20. A pet hate of mine is when an editor uses a paragraph of bold text for what ought to be a heading. When I need to tidy up poorly formatted content like this I will quickly change such lines of text into the heading of the appropriate level, but that still results in markup like... <h2><strong>Some heading text</strong></h2> The <strong> has no business being there, but it's a bit of a hassle to remove it because you have to drag a selection around the exact text as opposed to just placing your cursor within the line. That gets tedious if you have a lot content to process. I figured there has to be an easier way so started looking into the ACF (Advanced Content Filter) features of CKEditor. What I wanted is a rule that says "strong tags are disallowed specifically when they are within a heading tag". (I guess there could occasionally be a use case where it would be reasonable to have a strong tag within a heading tag, but it's so rare that I'm not bothered about it). With the typical string format for allowedContent and disallowedContent there is no ability to disallow a specific tag only when it is within another specific tag - a tag is allowed everywhere or not at all. But I found there is an alternative object format for these rules that supports a callback function in the "match" property. So I was able to achieve my goal with the following in /site/modules/InputfieldCKEditor/config.js: CKEDITOR.editorConfig = function(config) { config.disallowedContent = { // Rule for the <strong> element strong: { // Use "match" callback to determine if the element should be disallowed or not match: function(element) { // Heading tag names var headings = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6']; // The parent of the element (if any) var parent = element.parent; if(typeof parent !== 'undefined') { // If there is a parent, return true if its name is in the heading names array return headings.indexOf(parent.name.toLowerCase()) !== -1; } else { // There is no parent so the element is allowed return false; } } } } }; Another tip: if you want to debug your allowedContent or disallowedContent rules to make sure they are being parsed and applied successfully you can log the filter rules to the console. For convenience I used /site/modules/InputfieldCKEditor/config.js again. // Get the CKEditor instance you want to debug var editor = CKEDITOR.instances.Inputfield_body; editor.on('instanceReady', function() { // Log the disallowed content rules console.log(editor.filter.disallowedContent); });
  21. I wanted to install the CKEditor accessibility checker on one of my sites (latest PW 3 dev). I downloaded the two required folders and put them in the correct folder (as per the helptext To add more plugins, place them in /site/modules/InputfieldCKEditor/plugins/[name]/, replacing [name] with the name of the plugin.) I checked those two plugins in the body field (which means PW recognises them) under edit field > input. I even tried to put the plugins in wire/modules/Inputfield/InputfieldCKEditor/plugins - which of course is stupid, but hey... worth a try. And I made sure i hit "refresh modules" a couple of times as well... Does anyone know why that new plugin still doesn't show up in my field?
  22. I've got some odd problem adding additional styles to mystyles.js. After reading some and following the article here: https://github.com/ryancramerdesign/ProcessWire/blob/dev/wire/modules/Inputfield/InputfieldCKEditor/README.md#custom-editor-js-styles-set I was able to add a custom style. So far so good 😉 It is displayed in the Styles menu and can be selected there. Now the odd thing starts, if I add a custom style like this: ... { name: 'Box Top', element: 'span',attributes: { 'class': 'box_top' } }, { name: 'Box Bottom', element: 'span', attributes: { 'class': 'box_bottom' } } it works and can be selected just fine. However, if I add this: { name: 'Box Top', element: 'div',attributes: { 'class': 'box_top' } }, { name: 'Box Bottom', element: 'div', attributes: { 'class': 'box_bottom' } } It is also displayed, can be selected - BUT - once the edit is saved, it is gone, won't be displayed in the page and won't be shown anymore in the editor as selected style, it goes back to "normal". Can anyone give me a hint what I missed?
  23. Hey All. I am creating a new field of type 'FieldtypeTextareaLanguage' via a module. Everything is working just fine expect that I can not find any information on how to set the 'Text Formatter' (to HTML Entity Encoder) and 'Inputfield Type' (to CKEditor). I tried the following which failed and was just a guess because of the IDs and select-values in the HTML... $f = new Field(); $f->type = $this->modules->get("FieldtypeTextareaLanguage"); $f->name = $newstcontentfieldname; $f->label = $newstcontentfieldlabel; $f->set('tags','servicetype'); $f->set('icon','fa-pencil-square'); $f->set('asmSelect0','TextformatterEntities'); $f->set('Inputfield_inputfieldClass', 'InputfieldCKEditor'); $f->save(); [EDIT] Furthermore, I just came across the question how to set the 'Visibility' --> ' Show this field only if' Option? Is there any documentation that I missed sofar about these field-variables and how to set them? [/EDIT] I am thankfull for any suggestion and hope somebody can help me. Thanks a lot!
  24. A few usability tweaks and tips for the CKEditor "Styles" dropdown, which is by default not that user-friendly: As you can see it's small and if you add custom items to it they may look awkward as they may inherit styles from their targets (a 3rem bottom margin in the screenshot above). These are relatively easy to fix but you have to load your custom CSS files to two places (eg. with AdminOnSteroids): PW admin and CKEditor. After loading the CSS/Js assets (see code below) the dropdown looks nicer and more usable: The screencap contains other features that you can achieve with the snippets below. Code CSS - CKEditor (contains demo styles too) CSS - admin JavaScript - CKEditor custom styles P.s. in case you wonder whether the half-margin, no-margin stuff and font-sizes from 12px to 48px were real-life examples - yes, client request 🙂
  25. CKEditor 5 v10.0.0 – the future of rich text editing looks stable .
×
×
  • Create New...