Settings - Login - Register - Help
Search

Quick jump:  What's new

 
Go to:
 
Weblog: Style Guide 
in Socialtext Documentation
Earlier entries
Your Workspaces

Home: Socialtext Style Customization Guide
Up: Styling The Dashboard
Previous: Your Watchlist
Next: Styling The Page View

dashboard-yourworkspaces.png

HTML Snippet

The sample only shows 2 rows.

<div class="st-homepage-simplelist" id="st-wikis">
  <div class="st-homepage-simplelist-header" id="st-wikis-header">
    <table class="button-table">
      <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-newwiki-link" href="?action=workspaces_create" title="Click this button to create a new workspace">New Workspace</a>

                  </div>
                </div>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
    <div class="st-homepage-section-title st-homepage-simplelist-title" id="st-wikis-title">
      <a href="?action=workspaces_listall" id="st-wikis-title-link" class="st-homepage-simplelist-title-link">Your workspaces</a>
    </div>
  </div>
  <div id="st-wikis-content" class="st-homepage-section">
    <table class="st-homepage-simplelist-table">
      <tbody>
        <tr class="st-homepage-simplelist-row-odd">
          <td class="st-homepage-simplelist-left">
            <a href="/corp">Socialtext</a>
          </td>
          <td class="st-homepage-simplelist-right" nowrap="nowrap">
            <a href="/corp/index.cgi?action=recent_changes">211 changes</a>
          </td>
        </tr>
        <tr class="st-homepage-simplelist-row-odd">
          <td></td>
          <td></td>
        </tr>
        <tr class="st-homepage-simplelist-row-even">
          <td class="st-homepage-simplelist-left">
            <a href="/testspace">Help</a>
          </td>
          <td class="st-homepage-simplelist-right" nowrap="nowrap">
            <a href="/testspace/index.cgi?action=recent_changes">57 changes</a>
          </td>
        </tr>
        <tr class="st-homepage-simplelist-row-even">
          <td></td>
          <td></td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

CSS Selectors

Selectors for the button are described at Standard Button.

#st-wikis
div.st-homepage-simplelist
#st-wikis-header
div.st-homepage-simplelist-header
#st-wikis-title
div.st-homepage-section-title
div.st-homepage-simplelist-title
a.st-homepage-simplelist-title-link
#st-wikis-content
div.st-homepage-section
table.st-homepage-simplelist-table
tr.st-homepage-simplelist-row-odd
td.st-homepage-simplelist-left
td.st-homepage-simplelist-left a
td.st-homepage-simplelist-right
td.st-homepage-simplelist-right a
tr.st-homepage-simplelist-row-even
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
Your Watchlist List View

Home: Socialtext Style Customization Guide
Up: Styling The List View
Previous: What's New List View
Next: Recently Viewed List View

yourwatchlist-listview.gif

HTML Snippet

<div>
  <div id="st-list-title">
    Pages You're Watching
    <a href="/feed/workspace/css-guide-2?watchlist=default"><img border="0" src="/static/1.99.99.11/images/feed-icon-14x14.png"/></a>
  </div>
  <div id="st-listtools">
    <ul class="level1">
      <li class="submenu"><span id="st-listtools-export">Export</span>
        <ul class="level2">
          <li class="first"><a title="Create PDF document from selected pages" id="st-listview-submit-pdfexport" href="#">Export checked to PDF</a></li>
          <li class="separator"><a title="Create Word document from selected pages" id="st-listview-submit-rtfexport" href="#">Export checked to Word</a></li>
        </ul>
      </li>
    </ul>
  </div>
  <div id="st-actions-bar-spacer-clear">&nbsp;</div>
</div>

