Highest Voted 'froala' Questions

5

votes

0 answers

How do I create a signature using the imageUploadtoS3 option in Froala with Coldfusion 8?

I want to use Froala text editor to upload images directly to my Amazon S3 account. An S3 authentication signature is required. ImageUploadtoS3 javascript: $('.selector').editable({ imageUploadToS3: { bucket: 'editor', region: 's3', …

froala

asked Jul 04 '15 at 21:00

Rick99

51
1

4

votes

2 answers

Froala React component throwing "cannot set property 'more_btn' of undefined"

I am experimenting with the React version of the Froala rich text editor see also react-froala-wysiwyg. I've created a simple Editor component as follows import { string } from 'prop-types' // note the docs say do this // import…

javascript reactjs froala

asked Jun 25 '21 at 05:32

Dave Sag

13,266
14
86
134

4

votes

3 answers

How to fix Error: Type FroalaEditorModule does not have 'ngModuleDef' property Using Froala Wysiwyg

I'm following the instructions at Angular Froala WYSIWYG Editor and I'm using angular version 8.3.26. app.nodule... import { FroalaViewModule, FroalaEditorModule } from 'angular-froala-wysiwyg' imports: [ ... FroalaViewModule.forRoot(),…

angular froala

asked Oct 10 '20 at 11:05

davy

4,474
10
48
71

4

votes

1 answer

Froala Angular Text Editor (v3) - Destroy and re-Initialize on input changes

I am creating a re-usable Angular component which is it charge for rendering the Froala Text Editor in an Angular application. I have everything working in terms of component first render initialization, but I am trying to account for some…

angular wysiwyg froala

asked Dec 18 '19 at 17:50

blgrnboy

4,877
10
43
94

4

votes

0 answers

Using the Froala editor in a Typescript/Vue project

I am attempting to use Froala in a Typescript/Vue project, and I am running into a weird import issue. Since Froala lacks proper typings, I rolled my own in a froala.d.ts: declare module 'froala-editor' and in my component, import it like…

typescript vue.js froala

asked Sep 06 '19 at 19:05

McCroskey

1,091
1
11
21

4

votes

0 answers

Froala: custom HTML template for images

This is the default HTML Froala produces for images:

Image caption …

javascript html froala

asked Aug 13 '18 at 10:15

Alex Paramonov

2,630
2
23
27

4

votes

2 answers

Calling methods in Froala wysiwyg editor for React

I'm using a rich text editor called Froala, in its React version. The docs are intended for the JQuery one. From the little that is written about React, i found these instructions: Events and Methods Events can be passed in with the options, with…

reactjs wysiwyg froala

asked Apr 30 '18 at 10:42

i.brod

3,993
11
38
74

4

votes

0 answers

Rails5｜Uncaught TypeError: $(...).froalaEditor is not a function

I'm using rails5.0.6 and trying to add Froala editor to my project. In development it works fine,but in production Froala does not work and result is new:107 Uncaught TypeError: $(...).froalaEditor is not a function To solve this problem,　I…

ruby-on-rails froala

asked Feb 10 '18 at 00:59

Thomas

41
1
2

4

votes

4 answers

Property 'FroalaEditor' does not exist on type 'JQueryStatic' - Angular 4

I am using Angular 4 'FroalaEditor' which uses 'JQuery'. I have implemented it successfully. Now I need to add custom buttons in that plugin. I found following solution import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import *…

jquery angular froala angular5

asked Nov 10 '17 at 12:41

Sangwin Gawande

7,658
8
48
66

4

votes

1 answer

Angular and froala editor validation with reactive forms

I am using Froala Editor with Angular 4 and I am facing some problems with showing the validation message.

Job Description

<div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/angular" class="post-tag grid--cell" title="show questions tagged 'angular'" rel="tag">angular</a> 
                
                <a href="../../questions/tagged/validation" class="post-tag grid--cell" title="show questions tagged 'validation'" rel="tag">validation</a> 
                
                <a href="../../questions/tagged/froala" class="post-tag grid--cell" title="show questions tagged 'froala'" rel="tag">froala</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Oct 13 '17 at 20:39">asked Oct 13 '17 at 20:39</time>
    <a href="../../users/5817136/iman" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/5817136.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Iman" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/5817136/iman" class="s-user-card--link">Iman</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">717</li>
            
            <li class="s-award-bling s-award-bling__silver" title="15 silver badges">15</li>
            <li class="s-award-bling s-award-bling__bronze" title="32 bronze badges">32</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-44854075">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>4</strong></span>
                    <div class="viewcount">votes</div>
                </div>
            </div>

<div class="status ">
                <strong>5</strong> answers
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/44854075/how-to-get-text-data-from-froala-editor" class="question-hyperlink">How to get text data from froala editor?</a></h3>
        <div class="excerpt">Currently I use $('div#edit').froalaEditor('html.get') to retrieve the html data inside editor, but it sucks when it comes to process / store the text data in my backend because of all the p tags and &npsb; symbols in raw html string. 
To be honest…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/javascript" class="post-tag grid--cell" title="show questions tagged 'javascript'" rel="tag">javascript</a> 
                
                <a href="../../questions/tagged/jquery" class="post-tag grid--cell" title="show questions tagged 'jquery'" rel="tag">jquery</a> 
                
                <a href="../../questions/tagged/node.js" class="post-tag grid--cell" title="show questions tagged 'node.js'" rel="tag">node.js</a> 
                
                <a href="../../questions/tagged/wysiwyg" class="post-tag grid--cell" title="show questions tagged 'wysiwyg'" rel="tag">wysiwyg</a> 
                
                <a href="../../questions/tagged/froala" class="post-tag grid--cell" title="show questions tagged 'froala'" rel="tag">froala</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Jun 30 '17 at 20:03">asked Jun 30 '17 at 20:03</time>
    <a href="../../users/8126706/zzlyn" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/8126706.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="zzlyn" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/8126706/zzlyn" class="s-user-card--link">zzlyn</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">85</li>
            <li class="s-award-bling s-award-bling__gold" title="1 gold badge">1</li>
            <li class="s-award-bling s-award-bling__silver" title="3 silver badge">3</li>
            <li class="s-award-bling s-award-bling__bronze" title="9 bronze badge">9</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-44768858">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>4</strong></span>
                    <div class="viewcount">votes</div>
                </div>
            </div>

<div class="status answered-accepted">
                <strong>1</strong> answer
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/44768858/froala-unordered-list-not-showing-in-editor" class="question-hyperlink">froala unordered list not showing in editor</a></h3>
        <div class="excerpt">I'm using Froala for my website CMS.
I'm trying to add unordered lists to the editor.
I've added the lists plugin like so:
<script src="js/plugins/lists.min.js"></script>

and when I init the editor, I add it to the tool bar buttons
   …</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/plugins" class="post-tag grid--cell" title="show questions tagged 'plugins'" rel="tag">plugins</a> 
                
                <a href="../../questions/tagged/froala" class="post-tag grid--cell" title="show questions tagged 'froala'" rel="tag">froala</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Jun 26 '17 at 21:19">asked Jun 26 '17 at 21:19</time>
    <a href="../../users/1807604/shawn" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/1807604.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Shawn" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/1807604/shawn" class="s-user-card--link">Shawn</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">3,031</li>
            <li class="s-award-bling s-award-bling__gold" title="4 gold badges">4</li>
            <li class="s-award-bling s-award-bling__silver" title="26 silver badges">26</li>
            <li class="s-award-bling s-award-bling__bronze" title="53 bronze badges">53</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-41994388">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>4</strong></span>
                    <div class="viewcount">votes</div>
                </div>
            </div>

<div class="status ">
                <strong>1</strong> answer
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/41994388/froala-editor-focus-cursor-on-page-load" class="question-hyperlink">Froala editor: focus cursor on page load</a></h3>
        <div class="excerpt">I thought something like this would be simple, but apparently not.  I'm using a paid version of the Froala Editor, and I love it.  However, it needs to focus the cursor when the page loads inside the editor so I don't have to force my users to…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/javascript" class="post-tag grid--cell" title="show questions tagged 'javascript'" rel="tag">javascript</a> 
                
                <a href="../../questions/tagged/setfocus" class="post-tag grid--cell" title="show questions tagged 'setfocus'" rel="tag">setfocus</a> 
                
                <a href="../../questions/tagged/froala" class="post-tag grid--cell" title="show questions tagged 'froala'" rel="tag">froala</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Feb 02 '17 at 04:49">asked Feb 02 '17 at 04:49</time>
    <a href="../../users/667772/dan-l" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/667772.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Dan L" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/667772/dan-l" class="s-user-card--link">Dan L</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">4,319</li>
            <li class="s-award-bling s-award-bling__gold" title="5 gold badges">5</li>
            <li class="s-award-bling s-award-bling__silver" title="41 silver badges">41</li>
            <li class="s-award-bling s-award-bling__bronze" title="74 bronze badges">74</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-41069892">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>4</strong></span>
                    <div class="viewcount">votes</div>
                </div>
            </div>

<div class="status ">
                <strong>0</strong> answers
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/41069892/how-to-add-custom-html-with-class-in-froala-editor" class="question-hyperlink">How to add custom html with class in Froala Editor</a></h3>
        <div class="excerpt">Trying to figure out how to:
1). add a button to Froala editor which would wrap a selection of text (current block) in an <h1>.
2). If current selected text (or immediate parent block) is an <h1>, the clicking the custom button would remove the…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/javascript" class="post-tag grid--cell" title="show questions tagged 'javascript'" rel="tag">javascript</a> 
                
                <a href="../../questions/tagged/jquery" class="post-tag grid--cell" title="show questions tagged 'jquery'" rel="tag">jquery</a> 
                
                <a href="../../questions/tagged/froala" class="post-tag grid--cell" title="show questions tagged 'froala'" rel="tag">froala</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Dec 09 '16 at 22:30">asked Dec 09 '16 at 22:30</time>
    <a href="../../users/294260/gn" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/294260.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="GN." />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/294260/gn" class="s-user-card--link">GN.</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">8,672</li>
            <li class="s-award-bling s-award-bling__gold" title="10 gold badges">10</li>
            <li class="s-award-bling s-award-bling__silver" title="61 silver badges">61</li>
            <li class="s-award-bling s-award-bling__bronze" title="126 bronze badges">126</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>
                
                    <div class="mln24">
                    <div class="question-summary" id="question-summary-40094695">
    <div class="statscontainer">
        <div class="stats">
            <div class="vote">
                <div class="votes">
                    <span class="vote-count-post"><strong>4</strong></span>
                    <div class="viewcount">votes</div>
                </div>
            </div>

<div class="status ">
                <strong>1</strong> answer
            </div>
        </div>
    </div>
    <div class="summary">
        
        <h3><a href="../../questions/40094695/froala-wyiswyg-editor-not-showing-the-toolbar-button" class="question-hyperlink">Froala WYISWYG editor not showing the toolbar button</a></h3>
        <div class="excerpt">I start with project Froala editor with angular 1 , I follow the documentation step by step , I like to show insertImage button and insertTable but nothing is showing . this is my code : 
var tb = [ "bold", "italic" , "insertTable","insertImage"…</div>
        <div class="grid ai-start jc-space-between fw-wrap">
            <div class="grid gs4 fw-wrap tags ">
                
                <a href="../../questions/tagged/javascript" class="post-tag grid--cell" title="show questions tagged 'javascript'" rel="tag">javascript</a> 
                
                <a href="../../questions/tagged/angularjs" class="post-tag grid--cell" title="show questions tagged 'angularjs'" rel="tag">angularjs</a> 
                
                <a href="../../questions/tagged/froala" class="post-tag grid--cell" title="show questions tagged 'froala'" rel="tag">froala</a> 
                
            </div>
            <div class="started mt0">
                
                    
<div class="s-user-card s-user-card">
    <time class="s-user-card--time" datetime="asked Oct 17 '16 at 20:01">asked Oct 17 '16 at 20:01</time>
    <a href="../../users/4536961/abbes-yassine" class="s-avatar s-avatar__32 s-user-card--avatar">
        <img class="s-avatar--image" src="../../users/profiles/4536961.webp" data-jdenticon-width="32" data-jdenticon-height="32" data-jdenticon-value="Abbes Yassine" />
    </a>
    <div class="s-user-card--info">
        <a href="../../users/4536961/abbes-yassine" class="s-user-card--link">Abbes Yassine</a>
        <ul class="s-user-card--awards">
            <li class="s-user-card--rep" title="reputation score">1,679</li>
            <li class="s-award-bling s-award-bling__gold" title="2 gold badges">2</li>
            <li class="s-award-bling s-award-bling__silver" title="17 silver badges">17</li>
            <li class="s-award-bling s-award-bling__bronze" title="17 bronze badges">17</li>
        </ul>
    </div>
</div>

</div>
        </div>
    </div>
</div>
                    </div>

</div>
        </div>

</div>
        </div>
        <script src="../../static/js/stack-icons.js"></script>
        <script src="../../static/js/fromnow.js"></script>
        
    </body>
</html>

Questions tagged [froala]

Resources

Licence

How do I create a signature using the imageUploadtoS3 option in Froala with Coldfusion 8?

Froala React component throwing "cannot set property 'more_btn' of undefined"

How to fix Error: Type FroalaEditorModule does not have 'ngModuleDef' property Using Froala Wysiwyg

Froala Angular Text Editor (v3) - Destroy and re-Initialize on input changes

Using the Froala editor in a Typescript/Vue project

Froala: custom HTML template for images

Calling methods in Froala wysiwyg editor for React

Rails5｜Uncaught TypeError: $(...).froalaEditor is not a function

Property 'FroalaEditor' does not exist on type 'JQueryStatic' - Angular 4

Angular and froala editor validation with reactive forms