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

New 2010 Design Site Specification

How to update the HomePage # Name Type of Object Notes 1 Path to Level 1 Section Details Output the path to level 1 to allow logo to link to home page 2 Search Box Related Content Includes code added to Style Assets > Search Box. Content added using the Code Only template. 3a Link to Courses Section Details Output a link to Courses  (2 nd Level) 3b Link to Research Section Details Output a link to Research  (2 nd Level) 3c Link to Business Section Details Output a link to Business  (2 nd Level) 3d Link to Alumni Section Details Output a link to Alumni  (2 nd Level) 3e Link to Facilities Section Details Output a link to Facilities  (2 nd Level) 3f Link to About Us Section Details Output a link to About Us  (2 nd Level) 4a Dropdown Courses Link Menu Output ...

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 an...

Updated - Creating a short url or redirect page in SiteManager

Create your short url section (making sure to de-select show in navigation) Change the Page Layout to 'ASP Redirect' on the 'Marjon 2016 Channel' Duplicate the Code Only content type entitled 'redirect code' from ' Home » Marjon » Home » PG redirect'  on SiteManager into your new short url section Modify the content and update the url to the page you want to redirect to - the url is enclosed by " " (this could be the normal url or a Google Campaign url if you want to gather statistics) Update and approve your new content Publish the new section and check that the redirect works correctly