C) Right clicked on the stylesheet, selected "Create", Named it "Left Aligned Image" added the class name as the alias (.alignleft) and copied the style whithout the brackets:
Now, it appears on the styles dropdown, the problem is that i select an image and try to apply the style (selecting it from the dropdownlist) and nothing happens. The dropdown goes back to the "Styles" item and no class is applyed to the image.
I believe i could do this on previous versions. Is that happening with someone else?
I'm having the exact same problem. My styles show up in the dropdown, but when I select them, it just goes back to the "Styles" item without applying the style. Did you ever figure out what was wrong? Thanks!
When you want to add styles to the "styles" dropdown you need to do the following
1) Go to the "Settings section"
2) Add the RTE stylesheet to the "Stylesheet" folder
3) Right click the stylesheet you just created to add a stylesheet property (This could be for a My Custom Style, so name it MyCustomStyle for instance).
4) Now you have a name and an alias field and a text-field where you can enter some css. In the name field the name, should be. Right now it will say "MyCustomStyle" if that is what you chose to call the property. This is what is being displayed in the dropdown.
Now pay attention! :) - The alias field is where the magic happens! If I remember correctly the alias is also prefilled with the name "MyCustomStyle". Since this is not an element that should be wrapped around a selected text in the Rich text editor, but a class you want to apply then you need to modify this by adding the before mentioned dot (.) - So in the alias it should read ".MyCustomStyle".
5) You can enter some CSS for the style in here. I must admit that I usually don't do this since I just add the class names in my default.css instead making it a bit easier to remember where styles are applied.
6) To enable the dropdown you need to go to the "developer" section
7) Go to the "Datatypes" folder and expand it. Click on the "Rich text editor" datatype.
8) Select the stylesheet you just created in the steps above to be used with the Rich text editor and hit "save".
9) Now you should be able to see the styles you added when you go to a node that has a rich text editor :-)
One final note - in step 4 you could also create elements and then you don't need to add the dot before the name. If you for instance wish to add a heading 1 (H1) then You can have "heading 1" as the name and in the alias field it should just read "h1". This will make sure the text you choose to be styled as a h1, will be wrapped in the <h1> tag in the source.
I hope the above answers your question. Otherwise just let us know :-)
Can't get styles dropdown to work as expected
I've being trying this for a long time with no success.
A) I added a stylesheet to the edit following instructions i got from here.
B) After that i created a class as following:
.alignleft { float: left; margin-right: 20px; margin-bottom: 10px; }
C) Right clicked on the stylesheet, selected "Create", Named it "Left Aligned Image" added the class name as the alias (.alignleft) and copied the style whithout the brackets:
float: left; margin-right: 20px; margin-bottom: 10px;
Now, it appears on the styles dropdown, the problem is that i select an image and try to apply the style (selecting it from the dropdownlist) and nothing happens. The dropdown goes back to the "Styles" item and no class is applyed to the image.
I believe i could do this on previous versions. Is that happening with someone else?
I'm using umbraco 4.5.
I'm having the exact same problem. My styles show up in the dropdown, but when I select them, it just goes back to the "Styles" item without applying the style. Did you ever figure out what was wrong? Thanks!
BUMP! Got this problem as well..
My solution is running at 4.0.3..
Any News Bryan ?
It's been a while, but I think it had something to do with me putting a superfluous "p" at the start of the rules.
I found out, that you have to put a "." (dot) before the alias.. :) (thanks for all the posts)
/Djan
Can anyone expand on Djan's explanation? I've run into the same problem of the "Styles" dropdown not functioning.
Thx,
< Sean />
Hi Sean
When you want to add styles to the "styles" dropdown you need to do the following
1) Go to the "Settings section"
2) Add the RTE stylesheet to the "Stylesheet" folder
3) Right click the stylesheet you just created to add a stylesheet property (This could be for a My Custom Style, so name it MyCustomStyle for instance).
4) Now you have a name and an alias field and a text-field where you can enter some css. In the name field the name, should be. Right now it will say "MyCustomStyle" if that is what you chose to call the property. This is what is being displayed in the dropdown.
Now pay attention! :) - The alias field is where the magic happens! If I remember correctly the alias is also prefilled with the name "MyCustomStyle". Since this is not an element that should be wrapped around a selected text in the Rich text editor, but a class you want to apply then you need to modify this by adding the before mentioned dot (.) - So in the alias it should read ".MyCustomStyle".
5) You can enter some CSS for the style in here. I must admit that I usually don't do this since I just add the class names in my default.css instead making it a bit easier to remember where styles are applied.
6) To enable the dropdown you need to go to the "developer" section
7) Go to the "Datatypes" folder and expand it. Click on the "Rich text editor" datatype.
8) Select the stylesheet you just created in the steps above to be used with the Rich text editor and hit "save".
9) Now you should be able to see the styles you added when you go to a node that has a rich text editor :-)
One final note - in step 4 you could also create elements and then you don't need to add the dot before the name. If you for instance wish to add a heading 1 (H1) then You can have "heading 1" as the name and in the alias field it should just read "h1". This will make sure the text you choose to be styled as a h1, will be wrapped in the <h1> tag in the source.
I hope the above answers your question. Otherwise just let us know :-)
/Jan
^ What he said! :) especially no.4 !
Awesome, thanks for the help. I've got it functioning at this point. :-)
Hi Sean
Happy to hear you were able to move on.
It's the alias stuff with setting custom classes that is most often confusing people when adding the styles in the dropdown. Been there myself :-)
/Jan
is working on a reply...