Managing Programs in Public Website WordPress

All Schools have Program Catalogue in the WordPress Menu when their School section is selected. Program Catalogue has three options below it:

• All Program Umbrellas
• Add New (Program Umbrella)
• All Programs

To find a Program, in WordPress with your School section selected:

1. Hover your mouse over Program Catalogue in the WordPress menu and click on All Programs
   
2. Use the search field and search for your program. You can search for the program code or for keywords in the Program name.
   
3. When you see the program you want to make changes to, hover your mouse of it and click the Create Revision link that appears.
   

Only certain types of content (specific HTML tags) are permitted in Programs. If restricted HTML is used, this won’t generate error messages or warnings, but will simply be stripped out of the final published Program.

For example, the only permitted heading level in Programs is Heading 3. This is because all of the Heading 2 Subheadings on pages are already preset in the template or come from Banner. If you add a Heading 2 to your WordPress content, the H2 will be stripped and your heading will appear as plain text instead.

If you’re not sure if this explains a formatting oddity that you’re seeing in the content, look at the Text view of that content in WordPress and compare the HTML tags around the content with the list of permitted HTML below.

Permitted HTML markup

Permitted HTML tags include:

• <a href=”…”> (links)
• <em> and <strong> (emphasized and strongly emphasized)
• <h3> (heading 3)
• <img src=”…”> (images)
• <p> and <br> (paragraphs and line breaks)
• <ul> and <li> (unordered/bulleted lists, like this one)
• <table>, <thead>, <tbody>, <tr>, <th>, <td>, and <tfoot> (tables)
• <div> and <span> (block and inline content selectors, which can be used to apply special formatting options, as needed)

The Path Setting sidebar can be found by default below the Publish sidebar in the WordPress editor. At BCIT, paths are broad groupings of programs and courses, and include:

• Access & Transfer
• Applied & Natural Sciences
• Business & Media
• Computing & Information Technology
• Engineering
• Health Sciences
• Trades & Apprenticeship

Programs that are related by general topic are sometimes delivered by more than one School. As well, each School delivers a wide variety of programs. Because of this, grouping programs by School could show a potential student both too few and too many programs, potentially hiding the best option for them. Grouping programs by Paths is intended to make it easier for potential students to find all the programs that meet their interests without having to understand BCIT’s internal school and departmental structures to do so.

The Path chosen affects:

• Default Hero Banner Image: Each Path has a default Hero Banner image that will be used unless a specific Hero Banner Image has been chosen (see “Hero Banner Image” below for more information).
• The “breadcrumbs” at the top of the Program site: These are the links showing where the Program sits in the site structure breadcrumbs contain a link to a list of all Programs in the selected Path.
  

The Hero Banner Image is the image that appears in the Banner behind the program name and the initial information about the Program. Every program has an image showing in the Program site, even if there isn’t one chosen in WordPress. That is because there are default images provided for all Paths (see Path Settings above for more information), and if a specific image isn’t selected in the Program in WordPress, the default one for the selected Path will be shown instead.

To add an image to a Program that doesn’t currently have one, in the WordPress edit page for the Program, click the Add Image button in the Hero Image & Meta Settings sidebar and proceed through uploading a new or selecting an existing image. Images must be at least 1600×800 pixels in order to work on all versions of the page (include mobile phones and tablets).

After adding your new image, it’s very important to responsively preview your Program (look at how it would look across all devices).

Removing a selected image

To remove an image and return to the default Hero Background Image for your Program’s sector, move your mouse over the current selected image. Two small icons representing Edit and Remove will appear superimposed over the image. Click on the Remove icon (looks like an X).

For more information on keywords, reference the Search Engine Optimization (SEO) article.

A description is exactly that, a short 1-2 sentence description of your program. Keep your meta description less than 155 characters. The first sentence in your Overview page can be reused here, or you may want to write something a little more cohesive.

For more information on using descriptions effectively, reference the Search Engine Optimization (SEO) article.

For each Program you have the option to add one (and only one) pageblock. This content will appear in the left sidebar below all other navigation and notices, or below all content on mobile devices. Because of the way the pageblock is de-prioritized in both desktop and, especially, mobile views, this is not the place to put the most important information on the page. It is a good place for past student or industry testimonials, or for promotions.

Aside from the Delivery Notice, there are no other standard Banner fields that appear on the Overview page. On occasion, global notices for the Program Catalogue are added in Banner and appear here, but the majority of Overview page content comes from WordPress via the Marketing Intro and Core Content fields.

Marketing intro

The marketing intro field is designed to help structure page content in a way that allows prospective students to quickly and easily understand your program. Used effectively, it will also help search engines find and rank your content. Include the program name and a short, descriptive summary of the program.

A maximum 350 characters is allowed in this field. You can highlight (bold) text in this field by wrapping it in <strong>highlight</strong> html tags. All other markup, including paragraph breaks, will be stripped out.

Core content

Content in the core content field will display immediately below content in the marketing intro field unless there is a Banner notice active for the Program, in which case it will appear below the Banner notice.

