Changing classes

[phanna]

When working in the XML editor, how can I change the class of some text?
For example, I have some text that is currently class "p" and I want to change it to a "H2" (which exists in my stylesheet). Of course when I look at the Styles Window I can only see styles that fall under the "p" class, of which "H2" is not one.

Thanks for any help!
Cheers,
Paula

[lacastle]

Can this topic help? There are a few reasons why you may be having a problem.

http://forums.madcapsoftware.com/viewto ... f=6&t=5916

[phanna]

Unfortunately no. Unless I'm missing something on there. When I click a block or in the text, I just don't see any styles that I've created that fall under a different class ("li", "h", "table", etc)

[SteveS]

Rather than selecting text, you can just click anywhere in the paragraph (don't double click). In the styles pane (or the drop down styles list at top left of screen) you should see the heading and paragraph styles and be able to apply them.

HTH

[phanna]

That's the kind of kooky part. I wish it was working like that but I must be doing something wrong. When I click anywhere in a paragraph that for example is of class "p" such as body_text, the Style Window does not show me any styles other than what is in class "p". So I can't, for example, make the paragraph into a header or a list.

[LTinker68]

You won't be able to see the list-related styles until you click the list icon to start a list.

As for the headings, you should be able to see h1, h2, etc., as well as the regular p style and span styles. However, if the topic is not pointing to a stylesheet or if the stylesheet it is pointing to doesn't have those styles, then they won't be in the list.

Is this an imported project or a project created from scratch. I'm guessing it's the former. If it is, how many stylesheets do you have in your project?

[phanna]

Thanks Lisa. When I click the List icon, I can indeed see the list styles from my style sheet.
Now my question is how to apply JUST my list style and not the style from the List icon. It seems that when I click the List icon it applies a predefined list style to my text (depending on what you choose on that list menu). How do I JUST apply my own list style. The attached screenshot shows my style plus the Flare style applied.

liststyle.jpg

[NorthEast]

What is the list style that you set up and are trying to apply?

When you click on the list icon, this will create a numbered or bullet list.
The list will consist of a 'container' tag, ol for a numbered list and ul for a bullet list, and items in both types of list use the li tag.

If you want to alter the number or bullet style, edit (or add your own class) for the ol or ul styles.
If you need to adjust something about the list items (but not the number/bullet), e.g. spacing between lines, then alter the li style.

[phanna]

QUOTE: If you want to alter the number or bullet style, edit (or add your own class) for the ol or ul styles.

Yes this is what I want to do. Can you explain how I can edit the ol and ul styles? Is this in the Flare help somewhere?

[KevinDAmery]

What you'll need to do is edit the properties in the stylesheet. To do this, go into Content Explorer and open Resources\Stylesheets and double click on the stylesheet you are using. You can then open the appropriate tag type to modify the characteristics you need (spacing, font, margins, etc. etc.)

Flare uses a cascading stylesheet file as its stylesheet (following standards-compliant CSS rules), so you can edit it either in Flare's stylesheet editor or in a text editor if you prefer.

[phanna]

Thanks Kevin. When I do that I do indeed see the styles I want to be using. However, when I click the "list icon" in Flare, it does not use my lists it uses some out-of-the-box styles that I don't like. I can't seem to get Flare to display MY styles. I know how to edit the styles that our usability group created for us, I just can't figure out how to get Flare to show them to me (well, just the "li" ones. All the other ones show up).


paula

[PB-Bill]

I have had the same problems with changing classes, namely, I can't. I create a new class but it never appears in the style class list (when you click F12). Also, I have attempted to create a new set of autonumber classes based on FrameMaker styles without much success. You can import the Frame styles, but if you try to create a new autonumber as part of the p tag for example, the hanging indent format does not "take". help!

[NorthEast]

Thanks Kevin. When I do that I do indeed see the styles I want to be using. However, when I click the "list icon" in Flare, it does not use my lists it uses some out-of-the-box styles that I don't like. I can't seem to get Flare to display MY styles. I know how to edit the styles that our usability group created for us, I just can't figure out how to get Flare to show them to me (well, just the "li" ones. All the other ones show up).

:(
paula

Can you give us an example what these styles are that you've set up? Have you set the properties for the straight ol, ul, or li tags; or have you set up classes of these tags, such as ol.yourstyle, ul.yourstyle?

If you have set up classes for the ul or ol tags and don't know how to apply them, then right-click on the tag in the editor and select Style Class > ....

[KevinDAmery]

For both Paula and Bill, if you could post the relevant parts of your stylesheets we may be able to see the problem.

[LTinker68]

BTW, I don't think you'll ever see the <ol> or <ul>-specific classes in the Styles pane, because as soon as you invoke the list you're in the <li> tag, so you see list-item related styles, not list-group related styles. You can apply a custom <ol> or <ul> style to the whole list by right-clicking on the <ol> or <ul> block in the show blocks area, then select the class from the menu that appears.

But if you made a custom <ol> or <ul> style and that's the style you're looking for, then just be aware that you probably won't ever see that style in the Styles pane.

[phanna]

Hi Kevin,

Here are some examples of the lists in my style sheet. I hope this helps! Thanks for all your help (everyone on this thread)
li.BU1_BulletedLevel1
{
text-align: left;
margin: 4pt 0 8pt 32pt;
font-family: Georgia;
font-weight: normal;
font-style: normal;
font-size: 10pt;
letter-spacing: 0em;
color: #5e5e5e;
mc-auto-number-format: '• ';
mc-auto-number-position: outside-head;
mc-auto-number-offset: 24px;
mc-auto-number-class: BU_BulletFont;
line-height: 11.5pt;
text-decoration: none;
}


li.N1_NumberedLevel1
{
text-align: left;
margin: 4pt 0 8pt 32pt;
font-family: Georgia;
font-weight: normal;
font-style: normal;
font-size: 10pt;
letter-spacing: 0em;
color: #333;
mc-auto-number-format: 'N: {n+}{ =0}{ =0}. ';
mc-auto-number-position: outside-head;
mc-auto-number-offset: 24px;
mc-auto-number-class: SN_StepNumber;
line-height: 14pt;
text-decoration: none;
}

li.N2_NumberedLevel2
{
text-align: left;
margin: 6pt 0 0 48pt;
font-family: Georgia;
font-weight: normal;
font-style: normal;
font-size: 9pt;
letter-spacing: 0em;
color: #333;
mc-auto-number-format: 'N:{n+}{ =0}{ =0}. ';
mc-auto-number-position: outside-head;
mc-auto-number-offset: 24px;
mc-auto-number-class: SN_StepNumber;
line-height: 14pt;
text-decoration: none;
}

[KevinDAmery]

Ok--so you don't see those at all in your style list? I don't see anything wrong from a code point of view, and they are LI classes so if you have a list item selected they should be visible.

Just to make sure, can you confirm that your topics / targets / etc. are pointing at this stylesheet and not at the default Flare one? (Which would be called Styles.css)

[phanna]

Hi Kevin,

I just double checked and I am using the correct style sheet. Dang! It would almost be better if it was incorrect.

Anyway, just to clarify, I can see my styles in the Style list when I have a list item selected. The issue is this:
* To create a list item I have to click the List icon

listicon.jpg

(please let me know if that is incorrect).
* This creates an li tag and applies some default formatting.
* Now I can see my li styles in the Style List.
* I apply my style, for example Numbered_Level1
* My style gets applied but the default style also remains so now I have 2 style applied. This is the sad part.

Here's a screenshot of what happens.

liststyle.jpg

Thanks!
Paula

[LTinker68]

* I apply my style, for example Numbered_Level1

What are the steps you use to apply your style class?

[PB-Bill]

Hi all,

Here is an example of the numbered style I am trying to use:

p.autonumber1 (to start the numbering at 1) I intend to export this to Frame. This works properly but does not wrap the text. If you change the auto-number position to outside-head (as recommended in the help), it loses the numbering altogether.
p.autonumber is incremental autonumber. This increments properly, but again the wrap is incorrect.

p.autonumber1
{
mc-auto-number-format: '{n=1}.';
mc-auto-number-offset: 24px;
mc-auto-number-position: inside-head;
}

p.autonumber
{
mc-auto-number-format: '{n+}.';
mc-auto-number-offset: 24px;
mc-auto-number-position: inside-head;

Thanks for your help.

[phanna]

Hey Lisa,

The step I use to apply the class are:
* click on the line I want to format
* In the Style List, select the class I want to use.

Maybe that's wrong? (hopefully)

[LTinker68]

If you left-click in a line without selecting any text, then you'll see the available list styles in the Styles pane, and you should be able to click on the style you want. It sounds like that's what you're doing.

You say that when you apply your style, you still see the default style. I'm not quite clear what you mean by that -- it's not entirely clear in your screenshots what part is your style and which is the default. But I want to make one thing clear... If you don't specify a particular property in your custom class, then the value for that property will be supplied by the parent tag. For example, if a particular property is not specified in the li.BU1_BulletedLevel1 class, then the property will be pulled from the <li> tag style. If that property is not specified in the <li> tag, then it'll use the default behavior for that property (which can vary between browsers). So if you see a behavior that you don't like in your custom tag, then you may have to specify a value for that property so that it doesn't use the default <li> style for that property.

Hopefully that makes sense.

[phanna]

If you left-click in a line without selecting any text, then you'll see the available list styles in the Styles pane, and you should be able to click on the style you want. It sounds like that's what you're doing.

Yes that's what I'm doing and I am able to click the style and it gets applied.

You say that when you apply your style, you still see the default style. I'm not quite clear what you mean by that -- it's not entirely clear in your screenshots what part is your style and which is the default. But I want to make one thing clear... If you don't specify a particular property in your custom class, then the value for that property will be supplied by the parent tag.

For example, if a particular property is not specified in the li.BU1_BulletedLevel1 class, then the property will be pulled from the <li> tag style. If that property is not specified in the <li> tag, then it'll use the default behavior for that property (which can vary between browsers). So if you see a behavior that you don't like in your custom tag, then you may have to specify a value for that property so that it doesn't use the default <li> style for that property

Ah okay, here are a few other screenshots that hopefully are clearer.

* The only way I know of to get a list style is to click the list icon.

listicon.jpg

* When I click this icon, formatting is applied and I can then see my own li styles in the Style List.

liststyle.jpg

* When I left click the line of text that I want to apply my formatting to and select the style from the Style List, my style gets applied BUT the original style also remains.

2styles.jpg

Hopefully this is clearer
Thanks for all your help.
Paula

[LTinker68]

Ah hah! Now I get it.

The problem is you're supplying a bullet as part of the auto-numbering properties, but the standard (default) bullet is still being supplied by the <ul> tag. When you need to do is set the list-style-type property of the li.BU1_BulletedLevel1 class to "none". This will stop the <ul> tag from supplying its default bullet.

NOTE: When you do that, the XML Editor will display a number instead of a bullet. That's a glitch in the XML Editor. When you Preview the topic or build the output, the bullet/number are gone and your auto-numbering bullet is shown.

[LTinker68]

Oops, I take back one of my comments from the previous post. The reason why the XML Editor is displaying the two bullets on the same line is probably because the bullet is being called by the <ul> tag and by the auto-numbering properties of your <li> tag. However, you don't actually have to set the list-style-type to "none". If you Preview or compile your project, then you'll see that you only have one bullet, not two. So it turns out it's an XML Editor display problem, not a problem in how you defined your style.

I suggest you submit a bug report regarding this. Report it at http://www.madcapsoftware.com/bugs/submit.aspx and reference this post (paste the URL into the bug report).