<table id="st-watchlist-content" class="query-results-content">
  <tr id="st-watchlist-header-row" class="query-results-header-row">
    <th id="st-watchlist-header-watchlist" class="query-results-header-watchlist">
    </th>
    <th id="st-watchlist-header-title" class="query-results-header-title">
      <a href="?action=watchlist;sortby=Subject;direction=0">Title</a>
    </th>
    <th id="st-watchlist-header-last-edited-by" class="query-results-header-last-edited-by">
      <a href="?action=watchlist;sortby=From;direction=0">Last Edited By</a>
    </th>
    <th id="st-watchlist-header-date" class="query-results-header-date">
      <a href="?action=watchlist;sortby=Date;direction=0">Date</a>
    </th>
    <th id="st-watchlist-header-revisions" class="query-results-header-revisions">
      <a href="?action=watchlist;sortby=revision_count;direction=1">Revisions</a>
    </th>
  </tr>
  <tr class="st-watchlist-row query-results-row w-st-even-row">
    <td class="st-watchlist-row-watchlist query-results-row-watchlist">
       <img src="/static/1.99.99.11/images/st/pagetools/watch-on-list.gif" alt="styling_the_dashboard" class="watchlist-list-toggle" />
    </td>
    <td class="st-watchlist-row-title query-results-row-title">
      <a class="st-watchlist-row-title-link query-results-row-title-link" href="index.cgi?styling_the_dashboard" title="">Styling The Dashboard</a>
    </td>
    <td class="st-watchlist-row-last-edited-by query-results-row-last-edited-by">Shawn Devlin</td>
    <td class="st-watchlist-row-date query-results-row-date">Oct 25 9:33am</td>
    <td class="st-watchlist-row-revisions query-results-row-revisions">
      <a href="index.cgi?action=revision_list;page_name=styling_the_dashboard">4</a>
    </td>
  </tr>
  <tr class="st-watchlist-row query-results-row w-st-odd-row">
    <td class="st-watchlist-row-watchlist query-results-row-watchlist">
       <img src="/static/1.99.99.11/images/st/pagetools/watch-on-list.gif" alt="what_s_new" class="watchlist-list-toggle" />
    </td>
    <td class="st-watchlist-row-title query-results-row-title">
      <a class="st-watchlist-row-title-link query-results-row-title-link" href="index.cgi?what_s_new" title="">What's New</a>
    </td>
    <td class="st-watchlist-row-last-edited-by query-results-row-last-edited-by">Shawn Devlin</td>
    <td class="st-watchlist-row-date query-results-row-date">Oct 25 9:24am</td>
    <td class="st-watchlist-row-revisions query-results-row-revisions">
      <a href="index.cgi?action=revision_list;page_name=what_s_new">3</a>
    </td>
  </tr>
</table>

CSS Selectors

#st-list-title
#st-listtools
#st-listtools ul.level1
#st-listtools ul.level1 li.submenu
span#st-listtools-export
#st-listtools ul.level2
#st-listtools ul.level2 li.first
a#st-listview-submit-pdfexport
#st-listtools ul.level2 li.separator
a#st-listview-submit-rtfexport
div#st-actions-bar-spacer-clear
#st-watchlist-content
table.query-results-content
#st-watchlist-header-row
tr.query-results-header-row

#st-watchlist-header-watchlist
th.query-results-header-watchlist

#st-watchlist-header-title
th.query-results-header-title

#st-watchlist-header-last-edited-by
th.query-results-header-last-edited-by

#st-watchlist-header-date
th.query-results-header-date

#st-watchlist-header-revisions
th.query-results-header-revisions

tr.st-watchlist-row 
tr.query-results-row
tr.w-st-even-row
tr.w-st-odd-row

td.st-watchlist-row-watchlist
td.query-results-row-watchlist

td.st-watchlist-row-title
td.query-results-row-title

td.st-watchlist-row-last-edited-by
td.query-results-row-last-edited-by

td.st-watchlist-row-date
td.query-results-row-date

td.st-watchlist-row-revisions
td.query-results-row-revisions
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
Your Watchlist

Home: Socialtext Style Customization Guide
Up: Styling The Dashboard
Previous: What's New Page
Next: Your Workspaces

dashboard-watchlist.png

HTML Snippet

The sample only shows 2 rows.