Here you can add additional content (including text, images, and video) describing your program. We recommend organizing your content into the following groupings, using H3 headings: About the program, Who it’s for, and What grads can do. Using these categories across the program catalogue helps establish a consistent user experience.

The following Banner fields will automatically appear on this page, where applicable:

• Entrance requirements
• BC provincial exams
• Apply to program
• Program approval
• Scheduled intakes
• PLAR
• Technology entry
• Application processing

In WordPress, you may want to add additional information such as:

• Who would apply.
• Recommended skills, e.g., team work skills, etc.
• Special requirements for entering program, such as attending info sessions, portfolios, etc.
• How to fulfill extraordinary requirements.

The following Banner fields will automatically appear on this page, where applicable:

• Tuition fees
• Books and supplies (Note: this field in Banner is where total estimated fees for all books and supplies must be indicated, not in WordPress)
• Financial assistance
• Refund policy

In WordPress, you’d want to add any additional information, if available, such as:

• Textbook lists
• Laptop specifications
• Special supplies or equipment, etc.

The following Banner fields will automatically appear on this page, where applicable:

• Class hours
• Program delivery
• Program matrix
• Course description

In WordPress, you might want to add additional information, if available, such as:

• Marketing-directed copy re: what the experience might be in certain classes.
• Extra class experiences – field trips, directed study, etc.
• Explanation of shifts in multi-shift programs

Recommendation: The course matrix is the key content in a Program. Do not input too much content for the introductory text as you don’t want to push your course matrix too far down the page, potentially causing it to be missed by potential students.

The following Banner fields will automatically appear on this page, where applicable:

• Program length
• Grading
• Additional program options
• Accreditation
• Program location
• Program structure
• Continuing your education
• SkilledTradesBC
• Co-op education
• Sea service requirements
• Program abandonment
• Aviation attendance policy

In WordPress, you may want to add additional information, such as:

• Explanation of extra policies/options.
• Marketing-directed copy re: what the experience would be in the program.

The following Banner fields will automatically appear on this page, where applicable:

• Apply for graduation
• Credential
• Professional associations

Graduate employment outcomes are also automatically displayed on this page.

In WordPress, you may want to add additional information, such as:

• Marketing-directed copy re: what the workplace would be like for a typical graduate.
• Re-iteration of grad outcomes in a marketing-oriented way.
• Marketing-directed copy re: opportunities for further education.

This optional page contains no Banner content and has two fields in WordPress.

Faculty, Advisors & Staff Intro

Information you may wish to add here includes lists of or information about:

• Full-time faculty and staff
• Sessional instructors
• Clinical coordinators
• Clinical instructors

Advisory Committee

The field is specifically for a list of your advisory committee members. Please do not put other content in this field.

The following Banner field will automatically appear on this page, where applicable:

• Apprentice services

In WordPress, you can add any extra contact information you’d like to use. For example, Program assistant’s phone number or email address.

This page contains a contact form. By default in new Programs, these would go to the Student Services email. You can have these emails delivered to a different address by entering it in the contact email text box. To return to the default, delete any added email address and the default will appear again.

Although most Programs contain all needed information in the standard pages, it is occasionally necessary to add an additional page to display information that doesn’t fit on the existing pages. For example, many Programs in 2020 need to provide information specific to changes in their delivery methods in response to the COVID-19 epidemic, and adding an extra page pertaining to that topic is a good method of addressing the need to clearly communicate this information. In WordPress, you can add up to three extra pages to the standard set in a Program. All extra pages will appear in the navigation menu just above the Contact Us menu item in whatever order they appear in WordPress.

Adding extra subpages

To add extra pages to a Program in WordPress:

1. Option A: In the Extra Subpages area, click on the Add an extra subpage button.

1. Option B: If there are other extra subpages already in place, hover your mouse over one and click the Add row icon at the top or bottom right of an existing subpage to insert your page above or below it.
   
2. Enter the Subpage ID.
   Note: Every subpage in a Program needs to have a unique Subpage ID, so you can’t reuse any of the standard ones or repeat the same one across multiple extra pages. The ID must start with a letter and can only contain letters, numbers, hyphens, and underscores. The Subpage ID becomes the part of the URL after the # symbol.
3. Enter the Subpage Title.
   Note: This is what will appear in the Program’s navigation menu and should follow the naming standards of all other page titles.
4. Enter the Subpage Content.

If you don’t see either the button or Add Row icons to add a new subpage, this means that there are already three subpages in place and you may need to reconsider your current usage if you need to add additional content. It is never possible to add more than three subpages to a Program.

Removing extra pages

To remove an extra page that is no longer needed or was added by mistake:

1. Hover your mouse over the extra page you want to remove.
2. Click on the small remove icon that appeared on the right-hand side of the extra page.
3. Click the Remove Row link to confirm that you want to remove it.
   

Reordering extra subpages

You can drag and drop the extra subpages within the list of three to reorder them.

Tip: This can be a little tricky on small screens, so one way to deal with that limitation is to “Zoom out” your browser (Ctrl+– on your keyboard) in order to better see all of the extra subpages and more easily drag and drop them into the order you want.