Wikiwyg Toolbar


Home: Socialtext Style Customization Guide
Up: Styling The Edit Window
Previous: Edit Toolbar
Next: Styling The List View


editwindow-wikiwyg-toolbar.png

HTML Snippet

<div id="st-page-editing-toolbar">
  <div style="display: block;" id="wikiwyg_toolbar" class="wikiwyg_toolbar">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/bold.gif" title="Bold (Ctrl+b)" alt="Bold (Ctrl+b)" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/italic.gif" title="Italic (Ctrl+i)" alt="Italic (Ctrl+i)" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/strike.gif" title="Strike Through (Ctrl+d)" alt="Strike Through (Ctrl+d)" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/separator.gif" title="" alt=" | " class="wikiwyg_separator">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/h1.gif" title="Heading 1" alt="Heading 1" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/h2.gif" title="Heading 2" alt="Heading 2" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/h3.gif" title="Heading 3" alt="Heading 3" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/h4.gif" title="Heading 4" alt="Heading 4" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/p.gif" title="Normal Text" alt="Normal Text" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/separator.gif" title="" alt=" | " class="wikiwyg_separator">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/hr.gif" title="Horizontal Rule" alt="Horizontal Rule" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/separator.gif" title="" alt=" | " class="wikiwyg_separator">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/ordered.gif" title="Numbered List" alt="Numbered List" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/unordered.gif" title="Bulleted List" alt="Bulleted List" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/outdent.gif" title="Less Indented" alt="Less Indented"  class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/indent.gif" title="More Indented" alt="More Indented" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/separator.gif" title="" alt=" | " class="wikiwyg_separator">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/link.gif" title="Create Link" alt="Create Link" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/www.gif" title="External Link" alt="External Link" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/unlink.gif" title="Unlink" alt="Unlink" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/attach.gif" title="Link to Attachment" alt="Link to Attachment" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/image.gif" title="Include an Image" alt="Include an Image" class="wikiwyg_button">
    <img src="/static/1.99.99.12/images/wikiwyg_icons/table.gif" title="Create Table" alt="Create Table" class="wikiwyg_button">
  </div>
</div>
<div id="st-page-editing-uploadbutton">
  <img src="/static/1.99.99.12/images/wikiwyg_icons/separator.gif" style="float: left;">
  <table class="button-table">
    <tbody>
      <tr>
        <td>
          <div class="button-straight">
            <div class="button-straight-right-top">
              <div class="button-straight-left-bottom">
                <div class="button-straight-right-bottom">
                  <div class="button-content">
                    <a id="st-edit-mode-uploadbutton" href="#" title="Click this button to upload a file to the page">Upload&nbsp;files</a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </tbody>
  </table>
</div>

CSS Selectors

See Standard Button for the CSS selectors for the "Upload Files" button.

#st-page-editing-toolbar
#wikiwyg_toolbar
div.wikiwyg_toolbar
img.wikiwyg_button
img.wikiwyg_separator
#st-page-editing-uploadbutton
#st-edit-mode-uploadbutton