Skip to main content

New Courses Designs- 2015


Demo is the available at Marjon > Home > Courses (New Design) Branch.

New 'Course Content 2015' content type

Course Content 2015 is the main content type which has the text/new content layout, holds the main html for the Course Content page. 



The Graduate and Student Profiles are taken from the Content type Student/Graduate Profile. T4 have created two sections. One for adding Graduate profiles and another section for Students Profiles. The the Course Content 2015 uses two Navigation objects - Keyword Seach for each of the different profiles sections. Uses the Course List as the keyword to match.

Icon Bar - T4 didn’t implement all three variations for this due to time constraint. Either Image or Percentage should be used for the first two icons. I’ve left the 3rd icon an optional field so only two can may be displayed.

Related Courses - This uses the “Related Course” and “Current Course” elements to pull in related courses, they both use the Courses list. The Courses Content 2015 has an alternative layout called text/course-related. 

Personal Development Profile (already existing content type), created a new page layout: course-content, used in the Course Leaders section (Nav Object: #411)


New 'Course Slide' content type


Used for adding images and embedding videos to the carousel on top of the course page


New 'Student/Graduate Profile' content type

Two content layouts for student and graduate profiles.


Sample Pages for reference - set up by T4 Developer






Navigation Objects
     Course Sliders (#408) Related Content Advanced
     Course - Alumni Profile (#410) Keyword search
     Course - Student Profile (#409) Keyword search
     Course Leaders Profiles (#411) Keyword Search

Lists
     Courses CSS Departments 2015 - Used in Course Content to change the css theme.
     Course Departments 2015
     Courses List - Used in Related Courses in the Course Content content Type

Media Library
All “Course Details” Page media has been put into “Course Details” category in the media Library.

This includes CSS, JavaScript, Fonts, Images. 

Other bits (jQuery in footer)
     Page Title element is added as an attribute to the main page h1 (h1). jQuery then is used to check if this attribute is populated and replaces the page “title” tag with this new value.
     Page Themes - there are multiple options for changing the page theme in the css. This can be changed by selecting a different theme in the “Course Style Theme” Element. This element is added as an attribute to the main page h1 (h1). jQuery then checks this and adds the value to the body tag as a class.
Page Layouts
     Course Details 2015

When development branch is moved, may need to update the navigation objects to point to the updated branch.


Meta Tags output:




Google Analytic Code has been added to all interactions:


APPLY - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Apply Button') 

APPLY VIA CLEARING - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Apply Via Clearing Button')

Shared Module 1 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Shared Module - &Value')

Shared Module 2 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Shared Module - &Value')

Shared Module 3 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Shared Module - &Value')

Shared Module 4 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Shared Module - &Value')

Course Leader 1 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Course Leader - &Value')

Course Leader 2 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Course Leader - &Value')

Course Leader 3 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Course Leader - &Value')

Course Leader 4 - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Course Leader - &Value')

Funding Section Link - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Funding Link')

Related Course - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Related Course -&Value')

Order a Prospectus - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Order a Prospectus')

Book an open day - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Book an Open Day')

Newletter Sign Up - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Newletter Sign Up')

Twitter  - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Twitter')

Facebook - - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Facebook')

Instagram - - onClick="ga('send', 'event', 'Course Details Page','<t4 type='title' />', 'Instagram')

Links Used


Apply - http://www.marjon.ac.uk/courses/applying/
Apply Via Clearing - http://www.marjon.ac.uk/clearing/
Funding Section Link - http://www.marjon.ac.uk/courses/fees-and-funding/
Order a Prospectus - http://www.marjon.ac.uk/prospectus-request/
Book an open day - http://www.marjon.ac.uk/courses/open-days/
Newletter Sign Up - ?
Twitter - https://twitter.com/marjonuni
Facebook - https://www.facebook.com/MarjonUni
Instagram - https://instagram.com/marjonplymouth










Comments

Popular posts from this blog

December 2018 Subject Area Page - how its built in SiteManager

Model Page https://t4.net.marjon.ac.uk/webdev/dec-2018-new-designs/subject-area-page/ Page Layout The Subject area page uses the '2018 Subject Area' page layout Content  There are 14 pieces of content that make up the Subject Area Page as follows: 1.    2018 Dual Header Block - content type. Adds an information block and an image to the top of the page. Select 'Show the Social Media Icons on this slider' to show social media icons on page.  Images are 1000 x 600. 2.    2018 Who What Why Block - content type. Adds 3 columns of information to page.  3.    2018 CTA Block - content type. Adds a single call to action block to page.  4.    Output courses by level and subject - content type. Displayed courses content by both level and the subject as they are tagged as in the course content 2015 content type (x2 to display both undergrad and postgrad). Images are from the course con

Guidelines to deactivate/hide a section that you may use again in the future

Do not use the Delete facility to temporarily remove/hide a section, as it might be purged from the Recycling bin, in which case it cannot be restored. To deactivate a section, but still keep it, update the section's status to Pending. The section will be removed from the site, but can be reset to Active and reused in the future. Reply

How does the Course Search work?

The course search searches web page names that are physically in the root of the course section of the website  http://www.marjon.ac.uk/courses/courses/  - not the entire website. If you want any courses to appear from the search then it needs to be added to the courses section of the website. One way of doing this is  to create a duplicate branch under  http://www.marjon.ac.uk/courses/courses/  which does not show in navigation but allows for the course to come up under the course search.  This would need to be done for any other non-standard courses if you wanted to use the course search for them.