<div class="st-homepage-simplelist" id="st-watchlist">
  <div class="st-homepage-simplelist-header" id="st-watchlist-header">
    <div class="st-homepage-section-title st-homepage-simplelist-title" id="st-watchlist-title">
      <a href="?action=display_watchlist" id="st-watchlist-title-link" class="st-homepage-simplelist-title-link">Your watchlist</a>
    </div>
  </div>
  <div id="st-watchlist-content" class="st-homepage-section">
   <table class="st-homepage-simplelist-table">
     <tbody>
       <tr class="st-homepage-simplelist-row-odd">
         <td colspan="2" class="st-homepage-simplelist-left">
           <a href="index.cgi?styling_the_dashboard" title="(1 hour)...">Styling The Dashboard</a>
           <div class="st-homepage-whatsnew-attribution">
             Last edited by <span class="st-homepage-whatsnew-author">Socialtext User</span> on <span class="st-homepage-whatsnew-date">Oct 25 7:29am</span>
           </div>
         </td>
       </tr>
       <tr class="st-homepage-simplelist-row-odd">
         <td></td>
         <td></td>
       </tr>
       <tr class="st-homepage-simplelist-row-even">
         <td colspan="2" class="st-homepage-simplelist-left">
           <a href="index.cgi?what_s_new" title="(2 minutes) Home...">What's New</a>
           <div class="st-homepage-whatsnew-attribution">
             Last edited by <span class="st-homepage-whatsnew-author">Socialtext User</span> on <span class="st-homepage-whatsnew-date">Oct 25 8:51am</span>
           </div>
         </td>
       </tr>
       <tr class="st-homepage-simplelist-row-even">
         <td></td>
         <td></td>
       </tr>
     </tbody>
   </table>
  </div>
</div>

CSS Selectors

#st-watchlist
div.st-homepage-simplelist
#st-watchlist-header
div.st-homepage-simplelist-header
#st-watchlist-title
div.st-homepage-section-title 
div.st-homepage-simplelist-title
#st-watchlist-title-link
a.st-homepage-simplelist-title-link
#st-watchlist-content
div.st-homepage-section
table.st-homepage-simplelist-table
tr.st-homepage-simplelist-row-odd
td.st-homepage-simplelist-left
td.st-homepage-simplelist-left a
div.st-homepage-whatsnew-attribution
span.st-homepage-whatsnew-author
span.st-homepage-whatsnew-date
tr.st-homepage-simplelist-row-even
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
Your Notepad

Home: Socialtext Style Customization Guide
Up: Styling The Dashboard
Previous: Announcements And Links Box
Next: Did You Know

dashboard-notepad.png

HTML Snippet

<div id="st-personal-notes" class="st-homepage-section">
  <div class="st-homepage-notes-edit" id="st-personal-notes-edit">
    <a id="st-personal-notes-edit-link" href="index.cgi?action=..." class="st-homepage-notes-edit-link">
      edit
    </a>
  </div>
  <div id="st-personal-notes-title" class="st-homepage-section-title">
    <a href="index.cgi?action=preferences_settings;preferences_class_id=favorites">Your Notepad</a>
  </div>
  <div id="st-personal-notes-content" class="st-homepage-notes-content">
    <!-- content -->
  </div>
</div>

CSS Selectors

#st-personal-notes
div.st-homepage-section
#st-personal-notes-edit
div.st-homepage-notes-edit
#st-personal-notes-edit-link
#st-personal-notes-title
div.st-homepage-section-title
div.st-homepage-section-title a
#st-personal-notes-content
div.st-homepage-notes-content
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
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
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
What's New Page

Home: Socialtext Style Customization Guide
Up: Styling The Dashboard
Previous: Did You Know
Next: Your Watchlist

dashboard-whatsnew.png

HTML Snippet

The sample only shows 2 rows.

<div class="st-homepage-simplelist" id="st-whats-new">
  <div class="st-homepage-simplelist-header" id="st-whats-new-header">
    <table class="button-table">
      <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-newpage-link" href="?action=new_page" title="Click this button to create a new page">New Page</a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
    <div class="st-homepage-section-title st-homepage-simplelist-title" id="st-whats-new-title">
      <a href="?action=recent_changes" id="st-whats-new-title-link" class="st-homepage-simplelist-title-link">What's new in Socialtext 2.0 Custom CSS guide</a>
    </div>
  </div>
  <div id="st-whats-new-content" class="st-homepage-section">
    <table class="st-homepage-simplelist-table">
      <tbody>
        <tr class="st-homepage-simplelist-row-odd">
          <td colspan="2" class="st-homepage-simplelist-left">
            <a href="index.cgi?styling_the_dashboard" title="(1 minute) Home [Socialtext Style Customization Guide] Previous [Using Your Own Logo] Next [Dashboard]  Dashboa...">Styling The Dashboard</a>
            <div class="st-homepage-whatsnew-attribution">
              Last edited by <span class="st-homepage-whatsnew-author">Socialtext User</span> on <span class="st-homepage-whatsnew-date">Oct 25 7:29am</span>
            </div>
          </td>
        </tr>
        <tr class="st-homepage-simplelist-row-odd">
        </tr>
        <tr class="st-homepage-simplelist-row-even">
          <td colspan="2" class="st-homepage-simplelist-left">
            <a href="index.cgi?getting_started" title="(1 day) Home [Socialtext Style Customization Guide] Previous [Installing Styles into Your Workspace] Next [N...">Getting Started</a>
            <div class="st-homepage-whatsnew-attribution">Last edited by <span class="st-homepage-whatsnew-author">Socialtext User</span> on <span class="st-homepage-whatsnew-date">Oct 23 1:56pm</span>
            </div>
          </td>
        </tr>
        <tr class="st-homepage-simplelist-row-even">
        </tr>
      </tbody>
    </table>
  </div>
