CKEditor4: Alternative skin in inline mode - ckeditor

I want to use CKEditor4 in inline mode, but have trouble using an alternative skin (the default skin Moono works fine).
I downloaded an alternative skin and tried to activate it in config.js via:
config.skin = 'minimalist';
(I also tried some other ways (inside event handler) with the same result):
The toolbar always shows up with Moono skin -- but what makes me wondering very much is, that the skin files are definitively loaded from the alternative skin directory. Also skin.js is loaded (which is not loaded for Mono skin.

I'm not sure if it is related to what you encounter, but note that only one skin can be used on one page. So if you have two editors and one of them is initialised with the Moono skin, then the second one will use it as well. This limitations comes from the fact that all CSS selectors in skins files would need to contain skin name - otherwise they would conflict with each other.

Possibly it is a bug of the minimalist skin.
I tried an different skin and found out, that it is displayed correctly. So it seems to be a "feature" of the minimalist skin.

Related

CKEditor 4.13 - Which core or plugin are the styles (div.xyz) coming from?

In my CKEditor instance, I am seeing formatting styles added that start with div. (i.e. div.dataTables_xyz, div.dt-button-xyz, div.dtr-modal-xyz.) How can I find out which plugin is adding them? (or if it's core ckeditor, how can I remove them?)
Tried removing several plugins that I thought might be the culprit (i.e. Div Editing Area, Div Container Manager)
I would prefer not to have those styles listed, as they are numerous and will likely confuse our users.
the plugin was stylesheet parser.
https://ckeditor.com/cke4/addon/stylesheetparser

How do I change icons for builtin actions in ckeditor?

How do I change the icons for builtin actions such as subscript, superscript bold and italic?
The documentation say that I have to place the icons in the images folder in my skin, but how do I know what the image should be called?
Also, ckeditor compiles the default images into one huge file, so do I need to rebuild that icon file(how?) after placing an icon.
I am using Ckeditor 4.
All skin icons must be included inside the icons folder in the skin folder. The icons file name must match the name of the icon files available in the icons folder of the plugins.
If you want the source version of your skin to overload icons properly, you must inform CKEditor about the presence of your custom icons. This is optional, but if not done your icons will be visible in the release version of your skin only. Check the skin.js file in the Moono skin for an example.
Try clearing the cache as well.
I've just downloaded CKEditor v4.5.7 basic edition and there is a "plugins" folder by default.
Are you sure about the version used ?
After edit :
Icons are defined in the file skins/moono/editor.css and for example for Bold look after class .cke_button__bold_icon - erverything can be changed there.
In order not to edit standard files, I suggest you to create a new skin : duplicate moono folder and rename as you like and in your config.js add
config.skin = 'skin-name';

How to make UI a solid color in CKeditor 4.5

How does one make the color of the UI toolbar of CKeditor solid rather than gradient? I've search the other questions and read that I need to edit a file skins.js, but there are no js files in the skins folder.
CKEditor 4.5 is not yet out there, so my assumption is that you use latest major branch.
File you're looking for is skin.js in particular skin directory (eg. mono).
The fact that you can't find this file in given directory might be caused by using builded (minified) CKEditor.
If you did build CKEditor then skin is likely to be minified to main file (but I'm not that familiar with building, so it's my guess).
If that's the case, you need to edit source version, and build it again.

WP7 - Not picking up embedded fonts

I have been trying to use some custom fonts within my WP7 app.
I followed the example as per http://www.jeffblankenburg.com/2010/10/24/31-days-of-windows-phone-day-24-embedding-fonts/ but in my project it simply will not pick up the custom font.
I have downloaded the sample project in this example and this one does work okay.
So, I have now used the same font used in there, and included in my project. I have ensured that the properties on the file are identical (Build Action = 'Content' and Copy To Output Directory = "Always")
I have used in my XAML in exactly the same way i.e.
FontFamily="Fonts/DigitalDream.ttf#Digital Dream" FontSize="24"
But to no avail. The custom font is just ignored. Is there something that I am missing, or a setting .. anything that would allow this to work in one project, but not another?
I have discovered that it will work if my XAML page is defined at the root level, i.e. immediately under the project, but in my case I have it in a 'Views' folder.
My understanding was that
FontFamily="/Fonts/DigitalDream.ttf#Digital Dream" FontSize="24"
should start at the root folder of the project?
thanks
Custom fonts can be a little tricky. I spent several hours once trying to embed an .otf font only to find that it just didn't seem to be doable.
You're on the right track, though. A .ttf font should be embedable. It's hard to get the right combination of paths and filenames to make the font work, though.
The easiest way I've found to handle some of these more difficult "magic string" type of situations in XAML is to let Expression Blend do the heavy lifting.
Here's a blog post about using Blend to embed fonts. The nice thing about using Blend is that it gives you some visual indications that things are set up correctly--i.e. you can see the font you want in the font selection menu. This is what finally clued me in on the .otf issue. I couldn't see the font in Blend.
And here's an example of a custom font that I've used in one of my apps:
<TextBlock Name="MyTextblock"
FontFamily="/MyAppName;component/fonts/Fonts.zip#Segoe UI Mono">
That's FontFamily URI is a pain to get right. I'm pretty sure that's your problem.
I was actually having the same problem. I followed everything to the dot and still I wasn't able to embed one particular font. So I created a new project and tried embedding the font there. Still no luck. I then tried embedding some other font. And lo and behold, as soon as I typed the FontFamily attribute, I could see that it had embedded. This was particularly odd since I didn't have to change any properties of the font.
I opened the project in Blend and clicked on the font property box to the right. It took a few seconds and then it embedded the font I was having problems with in the first place.

Can I use CSS in directory listing of Firefox?

For example if I put "C:\docs" in address bar of Firefox, it shows all files in the directory. Is it possible to customize this page with CSS?
Apache 2.2 allows us to do it using IndexStyleSheet directive, so I wondered if Firefox can do it.
Firefox has a file userContent.css for each profile (found in the profile's settings folder). That file defines the standard CSS, why may then be overwritten by a website. So they also apply to directory listings.
You should have a look at the actual HTML code Firefox is creating for the directory listing to see how to do the CSS definitions right. You will find extensive documentation about userContent.css on the web.
http://www.mozilla.org/unix/customizing.html#userContent
I think the easiest way is to create an own skin which custom css. You have to modify dirListing.css in this case. (chrome://global/skin/dirListing/dirListing.css)
I know the walnut theme (https://addons.mozilla.org/en-US/firefox/addon/122) includes a modified file listing.

Resources