Managing Your Website Using WordPress

Managing Your Website Using WordPress

WordPress is a content management system used to host recognized Student Organization websites on campus.  For more information on how to request a Student Organization website, please visit the Web Support FAQ page.

 


Logging In

You can log in to WordPress by adding /wp-admin to your website URL. Example: https://studentorgs.syr.edu/sailingclub/wp-admin
Enter your username and password. Once entered you will be taken to the WordPress Dashboard.

Note: You will need to be added as a WordPress user to log in. Please contact Technical Services at sehelp@syr.edu.

 


Navigating WordPress

WordPress Dashboard

The Dashboard is the first screen you see when you log into the administration area of your site. On the Dashboard, you will find widgets that provide an at-a-glance overview of your site including recent activity, update notifications, and other useful information.

WordPress Sidebar Menu 

The most common way of moving around in the WordPress backend is by using the left sidebar menu. Here you have access to all content types, including pages, posts, the media library.


Homepage Settings

In the WordPress sidebar menu select Appearance then select Customize. This section allows you to customize the Header Image, Header Welcome Message, Footer Contact Info, and Footer Social Icons. Be sure to select the blue Publish button to save your changes.

WordPress Homepage Settings Example

Creating New Pages

Select Pages, then select Add New. Title your page and being adding content using the text editor.

Text Editor

This functions much like any other word processing program. You can use the icons above the text box to format your text, add links, lists, and files to the page. Note: when adding content it is important to use proper page heading structure. For example, select Heading 2 in the format dropdown to add a heading before your body text. This helps users and screen readers scan the page as well as improved SEO (search engine optimization).

WordPress Text Editor Example

Assigning Sub-Pages and Page Order

Once you have multiple pages, you can make them sub-pages of each other and set the pages in a certain order. To make your current page the sub-page of an existing page, in the Page Attributes menu on the right, scroll the parent menu to select the main page. You may also choose to leave a page as the main page by leaving nothing selected. To change the order of your page, type a numerical value in the order text box.

If pages are assigned the same number, they will appear in your Dashboard and on your site in the order you created them, with the most recent on top.

Featured Image

You can set a featured image to any page, this image will display at full width (2200 x 850 pixels) at the top of your page.

Header Cards

You can select the Header Cards checkbox to add a preview of the page to the homepage of your site. You will need to add a thumbnail image (400 x 400 pixels) and a short description.


Saving & Publishing

Once you add or edit your content you have three options (blue button) found in the publishing panel in the upper right: Clicking the Publish Button will make your page or post public. Clicking the Save Draft Button will save your page or post but it will not be visible to the public.

This is handy if you would like to come back later to edit it or if you’re simply not ready to publish yet. Clicking the Preview Button will show you a preview of the current page or post. This is helpful as you lay out your content, allowing you to get it right before making it public.


Main Menu Navigation

You can add/remove links in your site’s main navigation. Select Appearance and then select Menus. You can arrange menu links by dragging and dropping them. Be sure to select the blue Save Menu button.


Creating Accordion Style Content

Accordion-style content can be used to better condense and organize content on the web. A common use of accordion or drop-down content would be an FAQ page. Select the Easy Accordion tab in the WordPress Sidebar Menu. Select the Add New button and title your new Accordion Group. Under the content section, you can add new items by filling in the title and description.

Select the blue Publish button. You will then need to copy the accordion Shortcode located at the button of the Accordion Group. Paste this code on the page you would like to add the accordion too.


Creating Tables

The TablePress plugin is an easy way to create and edit tables on your website. To add a new table select the TablePress tab in the WordPress Sidebar Menu then select Add New Table. Add the table name and select the number of rows and columns (you can add or remove rows and columns at any time) Select the blue Add Table button.

Under the Table Content section add your table's information and select Save Changes. You will then need to copy the table Shortcode into the page where you would like the table to display.




Media Library

WordPress manages all media uploads such as images and documents (PDFs, etc.) in the Media tab located in the WordPress Sidebar Menu.

Adding Media

Adding items to the Media Library can be done by dragging and dropping the files you want to upload. You can also select Add New by hovering over Media Library in the sidebar menu. Once the file is uploaded, be sure to add the ALT text.

Please note that the larger the file size, the longer it will take the page to load. Images should be condensed for the web and re-sized before uploading into WordPress.

Recommended File Sizes

  • Banner Image: 2200 x 850 Pixels

  • Post Thumbnail: 400 x 400 Pixels

  • Standard Image: 800 x 400 Pixels

Viewing Media Details

Clicking a media item will display the media details, including the size, file name, alt text, and file URL.

Removing Media

You can delete files by selecting the file and clicking the red Delete Permanently text option. Please note that once a file is deleted it can not be restored.

Important ADA Compliance Note:

All images MUST include alt text for compliance purposes. When adding alt text, be sure to describe the image, this allows screen readers to read the alt text to users with vision impairment.


Accessibility

To comply with Syracuse University’s existing Accessibility policy, all content provided through University Websites must be accessible.

Please take note of the following Accessibility standards when adding content to your website in WordPress:

Color

Syracuse University branded color values can be found in the color palette of the Syracuse University Brand Guidelines. The University's Cobalt theme includes pre-styled text color in the formats dropdown. Be sure to ONLY use colors provided in the Cobalt theme to ensure web accessibility.

Embedded Videos

  • All embedded videos MUST include closed captioning. The user should have the ability to turn off closed captioning if they choose.

  • Embedded videos should never play automatically when a page loads. The user should be required to press play for the video to begin.

Note: WordPress does not host video files as it does with images. Videos can be uploaded using: video.syr.edu (video content will be automatically captioned) and can easily be embedded into WordPress.

Headings

Headings should state the content of the paragraph(s) below them. Headings improve readability by allowing users to quickly scan through the page and are also utilized by screen readers. In WordPress, the page title is always the H1 (you are limited to one H1 on the page). The next heading level to include on your page is H2. You can then include additional headings such as an H3. Skipping heading levels should be avoided (e.g. H1 directly to H3).


Images

Use alt text to briefly describe the appearance of an image. Alt text is designed to provide text descriptions of images for users who are unable to see them. Avoid uploading images with text included on the file, screen readers will not be able to translate the text.

Example: Syracuse University Students with Otto the Orange.

Links

Link text should describe the destination of the page. Always avoid “More” or “Click Here".

Examples of Good Link Text:

Themes

All syr.edu WordPress websites MUST use the University's Cobalt Theme to ensure brand guidelines and accessibility standards are met. Please note that SE Technical Services will automatically apply this theme to your website in the initial setup.

WordPress Accessibility Checklist:

  • Am I only using text color included in my website's Cobalt theme?

  • Do my pages include headings and are they in logical order?

  • Do all of my images include ALT text?

  • Do my links include descriptive link text?

  • If my website includes embedded videos, do they have closed captions?


Support

For technical assistance in WordPress, please contact SE Tech Services at sehelp@syr.edu.