</div>

CSS Selectors

See Standard Button for the button selectors.

#st-whats-new
div.st-homepage-simplelist
#st-whats-new-header
div.st-homepage-simplelist-header
#st-whats-new-title
div.st-homepage-section-title
div.st-homepage-simplelist-title
#st-whats-new-title-link
a.st-homepage-simplelist-title-link
#st-whats-new-content
div.st-homepage-section
table.st-homepage-simplelist-table
tr.st-homepage-simplelist-row-odd
td.st-homepage-simplelist-left
td.st-homepage-simplelist-left a
div.st-homepage-whatsnew-attribution
span.st-homepage-whatsnew-author
span.st-homepage-whatsnew-date
tr.st-homepage-simplelist-row-even
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
What's New List View

Home: Socialtext Style Customization Guide
Up: Styling The List View
Previous: List Tabs
Next: Your Watchlist List View

whatsnew.gif

HTML Snippet

The snippet only contains 2 rows.

<div>
  <div id="st-list-title">
    Changes in Last Week (30)
    <a href="/feed/workspace/css-guide-2?watchlist=default"><img border="0" src="/static/1.99.99.11/images/feed-icon-14x14.png"/></a>
  </div>
  <div id="st-listtools">
    <ul class="level1">
      <li class="submenu"><span id="st-listtools-export">Export</span>
        <ul class="level2">
          <li class="first"><a title="Create PDF document from selected pages" id="st-listview-submit-pdfexport" href="#">Export checked to PDF</a></li>
          <li class="separator"><a title="Create Word document from selected pages" id="st-listview-submit-rtfexport" href="#">Export checked to Word</a></li>
        </ul>
      </li>
    </ul>
  </div>
  <div id="st-actions-bar-spacer-clear">&nbsp;</div>
</div>


<table id="st-recent_changes-content" class="query-results-content">
  <tr id="st-recent_changes-header-row" class="query-results-header-row">
    <th id="st-recent_changes-header-title" class="query-results-header-title">
      <a href="?action=recent_changes;changes=;sortby=Subject;direction=0">Title</a>
    </th>
    <th id="st-recent_changes-header-last-edited-by" class="query-results-header-last-edited-by">
      <a href="?action=recent_changes;changes=;sortby=From;direction=0">Last Edited By</a>
    </th>
    <th id="st-recent_changes-header-date" class="query-results-header-date">
      <a href="?action=recent_changes;changes=;sortby=Date;direction=0">Date</a>
    </th>
    <th id="st-recent_changes-header-revisions" class="query-results-header-revisions">
      <a href="?action=recent_changes;changes=;sortby=revision_count;direction=1">Revisions</a>
    </th>
  </tr>
  <tr class="st-recent_changes-row query-results-row w-st-even-row">
    <td class="st-recent_changes-row-title query-results-row-title">
        <a class="st-recent_changes-row-title-link query-results-row-title-link" href="index.cgi?styling_the_list_view" title="">Styling The List View</a>
    </td>
    <td class="st-recent_changes-row-last-edited-by query-results-row-last-edited-by">Shawn Devlin</td>
    <td class="st-recent_changes-row-date query-results-row-date">Oct 25 12:15pm</td>
    <td class="st-recent_changes-row-revisions query-results-row-revisions">
      <a href="index.cgi?action=revision_list;page_name=styling_the_list_view">2</a>
    </td>
  </tr>
  <tr class="st-recent_changes-row query-results-row w-st-odd-row">
    <td class="st-recent_changes-row-title query-results-row-title">
      <a class="st-recent_changes-row-title-link query-results-row-title-link" href="index.cgi?page_boxes_toggle" title="">page boxes toggle</a>
    </td>
    <td class="st-recent_changes-row-last-edited-by query-results-row-last-edited-by">Shawn Devlin</td>
    <td class="st-recent_changes-row-date query-results-row-date">Oct 25 11:48am</td>
    <td class="st-recent_changes-row-revisions query-results-row-revisions">
      <a href="index.cgi?action=revision_list;page_name=page_boxes_toggle">5</a>
    </td>
  </tr>
