Teachers College, Columbia University
TABLE of CONTENTS I. INTERFACE OVERVIEW II. SECTION A. Add Section B. Modify Section C. Delete Section III. DEPARTMENT SECTION OVERVIEW A. Primary Slideshow or Carousel B. Primary Navigation C. Department Welcome D. Department Programs E. Department Dashboard F. Section More G. Main Department Section IV. PROGRAM SECTION OVERVIEW A. Primary Slideshow or Carousel B. Primary Navigation C. Program Welcome D. Degree Programs & Non-Degree Programs E. Program Dashboard F. Section More G. Main Program site V. CONTENT A. Adding Content
Title and Copy Image and Title Image Only Image Title and Copy File-Downloads Page Section B. Modify Content C. Preview Content D. Save Content E. Delete Content IV. CONTENT APPROVALS V. APPENDIX A. Primary Slideshow B. Primary Carousel C. Navigation Primary Navigation Left and Right Menus D. Secondary banner E. Adding a FAQ (Accordings) F. Adding additional styles G. Adding Policies & Forms Resources
I. INTERFACE OVERVIEW When you first log in to the T4 Site Manager through mytc, you will be presented with a list of content to which you have been granted access. Your entire site is within one section (or folder) and divided further into subsections. To make any changes within a section, access the dropdown menu for that section by placing your mouse on the triangle icon to the right of the section: Counseling Psychology s dropdown menu A site is composed of several different sections. Each section can hold different types of content.
II. SECTION A section in t4 can mean different things. Most commonly, a section refers to a webpage. A section can also be used to add different features to your page. For example, a section can be used to add a new menu item to your Primary navigation, a slideshow, and dashboards. A. Add Section STEP 1: Creating a section creates a new webpage. To add a new page, hover the yellow triangle icon (next to the intended section) and from the drop down menu, select Add Section. STEP 2: Fill in the name of the Page in the Name field. Click Add. B. Modify Section STEP 1: To modify your section, hover over the triangle icon next the selected section. STEP 2: Select Modify Section. STEP 3: When you are done, click on Update to save.
Modifying the Graduate Writing Section C. Delete Section STEP 1: To delete your section, you will need to find the appropriate section and hover over STEP 2: Click on Delete Section. STEP 3: You will need to confirm the action by clicking on Ok. Note: when you delete content, it will not be deleted immediately. The item will be inactive and will not be shown on your live site. If you change your mind, you will have a certain amount of time to reactive the item. The system will purge all inactive items at the end of each week. Also, when you delete a section, every subsection & content within this section will also be deleted. Important: to un-delete a previously deleted section, you will need to Modify that section. You can do this by hovering over the triangle icon and selecting Modify Section. Scroll down until you see Status. Change the status to Approved or Pending (This will depend if you have access to approving content.)
III. DEPARTMENT SECTION OVERVIEW Sample Department Section Each department home page is divided into several sections on t4. The Department home page will have the following sections: A. Primary Slideshow or Carousel See Primary Slideshow or Primary Carousel to learn more on editing these items. B. Primary Navigation See Primary Navigation to learn more about Primary Navigation C. Department Welcome This section contains the Department Welcome message. You can make changes to your welcome message by hovering over the inverted triangle icon next to the Department Welcome section. Then, you must click on Modify Content. Select the content item by hovering over the and Copy. (next to the content item) and click on Modify. The content type for this section is Title
D. Department Programs This section contains information regarding each program and it uses a Page Section content type. Each program is presented in the home page with page cards. To edit the information within these page cards, hover over the inverted triangle next to the Department Programs section. Then, click on Modify Content. Select the content item by hovering over the (next to the content item) and click on Modify. E. Department Dashboard On the home page, the Department Dashboard is usually located under Department Programs. Within the department dashboard you can add events, news, announcements, feature and a blog. To add or edit an event, you will need to locate the Department Events section. Within this section, you must add a new section to create a new event. Within this new section, add an event content type. To add or edit a news item, you will need to locate the Department News section. Within this section, you must add a new section to create a news item. Within this new section, add an article content type. If you have an announcement and/or blog section, you can edit those within the Department Dashboard. To create a new announcement, you must create a new section. Within this new section, add a Title & Copy content type. F. Section More Within the Section More section, there is a subsection that contains multiple subsections. While seemingly complex, within section more, you have the flexibility of adding any type of content.
These subsection will contain one specific content. In the following image, you will see a section named Program Social. Within the Program Social section, there are two power cards. Each powercard is linked to a Program Social s subsection. In other words, a power card is connected to Twitter and another powercard is connected to Announcements. Within each power card, you can select: a name, the width of the card, & formatting. IMPORTANT: under Section category, select the appropriate subsection. In this case, this powercard will be linked to the Twitter section within Program Social.
Within Twitter, the content type contains the Twitter Widget G. Main Department Section Within your main branch, you can edit the following: Department Dashboard & Department More titles, and Contact Info. Locate your home or main folder and hover over the inverted triangle: Select the content item by hovering over the (next to the content item) and click on Modify.
IV. PROGRAM SECTION OVERVIEW Program Home Page A. Primary Slideshow or Carousel See Primary Slideshow or Primary Carousel to learn more on editing these items. B. Primary Navigation See Primary Navigation to learn more about Primary Navigation C. Program Welcome This section contains the Program Welcome message. You can make changes to your welcome message by clicking on Modify Content under the Program Welcome section. The content type for this section is Title and Copy. D. Degree Programs & Non-Degree Programs Within these sections, there s a page section content type. See Page Section E. Program Dashboard On the home page, the Program Dashboard is usually located under the Program Degrees Section. Within the Program dashboard you can add events, news, announcements, feature and a blog.
To add or edit an event, you will need to locate the Program Events section. Within this section, you must add a new section to create a new event. Within this new section, add an event content type. To add or edit a news item, you will need to locate the Program News section. Within this section, you must add a new section to create a news item. Within this new section, add an article content type. If you have an announcement and/or blog section, you can edit those within the Program Dashboard. To create a new announcement, you must create a new section. Within this new section, add a Title & Copy content type. See Section More for more information. F. Section More G. Main Program site Modify the content inside your program s section to edit Program Dashboard title, Program More title, and Contact Info.
V. CONTENT Within each section, content items can be added. To add content to a webpage, you will need to find the appropriate section and select Add Content. Note: There are sections within t4 that have different naming conventions like: Primary Navigation, and Primary Slideshow / Carousel. These names will influence what type of content you can add. A. Adding Content When adding new content, you will be presented with a list of available content types. The most common ones you will be using are: Title and Copy This is the most common content type. This is simply a Title (or Heading) followed by a block of text. Title and Copy available fields are: Name : Enter a name to reference the content in t4 Heading, Subheading, Minor Heading : Enter title or subtitles Copy : Enter block of text Image and Title Select this content type to upload an image with a title, and subtitle. Image and Title s available fields are: Name : Name of the file on t4 Title : This text appears under the image Title 2 : This subtitle appears under the image Image : Upload image
URL : Enter a link to add to the image (optional) TitleAboveImage : This text appears above the image. Image Only Select this content type to upload just an image into your page. Image Only s fields are: Name : Enter a name to reference the content in t4 Image: Upload a new image Link: Enter a link to add to the image (optional) Image Title and Copy Select this content type to enter an image, header, and corresponding text (like a caption or more text). Image Title and Copy s fields are: Name : Name of the file on t4 Title : This text appears under the image Title 2 : This subtitle appears under the image Image : Upload image Copy : Enter block of text URL : Enter a link to add to the image (optional) TitleAboveImage : This text appears above the image. File-Downloads Select this content to add a downloadable file to your page. File-Downloads fields are: Name : Name of the file on t4 Title: This is the title of the file Description: Enter a block of text to describe the file File: Upload the file Icon: Enter an icon to visually describe the file. You can type in: file-pdf-o for a pdf file or file-word-o. For other icons, please visit: Font Awesome
Page Section This content type has three versions. Selecting the appropriate one will depend on how many page cards you want on a row. Page cards are essentially content boxes. In the image below, there are one Page Section with two cards. A page section s available fields are: Name: it is the name of the content item on T4 Page Section Name: section heading (for example: What TCCS Offers ) Page Section BgColor: Enter a hexidecimal color code without the #. This will change the background color of outside the page cards Page Section BgImage: Upload an image * Card One Name: Heading of Card One * Card One BgColor: Enter a hexidecimal color code without the #. This will change the background color of Card One * Card One Bg Image: Upload a background image * Card One Content: Enter a caption or paragraph * Card One Section Link: Click on Select and search for the section or directory that you would like to link to. * Card One Section Link Text: Enter the text that you would like to appear on your Section Link * Card One External Link: Enter an external link for Card One starting with http:// or https://
* There are three page section content types. Each one holds a different amount of page cards (maximum of 3 cards) per row. Under page section, you will be able to edit all available cards with all of these options. RSS Consumer: Use this content type to display your RSS feeds. RSS Consumer fields are: Name: Name of the file on t4 URL: Paste RSS URL here. B. Modify Content STEP 1: Place the mouse on top of the yellow triangle edit. of the section s you would like to Modifying content on Graduate Writing Center section STEP 2: To edit the Faculty Branch information, you will need to place the mouse on the small inverted triangle (next to faculty profile) to access the dropdown menu. Then, click on Modify Content. STEP 3: Select the content you want to edit by hovering over the triangle icon, next to the content item). Click on Modify. C. Preview Content You can see what your content looks like online before submitting your changes for approval by clicking Preview in the content editor page. This will open up a single-use page that shows the content item but is not accessible to others.
D. Save Content When you ve added or modified content, you have two options to record your changes: Update and Save as draft (visible by clicking on the drop-down arrow next to Update ). If you are ready to submit the content for approval, click Update. If you are not ready to submit for final approval, select Save as draft and come back to update the content later on. Note that even if you are authorized to approve the content, you must do that as a separate step in the Content Approve Content. Besides program content, there are 3 other content types that you will need to be aware of: Degrees, Courses, and Faculty. Department administrators will also need to be familiar with the Department content type. E. Delete Content To delete content from a section, you will need to locate the content s section and click on Delete Content under the dropdown menu. Click the checkbox next to the content you want to delete. Click on Delete when you re done. Note : when you delete content, the item will not be deleted immediately. The item will be inactive. The deleted item will become inactive and will not be shown on your live site. If you changed your mind, you will a certain amount of time to reactive the item. The system will purge all inactive items once, at the end of the week. Also, when you delete content, your section folder will remain. If you delete all your content, for example, your section will remain. To delete the section, you will need to click on Delete Section. Important: To change previously deleted content to active, you will need to Modify that content. You can do this by hovering over the triangle icon and selecting Modify Content. Select that content by hovering over the triangle icon next to the content and selecting Modify. Once you are done updating, click on Update.
IV. CONTENT APPROVALS Editors and administrators are responsible for approving content as it gets submitted. Each workflow is unique, but the first step is always to approve your own content. To do this, go to the T4 homepage. On the right side, you will see a box named Approval List. Here, you can see all the changes you ve made to various pages and either view each one (and go back to continue editing it), or you can approve these updates, moving them to the next step in the approval workflow. Approval workflows follow a fairly simple sequence: 1) Content is entered and saved either as draft or pending. When content is considered final, the Update button is clicked, which sends it to an approval list for the next person in the workflow. 2) A notification email is sent to the content creator and the designated approver. Unfortunately the text of this email is a little cryptic, but the subject line indicates which content item has been submitted for approval. 3) The approver signs into T4, and selects the content from an Approval List. 4) The approver reviews the content, and either rejects the content or approves it. a. If the content is rejected, another notification is sent to the content creator that includes any comments made by the approver about why they content was rejected. b. If the content is approved, it is either sent to the next step in the workflow or made available for final publishing.
V. APPENDIX A. Primary Slideshow This section will cover how to add, modify, or delete a slide and how to change a text caption to your slideshow. The Primary Slideshow section has a subsection called Slides. Click on the [ + ] to expand and view all subsections under Primary Slideshow. Hover over the triangle icon slides. next to Slides and click on Modify Content, under the dropdown menu, to view all existing Once you click Modify Content, you can do the following: Modify an existing slide: Hover over the triangle icon next to the content you would like to change and click on Modify. Upload the new image and click on Add a new slide : Click on Add Content and then select Image Only as your content type.
Delete a slide : Hover over the triangle icon change and click on Delete. Click Ok to confirm. next to the content you would like to All your slides will use the same text caption. This caption is placed on your main section (Primary Slideshow). To edit your text caption, hover over the triangle icon next to Primary Slideshow and click on Modify Content. Hover over the triangle icon next to the content item and click on Modify. You can add or change the heading (Heading), subheading (Subheading), and add a block of text (Copy). B. Primary Carousel Each site typically has either a Primary Slideshow or Primary Carousel. This section will cover how to make changes. All images are on the main section (Primary Carousel). Hover over the triangle icon next to Primary Carousel (to access the dropdown menu) and click on Modify Content. Once you click Modify Content, you can do the following:
Modify an existing slide: Hover over the triangle icon next to the content you would like to change and click on Modify. Note: each image has its own caption. When you modify an image, for example, you will can update the text caption by updating Title (which is a heading) or Title2 (subheading) on t4. Adding a new slide : Click on Add Content and then select Image and Title as your content type. Delete a slide : Hover over the triangle icon next to the content you would like to change and click on Delete. Click Ok to confirm. C. Navigation The navigation in t4 consists of the following three sections: Primary Navigation, Left Menu, and Right Menu. Primary Navigation The Primary Navigation section contains all of your main navigation tabs or links on your site. Each section under Primary Navigation is pointing to another section or folder on your site. In other words, the subsections with Primary Navigation are link sections. For example, the Bursar site has these link sections within the Primary Navigation section that link to other sections of the site.
Primary Navigation links and folders To create a new menu item, you will first need to create a new section or at least have a section that holds all existing pages for that menu item. To create a new section, you will need to do the following: STEP 1: Add a new section. Note: Make sure to remember where the section is placed. Most of Primary Navigation content sections will be placed at the same level of Primary Navigation. These sections are immediately viewable under the main branch section. You can add content to this section before proceeding to step 2. STEP 2: Add a new section under Primary Navigation. Hover over the triangle icon next to Primary Navigation (to access the dropdown menu) and click on Add Section. STEP 3: Name your new primary section link. Next, you will need to make sure that the following items are checked: Show in Navigation? & Make this a link section?
STEP 4: Scroll up the page and click on the Details tab. STEP 5: Once you clicked on the Details tab, click on the Section radio button under Link Type. STEP 6: Click on Select, under Link Section. A popup window will appear and you will need to search for the folder you just created on STEP 1 or for a pre-existing folder to link to this Primary Navigation section item. STEP 7: Once you are done, click on Add. Left and Right Menus To add a secondary navigation within a page, a left and/or right menu needs to be created. Your secondary navigation menu will feature those pages within your target section. For example, in the image below, there will be a left menu. Withdrawal Schedule and Late Registration will be part of the left navigation. STEP 1: To create a left or right menu, you will need to create a subsection named either Left Column or Right Column under a pre-existing section (or page). In the below example, the Tuition & Fees section has a Left Column section. Note: Scroll down the page and uncheck the following: Show in Navigation. Unchecking this feature will hide the Left Column link from the secondary navigation.
STEP 2: Select your Left Column by placing the mouse next to the triangle icon and access the dropdown menu. STEP 3: Select the Power Menu content type STEP 4: Now fill out the Name field STEP 5: Under Section, click on Select and find the section where your left column lives (ex: Tuition & Fees) STEP 6: Now determine whether or not to include Target. Target refers to your parent section. If you select Yes then your parent section will be viewable on your live site. In the following image example, Tuition & Fees page (as well as its subsections) gets included with the secondary navigation
(Left Column). If you click Yes, enter a name under Include Target Label. This label with the link to the parent section. If not, then the left column will just have links to the children sections. In the following image example: the Withdrawal Schedule page and Late Registration page be part of the left menu. D. Secondary banner Your site may already have a Secondary Banner section. This banner is viewed throughout your site with the exception of the Home Page. Note: This section only holds one image. Now access the Secondary Banner drop down menu and click on Modify Content. E. Adding a FAQ (Accordings) Adding a Frequently Asked Questions section requires the use of accordions. STEP 1: Create a section. For the purposes of this guide, the section will be named Payment FAQ STEP 2: Create a subsection called Accordion within FAQ.
STEP 3: Within the Payment FAQ section, add a Code Only content. Copy and paste the following code: <t4 type="power" process="contents" formatting="accordion" section name="accordion" /> STEP 4: For each question, add a new section to Accordion. For easy access, the name of your section should be the question itself. STEP 5: For each section within Accordions, add a Title and Copy content type STEP 6: Enter your question on your Heading field and your answer on the Copy field. STEP 7: Click on Update to save STEP 8: Repeat steps 5-7 as often as necessary. STEP 9: Approve your own content. F. Adding additional styles In t4, you can add CSS to add different styles. This requires understanding of both HTML and CSS. You may notice that your site may have a Branch Head Additional section. The CSS script within this section affects the entire site. The Head Additional section holds a CSS scripts that affects only the particular section or page is in. G. Adding Policies & Forms Contact the Office of General Counsel to add a new policy to your site. Contact TC Web Office about adding a new form. Resources http://fortawesome.github.io/font-awesome/icons/