Attributes Window Pane

This window pane is used to set attributes for a tag. Attributes let you provide additional information about tagged content and how that content should behave.

Example Following is an href attribute, which is used for links. The value for this attribute is the MadCap Software website URL.

Copy

<a href="https://www.madcapsoftware.com">Click here to open the MadCap Software website.</a>

[Menu Proxy — Headings — Online — Depth3 ]

How to Open This Window Pane

Do one of the following, depending on the part of the user interface you are using:

Ribbon Select Home > Attributes Window.
Keyboard Shortcut Press SHIFT+F12.

Navigation Buttons in the Title Bar

	Lets you move the window pane from its docked position to another location in the interface. Simply click on this area and drag the window pane to the new location.
	Opens a drop-down menu with commands for moving and resizing the window pane. Close Closes the window pane. Dock Attaches the window pane to the interface if it is floating. Auto Hide "Pins" the window pane to the side of the interface so that you have more room for your workspace. You can show the window pane by hovering over the thin bar on the side of the interface. If you select this option again, the window pane returns to its previous state (no longer "pinned" to the side of the interface). Float Detaches the window pane from the application so that it becomes a free-floating element in the interface. Standard Tabs (Top) Arranges window panes so that traditional tabs are displayed at the top. Standard Tabs (Bottom) Arranges window panes so that traditional tabs are displayed at the bottom. Accordion Tabs Arranges window panes so that they are stacked with accordion tabs.
	"Pins" the window pane to the side of the interface so that you have more room for your workspace. You can show the window pane by hovering over the thin bar on the side of the interface. If you select this option again, the window pane returns to its previous state (no longer "pinned" to the side of the interface).
	Closes the window pane.

Buttons and Sections

[Tag]	Displays the tag (e.g., <h1>, <p>, <td>) that is applied to the content where the cursor is currently placed. The changes that you make in the Attributes window pane will be applied to that tagged content in that topic.
	Displays all of the attributes in the window pane.
	Displays only the attributes provided by Contributor. Your custom attributes are not displayed.
	Displays only the custom attributes that you create. Attributes provided by Contributor are not displayed.
	Opens the Enter Custom Attribute dialog, which lets you create a new attribute and provide a value for it.
	Selects the content of the parent tag each time you click this button. Example You have applied bold to a word in your topic. If the cursor is located on that word and you click this button, the content in the parent tag (e.g., <p>) will be selected. If you click the button yet again, the content in the <body> tag will be highlighted. And if you click the button once more, the content in the <html> tag will be selected.
[Attribute]	The left column in the window pane displays the attributes or events applicable to the tag where your cursor is placed. class In CSS there are primary styles that correspond to the different HTML elements (e.g., h1, h2, p, img). You can think of these as parent styles, because in a way, they can have children. A class is the most common type of child for a style. Some classes might already be included in your stylesheet. dir This indicates whether content should be displayed left-to-right (ltr) or right-to-left (rtl). id In CSS, an identifier (ID) is similar to a class, except that IDs are unique. An element in your stylesheet can have only one ID on it, whereas it can have multiple classes. And each page of your output can have only one element with a particular ID. For many authors, using an ID may not be important, but for others—such as those making use of JavaScript—IDs can be very useful. lang This indicates the language for content (e.g., English = en, French = fr). onclick (and other events) All of the elements that you see starting with the characters "on" are events, which let you specify actions that should take place when certain activity occurs (e.g., onclick = when the content is clicked, ondbclick = when the content is double-clicked). You can learn more about each of these events from here: Copy `https://www.w3schools.com/jsref/dom_obj_event.asp` style This indicates the styling applied to content inline (or locally). For example, when you use the Color button on the Home ribbon to apply a color to text, a style attribute with that color is added inline to that content. It is highly recommended that you use global styles instead of setting style attributes locally. title This specifies extra information about content (e.g., can be used as tooltip text when the mouse moves over the content).
[Value]	Use the right column in the window pane to set the value for the attribute in the left column. In the case of attributes such as the class and ID, you can simply enter the name of that class or ID that exists in your stylesheet. In the case of direction, you can select ltr or rtl from a drop-down. In the case of a language, simply enter the code for the language. For details, see: Copy `https://www.w3schools.com/tags/ref_language_codes.asp` In the case of events, you can enter a function, such as the following: Copy `window.open("http://www.madcapsoftware.com");` This particular function opens the MadCap Software website when the event takes place. In the case of style, the value could be written like the following: color: #bed420; In the case of the title, enter the text that you would like to be used for the associated content (i.e., the tooltip text).