</table>

CSS Selectors

Each tag has an id and a class. This should enable you to style all list views the same (using the classes) or differently (using the ids). Selectors are grouped by tag. You can control alternating row colors using the "tr.w-st-even-row" and "tr.w-st-odd-row" classes.

#st-list-title
#st-listtools
#st-listtools ul.level1
#st-listtools ul.level1 li.submenu
span#st-listtools-export
#st-listtools ul.level2
#st-listtools ul.level2 li.first
a#st-listview-submit-pdfexport
#st-listtools ul.level2 li.separator
a#st-listview-submit-rtfexport
div#st-actions-bar-spacer-clear
#st-recent_changes-content
table.query-results-content

#st-recent_changes-header-row
tr.query-results-header-row

#st-recent_changes-header-title
th.query-results-header-title

#st-recent_changes-header-title a
th.query-results-header-title a

#st-recent_changes-header-last-edited-by
th.query-results-header-last-edited-by

#st-recent_changes-header-last-edited-by a
th.query-results-header-last-edited-by a

#st-recent_changes-header-date
th.query-results-header-date

#st-recent_changes-header-date a
th.query-results-header-date a

#st-recent_changes-header-revisions
th.query-results-header-revisions

#st-recent_changes-header-revisions a
th.query-results-header-revisions a

tr.st-recent_changes-row 
tr.query-results-row 
tr.w-st-even-row
tr.w-st-odd-row

td.st-recent_changes-row-title
td.query-results-row-title

a.st-recent_changes-row-title-link 
a.query-results-row-title-link

td.st-recent_changes-row-last-edited-by 
td.query-results-row-last-edited-by

td.st-recent_changes-row-date 
td.query-results-row-date

td.st-recent_changes-row-revisions
td.query-results-row-revisions

td.st-recent_changes-row-revisions a
td.query-results-row-revisions a
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
Weblog Navigation

Home: Socialtext Style Customization Guide
Up: Styling The Weblog
Previous: Weblog Content
Next: Weblog Archives

weblog-navigation.jpg

HTML Snippet

<div id="st-weblog-navigation">
  <div id="st-weblog-navigation-title">Weblog Navigation</div>
  <div id="st-weblog-navigation-content">
    <div class="sidebar-box-content-edit-link">
      <a href="index.cgi?action=display;page_name=Navigation%20for%3A%20Recent%20Changes;js=show_edit_div;caller_action=weblog_display">edit</a>
    </div>
    <div class="wiki">
    </div>
  </div>
</div>

CSS Selectors

#st-weblog-navigation
#st-weblog-navigation-title
#st-weblog-navigation-content
div.sidebar-box-content-edit-link
div.wiki
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
Weblog Header

Home: Socialtext Style Customization Guide
Up: Styling The Weblog
Previous: Weblog Actions
Next: Weblog Content

weblog-header.jpg

HTML Snippet

<table style="position: relative; border-collapse: collapse; padding: 0; background-color: #80a9f3;" width="100%">
  <tr valign="top">
    <td>
      <div id="st-weblog-title">
	<span id="st-weblog-titletext">
            Weblog: Recent Changes&nbsp;
            <a href="/noauth/feed/workspace/help?category=Recent Changes">
               <img border="0" src="/static/1.99.99.8/images/feed-icon-14x14.png"/>
            </a>
        </span>
	<div id="st-weblog-wikititle">in Socialtext Documentation</div>
      </div>
    </td>
    <td align="right">
      <div id="st-weblog-newpost">
        <table class="button-table">
          <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-weblog-newpost-button" 
                           href="index.cgi?action=new_page;add_tag=Recent%20Changes;caller_action=weblog_display" 
                           title="Click this button to create a new blog post">New&nbsp;Post</a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </td>
          </tr>
        </table>
        <div id="st-weblog-postbyemail">
          or post by email:
          <a id="st-weblog-postbyemail-link" class="workspace-bar-link" 
     href="mailto:help+Recent_Changes@www2.socialtext.net">help+Recent_Changes@www2.socialtext.net</a>
        </div>
      </div>
    </td>
  </tr>
</table>

CSS Selectors

