nm got it - vsadmin/froala

Froala Looks great. Love the new goodies!

Hi, it's quite easy. In the download, you should have a vsadmin folder. In that folder is the froala folder. Upload that folder to your vsadmin folder.
Then set the editor in your includes and that's it.
$htmleditor="froala";

I did find some instructions here on the download page - https://www.ecommercetemplates.com/free_downloads.asp#htmleditor

I think there is some definite Froala CSS issues...
From what I see the editor is using adminstyle.css which can give undesirable rules such as when you choose an H3, it puts a blue box for background and white lettering inside of it. Also, the H2 tag puts a dotted line below it, and make the text all caps... the Italicize button does not work in the editor, and many more. These things do not apply when you save the page because what shows on the actual site are the styles from the main stylesheet of the website. Now, how I fixed SOME of these issues was to add to the froala_editor.css file with some lines of CSS that overrides the adminstyle.css such as:

h1 { font-size: 30px; color: #354E5D; font-weight:bold; }
h2 { font-size: 24px; color: #354E5D; text-transform: none; border-bottom:none; margin:0; padding:0; }
h3 { font-size: 18px; color: #354E5D; background-color: white; margin:0; padding:0; }
h4 { font-size: 16px; color: #354E5D; margin:0; padding:0; }
em { font-style: italic; }

Yes, its a hack. What we really need is to have somewhere that Froala can connect to the main stylesheet of the website (like ckeditors config.js file) so that the editor shows styles that will be seen on the website itself. In other words the editor should look like what the output will be. If there is such a setting or file, I cannot find it.

Please help.


Tim Gorski

Hi Tim

I hadn't noticed that before but see it now. Vince is currently away on vacation but I'll see if that can be addressed when he's back.

Andy

Please feel free to review / rate our software

Has anyone looked into this CSS issue yet? Please let us know. Thanks

Tim Gorski

Hi Tim

Vince contacted Froala support about it and the solution they suggested wouldn't work in a textarea field so we're waiting on the follow up as far as I'm aware.

Andy

Please feel free to review / rate our software

We have a solution now so that Froala will now use the site CSS files for the editor. You need the new updater and there is also a new version of the Froala editor available with bug fixes...
https://www.ecommercetemplates.com/free_downloads.asp#htmleditor

Vince

Click Here for Shopping Cart Software
Click Here to sign up for our newsletter
Click Here for the latest updater

Hi Vince, just ran the v7.0.0 updater and great to see you now have the Fullscreen button working in Froala. [quote]We have a solution now so that Froala will now use the site CSS files for the editor[/quote]Your solution presumes the "site CSS files" will be named:
(1) ../css/ectstyle.css
(2) ../css/style.css
which in most cases will just not be so. And we really don't wont to be loading heaps of styles not relevant to the "article" area in a webpage. Many will then also run into website background images and colors appearing inside the Froala editor; the same issues raised here before whenever CK Editor loaded entire website CSS.

Can't we just create one "../css/froalacustom.css" stylesheet that contains a few basic Heading, Paragraph and Layout styles for Froala to use inside the Admin Panel, exactly the same as CK Editor worked using the "ckeditor.css" stylesheet ??

- - - - - - - - - - - - - - - - - - - -
Edit: Just created and uploaded a custom "style.css". Froala loads and displays the styles I entered into that sheet just fine inside the Admin Panel. But when you select a paragraph (or span) of text, there is really no way to apply any custom CSS style to it, apart from a manual code edit. No toolbar dropdown menu to open containing a list of your Paragraph, Heading, Custom style names, like we have in CK Editor.

The Froala "Paragraph Format" and "Paragraph Style" menu entries are hard coded in the plugin "[purple]paragraph_format.min.js[/purple]" and "[purple]paragraph_style.min.js[/purple]" javascript files.
"[purple]font_size.min.js[/purple]" defines font sizing adjustments in pixels. For responsive design, percentage is the shot, which I guess could be resolved by editing that file.

Those are some basic issues I found with Froala, which leave it behind the more customisable CK Editor.

Gary
[img]https://itzap.com.au/pics/logo/itzap-website-design-works-mini-logo.png[/img]

What is the proper syntax for the includes

Does it not have to be something like

$GLOBALS['htmlfroala']=TRUE;

Doesn't the includes have to be something like

$GLOBALS['htmlfroala']=TRUE;

can not get this working

For wordpress users that would be

$GLOBALS['htmleditor']="froala";

Andy

Please feel free to review / rate our software

I found this on another thread that I assume was meant to be a follow up here

quote:

---

Thanks Andy

Yes now I can see this working fine on my desktop... however the end user sees the editor but when trying to use any of the functions nothing works? Any suggestions?

---

Can you send me an email with the control panel login and I'll take a look?

Andy

Please feel free to review / rate our software