Sitecore Basic Training

Drexel’s full-featured web content management system (CMS)

Web Support
Information Resources & Technology (IRT)
Topics
 What is Sitecore?
 Login/Change Password
 Content Editor (editing text)
 Media Library (uploading images/PDFs)
 Save and Approve for Publication
 Additional Resources/Training
 Live Demo
 Q&A
 Contact Info/Support
What is Sitecore?
 Content Management System (CMS)
 Reuse of information
 Can be used in most commonly used browsers: Internet
Explorer (IE), Firefox, Chrome, Safari, and Opera.
 Logging In: webedit.drexel.edu/sitecore

Your temporary password is “passlastname”

(i.e., passsmith or passjones).

The first time you log in with your temporary

password, click “Change Password” instead of
the “Login” button.

Choose Desktop
Interface so you can tab
between Content
Editor & Media Library

*Note: no “www” or “http://” required when typing in the login URL.

Main Areas in Sitecore
 Content Editor  Media Library
 Page creation, editing  Stores Images, non HTML
files, etc
 Content Editor: How to Begin

Click on Content Editor

Click on Sitecore to Begin

Content Editor: Content Tree
 Content Tree > Find Site

Site

Sections that
appear in
top navigation
of site
Content Tree
Section - Top Navigation and
Side Navigation Header

Site Section Item – Drop Down Menus and

Side Navigation Categories

Basic Page – Section Side Navigation Sub

Pages
 Sitecore Page: Live Example
Site Section Item - Top Navigation and
Section Navigation Header

Site Section Item

Drop Down Menu
and Navigation
Categories

Basic Page and

Side Navigation
Sub Pages
Content Editor: Editing Pages

1. Lock and Edit - creates version to keep track

of edits

2. Sections to Edit

 Identity - Basic
page title – web browser title
menu title – menu title
breadcrumb – appears under nav bar
as navigation aid.
Example:

 Content – body text

 Content Editor: Editing Pages
 Show Editor - opens WYSIWYG editor

Heading 1 <h1> automatically added – no need to add styling

Opens
WYSIWYG
Editor
Content Editor: WYSIWYG (Show Editor)

 Do not bold headings– use heading tags

HTML (Hypertext Markup Language)

Heading tags are used for outlining body text, not just for labeling. For example,
<h1> Heading 1 (largest heading) - automatically inserted in Headline (title of page)
<h2> Heading 2 – used for next level headings in body text
<h2> Smaller than Heading 1
<h3> Heading 3 – used for headings below h2.
<h3> Smaller than Heading 3
<h4> and so on.
Inserting an Image/File
Opens Insert Media Item Window

Click on Image
Find Site where image or file is located

Add Alt Text

Note: Alt text describes images for viewing by screen

Note: Uploading Images is converted in Media Library Section readers – Essential for Web Accessibility
Editing Image properties in the WYSIWG Editor

We recommend
NOT changing
these dimensions.

Another
opportunity
to add Alt Text

We recommend
NOT change the
image’s source.

Right click on image and click Set Image

Properties to launch Image Properties
Adding a Sitecore Link
Insert Sitecore Link

Links to Internal non-

HTML documents
(PDFs, docs, PPT) in
Medial Library

Linking to Internal
Sitecore Pages.
Inserting an External Link

Links to external
websites/e-mail links
Pasting from Word into Sitecore

 Copy from Word

 Click the “Paste from Word” Icon
 Strips Out Unnecessary Word Styling
 Do NOT paste directly from word into Sitecore.
Cleaning up Content
Format Stripper
Finished Editing

When finished editing, make

sure you accept or reject
the changes.
Display/Approve for Publication
Review > Display

Review > Approve for publication

Sitecore Contributor Sitecore Manager

Save > Submit for Review Save > Approve for Publication
Needs Approval by Sitecore Manager Publishes pages live

Order of Operations
1. Lock & Edit
2. Launch WYSIWYG Editor to make changes
3. Accept/Reject Changes
4. Save Changes > Preview with Display
5. Approve for Publication / Submit for Review
Media Library: Adding files & Images

2. Click Media Library Opens Media Library

 Files
 PDF Find Site
 PPT
 Images
 jpg
 gif
 png
1. Click on Sitecore to Open Menu Window
 Media Library: Upload File

Alt Text

• Text added to describe an image.

• Viewed by screen readers to assist blind

in accessing web pages.

• Essential for Good Web Accessibility

Alt Text Warning

Media Library: Additional Ways to Access
 With Content Editor open, click on arrow at the top right of page to access the Media Library

Access Media Library by selecting tab at the bottom of the screen.

Note: Desktop View (selected at login)
Media Library – Adding ALT Text
Best Practices – Alt Text

• The alt text should describe the

image (for example, "Statue of the
Drexel Dragon").

• If text in an image is used instead of

true text, the alt text should say
exactly what the image does. (for
example, if an image is used instead
of the words "Student Open House"
the alt text should also say "Student
Open House“).

• In the rare instance in which an

image is purely decorative, use
empty quotation marks ("") for the
alt text to indicate that there is no
meaning.
Media Library Upload File – Approve

All images and files/folder must be

approved for publication to display live

Note: Images will show in editor but not in live site if unpublished
Additional Resources
 Workshops/Training
 www.drexel.edu/irt/help/workshops/
Sitecore Basics/Refresher
Web Content (HTML & Dreamweaver)
SharePoint
University Calendar
Graphics (Basic Image Editing)

Additional Resources
 www.drexel.edu/irt/web/departmental/sitecore/
 webedit.drexel.edu/test/gallery
Contact Information
Web Support Team
Information Resources & Technology (IRT)

websupport@drexel.edu
215-895-0202

http://drexel.edu/irt/web/departmental/sitecore/