See Standard Button for a description of the button selectors.

#st-weblog-title
#st-weblog-titletext
#st-weblog-wikititle
#st-weblog-newpost
#st-weblog-newpost-button
#st-weblog-postbyemail
.workspace-bar-link
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
Weblog Content

Home: Socialtext Style Customization Guide
Up: Styling The Weblog
Previous: Weblog Header
Next: Weblog Navigation

weblog-content.jpg

HTML Snippet

<div class="st-weblog-entry">
<div class="st-weblog-entrytitle">
<a name="add_comment"></a>
<span class="text">Add Comment</span>
</div>
<div class="st-weblog-entrycontent">
<div class="wiki">
<p>
Home: <a href="index.cgi?socialtext_style_customization_guide" >Socialtext 
Style Customization Guide</a><br />
Top: <a href="index.cgi?styling_your_workspace" >Styling Your Workspace</a><br />
Previous: <a href="index.cgi?page_navigation_controls" >Page Navigation Controls</a><br />
Next: <a href="index.cgi?more_actions_menu" >More Actions Menu</a></p>
<hr />
<blockquote><blockquote>
<span class="nlw_phrase">
<img alt="base/images/docs/add-comments.gif" src="base/images/docs/add-comments.gif" border="0" />
<!-- wiki: http:base/images/docs/add-comments.gif --></span></blockquote></blockquote>
<br /><p>
Clicking on the 'Add Comment' link in the page control bar brings up a popup page. Please see 
<a href="index.cgi?popup_pages" >Popup Pages</a> for some general popup selectors.</p>
</div>
</div>
            
<div class="st-weblog-byline">
  <div>Updated by System User on Oct 16 2:10pm</div>
  <div>Posted by System User on Jun 30 12:45pm</div>
</div>
          
<div class="st-weblog-post-links">
<a onclick="
        ST.Comment.launchCommentInterface({
            page_name: 'Add Comment',
            action: 'weblog_display',
            height: '200'
        });
    " class="page-control-comment-link" href="#">comment</a>
-
<a href="index.cgi?action=display;page_name=add_comment;caller_action=weblog_display;category=Recent%20Changes;js=show_edit_div#edit">
edit this post</a>
-
<a href="index.cgi?add_comment">permalink</a>
-
<a href="index.cgi?action=display;page_name=add_comment;caller_action=weblog_display;js=toggle_attachments_div">attachments </a>
</div>
</div>

<div class="st-weblog-post-links">
<a onclick="
        ST.Comment.launchCommentInterface({
            page_name: 'Advanced formatting',
            action: 'weblog_display',
            height: '200'
        });
    " class="page-control-comment-link" href="#">comment</a>
-
<a href="index.cgi?action=display;page_name=advanced_formatting;caller_action=weblog_display;category=Recent%20Changes;js=show_edit_div#edit">
edit this post</a>
-
<a href="index.cgi?advanced_formatting">permalink</a>
-
<a href="index.cgi?action=display;page_name=advanced_formatting;caller_action=weblog_display;js=toggle_attachments_div">attachments </a>
</div>
</div>

CSS Selectors

Since a weblog is essentially a series of wiki pages that are arranged by date, the entries themselves share many selectors with wiki content.

.st-weblog-entry
.st-weblog-entrytitle
.text
.st-weblog-entrycontent
.st-weblog-byline
.page-control-comment-link
.st-weblog-post-links
Updated by ken.pier@hidden on Aug 3 5:46pm
Posted by system-user@hidden on Aug 3 5:46pm
permalink
Earlier entries
Weblog Navigation
Loading...
Weblog Archives
  • Loading...

Upload Files

Click "Browse" to find the file you want to upload. When you click "Upload file" your file will be uploaded and added to the list of attachments for this page.

Maximum file size: 50MB

 
 
 
File Name Author Date Uploaded Size

Save Page As

Enter a meaningful and distinctive title for your page.

Page Title:

Tip: You'll be able to find this page later by using the title you choose.

Page Already Exists

There is already a page named XXX. Would you like to:

Save with a different name:

Save the page with the name "XXX"

Append your text to the bottom of the existing page named: "XXX"

Upload Files

Click "Browse" to find the file you want to upload. When you click "Add file" this file will be added to the list of attachments for this page, and uploaded when you save the page.

 
 
 
Add Tags

Enter a tag and click "Add tag". The tag will be saved when you save the page.

Tag: 

Suggestions: