Home: Socialtext Style Customization Guide
Previous: Using Your Own Logo
Next: Announcements And Links Box

There are two major sections to the Dashboard page. The navigation bar is at the top of the page. The main body of the page contains the dashboard itself. The main body has six panels. The Links and Announcements and Your Notepad boxes contain the content from wiki pages. Did You Know contains static text. Recently Viewed, Your Watchlist, and Your Workspaces contain lists of appropriate wiki elements.

HTML Snippet

<div id="st-homepage" class="st-content">
  <div id="st-wiki-logo">
    <img id="st-wiki-logo-image" src="/static/images/st/logo/socialtext-logo-152x26.gif" />
  </div>
  <div id="st-user-greeting">
    <div id="st-user-welcome">Welcome, Socialtext User.</div>
    <div id="st-wiki-title-invite">
      <a href="?action=users_invite"><b>Invite your colleagues</b></a> to this workspace.
    </div>
  </div>
  <div style="vertical-align: 7px" id="st-wiki-title">
    <div>Dashboard: Socialtext 2.0 Custom CSS guide</div>
  </div>
  <table id="st-homepage-layout">
    <tbody>
      <tr>
        <td class="st-homepage-layout-cell" id="st-homepage-layout-notes">
          <div id="st-homepage-notes">
            <div id="st-group-notes" class="st-homepage-section">
              <!-- content -->
            </div>
            <div id="st-personal-notes" class="st-homepage-section">
              <!-- content -->
            </div>

            <div id="st-dyk" class="st-homepage-section">
              <!-- content -->
            </div>
          </div>
        </td>
        <td class="st-homepage-layout-cell" id="st-homepage-layout-dashboard" align="right">
          <div id="st-homepage-dashboard">
            <div class="st-homepage-simplelist" id="st-whats-new">
              <!-- content --> 
            </div>
            <div class="st-homepage-simplelist" id="st-watchlist">
              <!-- content -->
            </div>
            <div class="st-homepage-simplelist" id="st-wikis">
              <!-- content -->
            </div>
          </div>
        </td>
      </tr>
    </tbody>
  </table>
  <br style="clear: both;height: 1px" />
</div>

<div id="st-socialtext-attribution">
  <a href="http://socialtext.com" id="st-socialtext-attribution-link">
    <img id="st-socialtext-attribution-image"
         src="/static/1.99.99.9/images/st/logo/socialtext-logo-152x26.gif"
         title="Socialtext v1.99.99.9"
    />
  </a>
</div>

CSS Selectors

#st-homepage
div.st-content
#st-wiki-logo
#st-wiki-logo-image
#st-user-greeting
#st-user-welcome
#st-wiki-title-invite
#st-wiki-title
#st-wiki-title div
#st-homepage-layout
#st-homepage-layout td.st-homepage-layout-cell
#st-homepage-layout-notes
#st-homepage-notes
#st-homepage-layout-dashboard
#st-homepage-dashboard

#st-socialtext-attribution
#st-socialtext-attribution-link
#st-socialtext-attribution-image