GEMS CMS Manual - Part 2 - Managing Page Contents
Contents
1. i z ay Tony Blair Faith Foundation F GEMS students talk This video is public Varkey GEMS Foundation cay Like Ny Launch Speech from Vika By Pee 2cu cate ki Add Share or embed this video Page 8 of 15 E Marketing GEMS CMS User Manual Part 2 GEMS Education The screenshot above is from the GEMS Education Channel www youtube com gemseducation which shows the video of Varkey GEMS Foundation and Pratham s Summer Volunteering Programme workshop We will be using this video to demonstrate the embed procedure for web pages ce Like 4 Addto Share amp 1 Just below the video click on the Share button this will open the Share Embed this video parameters 2 Deselect the Show suggested embed emattnisvdeo J E G7 crow moe videos when the video finishes to o aoe get rid of those other videos oe 3 Select the Video Size since the page content area can handle an Share or embed ts vdeo fhitp youtu be B3Ri After making your sekcion copy Amd pasie ihe embed code above The code changes based Of your selechon image video with a width of 740 Ly coche alae pixels however would aoe pray sbatti recommend and adopt a standard size for all our sites to have a video 425340 400200 pegan 980 750 Custom with a width of 640 See screenshot ly k to the right Note that you do not need to define customize the size piii by gies all you have t2. Manage Videos 5 Manage Fhoto Gallery a f z Manage Carousel No Title IDS Status Replicate Share Preview Edit Trash Manage Enrolling Schools er 1 Duba Amencan Academy Mission Statement 1588 2 A ow t Manage Testimonials Y i Gr A hm OD GEMS Leaning eee ee 2 The Winchester School Student Registration 1587 2 a Fy ij at EJ Manage Making News i Student Registrations Box 3 The Winchester School Terms amp Conditions 1586 2 GJ amp El Adding a New Page To add a new page for your site click on the Add New Page button on the upper right hand of the page and follow these steps _ Manage Videos a2 Manage Phote Gate Manage Carousel gt Manage Enrolling Schools ieee Manage School Calendar Manage Newsletters erage Schoo Everts You are currently managing Content Pages Manage Page Contents All fields marked are mandatory Manage Site Site Name Please Select ha Manage Menu Beos Uni page Tite CC anes Careers ee Left Menu Please Select Manage News ERRARE PE RE etertaereterstietetrt Top Ba MET ME E N o E A e E sf Jen H E SSB EE l h GEMS Learning Box Manage Making News Student Registrations Box Manage Prnapals Messages eeverve tyres t Media Manager Manage Folders sn erop TN u Page Content Select your school site on the Site Name field 2 Place the Page Title of the new page Note that a nic
3. School Newsletters this should be now on GLG You may also set a menu item that is linked to a page that s still under construction Page 13 of 15 GEMS CMS User Manual Part 2 GEMS Education Learn Aspire Be Website Administration You are managing Site Sub Men You are here Manage Main Menu Manage Sub Menus for Our School Manage Page Contents Manage Site No Tithe Site Priority Status Edit Delete Expand Manage Mena 1 Poncpels Message GEMS Amencan Academy Abu Dhabi 1 Onine FY Manage Users Manage Careers 2 Our Team GEMS Amencan Academy Abu Dhabi 2 Onkine ay Ma hymn News PREE 3 School Patron GEMS Amencan Academy Abu Dhabi 3 Offline oy Manage Videos E i Manage Photo Gallery 4 Our Facilities GEMS American Academy Abu Dhabi 4 Online FQ Manage Carousel als hinain 5 Directions amp Maps GEMS Amencan Academy Abu Dhabi 5 Onhine ory Manage Enrolling Schools Manage Testimonials 6 Alumi GEMS Amencan Academy Abu Dhabi 6 Offline on GEMS Learning Box r m Academic Calendar GEMS Amencan Academy Abu Dhabi 7 Onkne FG Manage Making News Student Registrations Bax 8 PEE ET GEMS American Academy Abu Dhabi a Onine p amp Manage School Calendar To add a sub menu follow these steps 1 Click the Add New Sub menu button on the upper right 2 The Site and Main Menu fields are already filled enter the name of the sub menu 3 Enter the URL The URL is basically typed on this format no spaces cont
4. Y n Replicate oh i enu Manage School Events gai y GEN Tli Replicate Media Manager KA Sha l Eri eplicate Hanag Falders GEMS Ame l bu gO Replicate Dha i Ta j SEM j me i Ae Replicate Dna Ne s Fal GEM i i Replicate Recycle Bin H Dha oy Home GEMS Ami I Replicate Logout Achievements Dha vy i IT ari ja i Replicate Cit Ta In that current view you can see a mix of Top Menu and the Main Menu items to give you a more detailed and organized view see table below Top Menu Items Main Menu Items PRIORITIES MENU NAME PRIORITIES MENU NAME 1 Global Home 1 Home 2 GEMS Education 2 Our School 3 School Newsletter 3 Admissions 4 Careers 4 Education and Learning 5 Contact Us 5 For Parents 6 Awards and Achievements 7 News and Events Note that since these priorities and menu names are preserved we will skip adding menus at this level B Adding and Editing Sub menus Before you add or edit a sub menu click on the expand button of the menu item to view the SuD menus under it On the screenshot below it displays all the sub menus of the Our school menu group of GEMS American Academy Abu Dhabi Some of the sub menus are actually set offline because it simply does not apply to the school Note If there are sub menus or may be main top menus that does not apply to your school yet then you may set it to offline so it will not be visible to visitors Examples of menu items you can turn offline are Alumni School Patron
5. 11 of 15 E Marketing GEMS CMS User Manual Part 2 GEMS Education ll Managing Menus There are 3 types of menus in the new GEMS CMS top menus main menus and sub menus See screenshot below from Jumeirah Primary School website for your reference ee anu a EBAI Caress Contact te D tah olly n anpii l 5 GEMS JUMEIRAH PRIMARY SCHOOL J i Our School Admissions Education amp Learning _ For Parents News amp Events F ub Menu You may add and edit those menus using the Manage Menu module FYI if you notice there are only up to 2 levels of submenu If you require another 3rd level of menu then you might need to restructure or re organise your menus starting from the 1st sub menu level in a way that you won t require a menu up to the 3 level See illustration below Planned Menu up to 3 Level News and Events e Photo Gallery o Photo Galleries 2010 2011 Event Photos 1 Event Photos 2 Event Photos 3 o Photo Galleries 2009 2010 Event Photos 1 2010 Event Photos 2 2010 Event Photos 3 2010 Restructured Menu up to 2 Level News and Events e Photo Galleries 2010 2011 o Event Photos 1 o Event Photos 2 o Event Photos 3 e Photo Gallery Archive o Event Photos 1 yr xx o Event Photos 2 yr xx o Event Photos 3 yr xx A Exploring the Manage Menu Module This module allows you to manipulate the menus of the school website Please note that the order of the current menus has been approved and
6. consulted to the marketing and education teams as well as some of the head of schools thus must be maintained across all schools especially the Top and the Main menu items To access the module click on the Manage menu link By selecting your school site and pressing the Search button this will display all the menus under the main menus and the top menus with their priorities and statuses as well You may also perform actions like Edit Delete Expand to view the sub menu under it and replicate Note that replicate command can only be applied to Top and Main menus Page 12 of 15 E Marketing GEMS CMS User Manual Part 2 GEMS Education here Manage Main Menu Please Select 7 Manage Page Contents Search By Site Manage Site Search By Keyword Search Manage Menu Manage Users Manage Careers Manage News Manage Videos Manage Photo Gallery No Tithe Site Priority Status Edit Delete Expand Replicate Manage Carousel j Hama GEMS Amencan Academy Abu 1 yall m y Replicate F tit p l 1a EE Pi hal Manage Enrolling Schools gt f 1 I Ji i os Replicate Manage Testimonials bal H Offline gy GEMS Learning Box Ot dees GEMS American Academy Abu Y Replicate Manage Making News ie Student Registrations Box 1 GEMS Educatio EMS ADAKAN Academy ADU 2 Ordine r Repecete 4 cati Dh ahi s Pai Manage Principals Messages i GEN menca I X Rephcate Manage School Calendar Ni Dh Ua Manage Newsletters GEMS Amencan Academy Abu s ie
7. may it be by title of the page keywords or by page id Example as you can see from the screenshot above a profile from the GEMS American Academy Abu Dhabi can be replicated if you wish to create profile pages for your colleagues When replicating pages you only have to change the title of the page title of the content and then the text and picture if applicable Site Name Page Title Left Menu Top Banner Page Content All fields marked are mandatory GEMS American Academy pn Academy Our School Our Team Spe Our Schools X AMAB z U Sze Tg amp Specialists Meghan Rana Support Teacher My name is Meghan O Brien Rana and am originally from Louisville Ken i the United States attended The University of Kentucky where eamed a Bachelor s Degree in Education hold teaching certificates in Elementary ducation as well as a Special Needs Certification which enables me to work th students with learning and behavior disabilities taught in New York City for ree years where began my Masters Program in Literacy Education at Hunter College Last year taughtin a small school for students with leaming disabilities in Bahrain and I m very excited to be a part of the GEMS team for the 2010 2011 school year look forward to providing learning support for students as well as collaborating with teachers about differentiation and meeting the needs of all students within the classroom Page
8. you may click Submit to save changes Page 9 of 15 GEMS CMS User Manual Part 2 GEMS Education Website Administration TOU are CUITTENTTY Managing fou arc here Manage Content gt Add Mew Page Manage Page Contents All fields marked are mandatory Manage Sete Ste Name Piease Select 7 Manage Meru Manage Users Page Tithe Manage Careers Left Menu Please Select z Menage News 7 a Top Banner Browse Manage Vadeos Manage Photo Gallery Manage Carousel Manage Enroding Schools Manage Testmomah GEMS Learreng Box Manage Making Mews Studerd Begetratons Box Mange Ponopals Menage Manage School Calendar Manage Newsletters Manage School Events Heda Manager Mange Folders rop imagas J Page Content R aite Images Mansge Fies Recycle Ban Rore Replicating Pages Using the replicate page command shortens the process of creating a page as it copies exactly the same page settings and contents including the Site Title of the page the Banner the title in the page formatting on the paragraphs and texts the keywords as well as the description fs Learn Aspire Be GEME Website Administration You are currently managing Content Pages You are here Manage Page Contents Manage Page Contents Search By Site Manage Site Status Status h Manage Menu Search By Keyword Manage Users Search By Page ID E _ Offline amp Online Manage Careers
9. GEMS CMS CMS Manual Part 2 Managing Page Contents June 2011 fs Learn Aspire Be gt Website Administration Submit Forgot Password Click here 2011 GEMS Education All rights reserved Developed by Cyber Gear by Delfin Lardizabal E Marketing Executive GEMS Education E Marketing GEMS CMS User Manual Part 2 Table of Contents Managing Page Contents Adding and Editing a page Banners and Images Inserting Images Pictures Inserting and Editing Links Inserting YouTube Videos Replicating Pages nmn Il Managing Menus A Exploring the Manage Menu Module B Adding and Editing Sub menu Items Page 20f 15 GEMS Education E Marketing 1 GEMS CMS User Manual Part 2 GEMS Education Managing Page Content The Manage Page Contents is a CMS module used to create and edit web pages in your website It is capable of searching pages from a certain site by keywords page ID and by status whether it is online or offline From the search result you may perform tasks like Replicate Share Preview Edit and Trash A Learn Aspire Be hri GUC ATION Website Administration You are currently managing Content Pages You are here Manage Page Contents Manage Page Contents Search By Site Please Select Status Status z Manage Site Search By Keyword _ _ o Manage Menu EN Manage Users Search By Page ID 2 Offline amp Online Manage Careers Manage News
10. Manage News Manage Videos Add New Page ar Manage Photo Gallery Manage Carousel No Tithe ee Status Replicate Share Preview Edit Trash Manage Enrolling Snecma GEMS American Academy Our School Our Team 1230 FA O X t y f Ba a L F i Manage Testimonials Specialists Meghan Rana GEMS Learming Box GEMS Amencan Academy Our School Our Team oO wa l Awd i 44 Spenalsts Jennifer Shatter 1238 ry _ a El Manage Making News gt GEMS Amencan Academy Our School Our Team amp Tel A Student Registrations Bax 4 Specialists Elizabeth Melzer iS Lad ai tl Manage Prnapals Me ad IS AmMmencan Academy ii r Schoo a Le a poan 1 T oe nee ee a Seme Taya OwTeam is S amp O Manage Schaal Calendar speget it lanya Sil Manace Newsiettecs GEMS American Academy Our School Our Team Ai 2 put 4 z 5 Specialists Stephanne Siberry 1234 i r Fy oy Ey wn heeeeltanage School Events E Marketing GEMS CMS User Manual Part 2 GEMS Education In order to perform the replicate action an existing page is required It may be a newly created submitted page or a page that s been sitting on the site for quite a while This is very useful when populating contents pages in the website as it saves you time and effort in putting all similar information To begin this process you need to search for a page to replicate Use the search engine of the CMS system to find the page
11. ely written page title promotes search results within the CMS as well as on the site This will also enhance search results on major Page 3 of 15 E Marketing 6 GEMS CMS User Manual Part 2 GEMS Education search engines such as Google Bing and Yahoo Example Jumeirah Primary School Our School Our Facilities Jumeirah Primary School News and Events Photo Galleries JPS Arts Festival Select the Top Banner for this page click on browse Note that the banner image must be resized and optimized The banner size should be exactly 750px width x 186px height Paste the content to the Page Content area Note to maintain a g eaz m2 the formatting and look of all websites please use the paste E a A button with T on it that is to paste text as plain text es Format the text paragraphs as necessary If there are bullets numbering in the text you need to select highlight and apply bullets numbering from the toolbar Click Submit When a page is submitted please take note of the page id The page ID will be very useful when editing a webpage B Searching and Editing a Page To edit a page open the Manage Page Contents from the left menu and use the following options 1 Search by Site 2 Search by Keyword 3 Search by Page ID 4 Search by Status By selecting any of these options and clicking the Search button this will display any page that meets the specified criteria If the Search bu
12. ents php pageid 1 134 Where contents php pageid is a constant value while 1134 is the id of an existing page you wish to link to Enter the Priority this will determine the position of the sub menu in the list Make sure the status is set to Online Click Submit button S oY You are here Manage Main Menu Manage Sub Menus for Our School Use the form below to add submenu for Our School Manage Page Contents Manage Site Manage Menu Manage Users Site GEMS Amarican Academy Abu Dhabi T Ma c 3 a A Main Menu Our School hi Manage Hews Manage Videos Sub Menu title Our Fac bes SY Menage Photo Gallery URL ener propa Same Window Manage Carousel A Proonty B integers between 1 10 Manage Enrolling Schoots Manage Testimonials Status Online Offline GEMS Learning Box Manage Making Hews Aseme J cancel Student Registrations Box C Moving a Sub menu to another Group Parent Menu You can move sub menu from its group parent menu to another parent of the same level changing the Main Menu Example if your menu is Latest Events gt Photo Galleries gt Year 5 Page 14 of 15 EDUCATION us All fields marked are mandatory by E Marketing GEMS CMS User Manual Part 2 GEMS Education Adventure you can change to Latest Events gt Photo Galleries Archive gt Year 5 Adventure To do this edit the Year 5 Adventure sub menu and then change Main Menu to Photo Gal
13. epending on the original image Example a landscape page image can have 275px X 200px or a portrait image can have 220px X 300px You can do the same provided all the widths must be according to what s defined Size of image when using it with LightBox effect Page 5 of 15 E Marketing GEMS CMS User Manua Part 2 GEMS Education If you wish to use or implement the lightbox effect you need to resize the image accordingly it s just a double of the previous image dimensions A more detailed instruction will be given on the Applying Lightbox Effect tutorial Landscape Page Image width 550px X height 440px Portrait Page Image width 440px X height 550px Note Arbitrary height can applied here When inserting the pictures in the page though the images are big enough it must De resized so that the presentation of the image would still be smaller than the lightbox images D Inserting Images Note Before inserting any image picture in the page please refer to the Image video Dimensions page as well as the Using the Media Manager page in the introductory section of this tutorial That will be your guide in uploading the right image and video size in the website On page edit mode insert the image picture on the page by using the Insert Edit image button on the tool bar see procedure below 1 Select or position your cursor where you wish to display the image You may still re locate the i
14. leries Archive Note that this procedure can be applied to both 1 and 2 level sub menus D Deleting or Hiding a Sub menu Menu items including the parent menus can be deleted or removed from the list of menus by clicking on the delete button when displayed on a list but please exercise extra caution when doing this To hide a menu simply edit the menu and then set the status to offline Page 15 of 15
15. mage once inserted in the page 2 Click on the Insert Edit Image button on the toolbar 3 Browse the Server by clicking on the Browser Server button and look for the file you wish to insert By now most of your files must have been organized according to Documents Images and Other Media So definitely you must be browsing through the images folder of your school 4 Resize the image according to width as discussed from the previous topic For landscape fat a Source Mm th F Olesu f E 32 E a Sre Insert Edit Image J Image Properties K Image Info Unk Upload Advanced URL fuploads image WIS 20images Radio_Launch GWIS5 jpg Atemative Text Width 275 Height 183 Border HSpace 2 VSpace 2 Align Figh T Image Properties Image ko Unk Upoad Advanced id Language Direction Language Code mol set 7 Long Description URL Stylesheet Classes Advisory Title Style format pictures use 275px and for portrait format pictures use 220px as the width 5 Before you click the OK button go to the Advanced tab and you need to add this parameter to the Stylesheet classes field imgborder Page 6 of 15 E Marketing GEMS CMS User Manual Part 2 GEMS Education The imgborder is a class that this will give a shadowed border around the image and the effect is only seen when the page is viewed on your browser see sample below a screenshot from GEMS Education website fs N7 Learn As
16. nd Learning etc can have the same banner all through the pages It was optional to have a different banner per page to further suit the content of the page Dimensions Page banners are measured 750px width X 186px height and they must be optimized before uploading to the website See screenshot below a page from GEMS Wellington Academy Silicon Oasis GEMS Wellington Academy SILICON OASIS lome Agmissons ducaton amp Leamin ror ParenG News amp Event MESSAGE FROM THE PRINCIPAL CEO OUR TEAM Leadership Team y i PROSPECTUS 4 y wee i ig v d b OUR FACILITIES Our School J i ONS P E DIRECTIONS amp MA SEM ling Oas i ic i gland tial d get a TH il amp i I fwd e ACADEMIC CALENDAR h h ft 3 acilit a modem camp 3 ost J ew d m Our campus provides a bnght modern well resourced environment for our students to d their learneng A special emp placed h b ACADEMY TIMINGS ntegrabon of technology into the curnculum in keeping with the educational rationale for the school and the vison of the Duba Silicon Page images on the other hand are graphic images pictures that are placed on the page content area There are two different image sizes dimensions that were defined in the page content area Landscape Page Image width 275px X height 220px Portrait Page Image width 220px X height 275px There is actually an exception to that rule height of the image can be arbitrary d
17. nk info itaget l Uskaa Aavencas After typing in the URL click on the Target oa tab to specificy where to display the content from the link It could be on a igp 7 s a pop up window New window or on the same window You may also select some other options if you are familiar about using them Browse Server_ Click the OK button when done Notice that the selected text on the paragraph is now a hyperlinked Link K Link Target Upload Advanced You may apply the same process when a spo ui Target T Frame N linking an image its just that you have to naa ai select the image before clicking the anot set gt age rame gt Insert Edit Link button lt popup window gt New Window blank Topmost Window _top Same Window _self Parent Window _parent F Inserting YouTube Video Many of you must be thinking about how to n insert Youtube videos in the page Apart from creating a Video Gallery which you can learn on the 2 part of this training manual a video from Youtube can be inserted in the page using the embed code from the Youtube site Varkey GEMS Foundation and Pratham s Summer Volunteering Programme IT S GOOD TO TALK gemseducation 37 videos Subscribe Almost Alice Best School Musical Red Queen tedur atian Almost Alice Best School Musical Tea Party Almost Alice Best School Musical by gemsed GEMS World Academy What mS Our Parents Say About Us by p mseducathgj
18. o do is to select the 3 size which is 640 pixels 4 After making these changes copy the updated code above which starts with lt iframe gt and ends with lt iframe gt tags 5 On GEMS CMS edit page click on the Source button and paste the code at a location to where you wish to put the video See screenshots below Manage Photo Gallery a gp o E Benn Manage Carousel i Ii Manage Enrolling Schools i _ heen i E E 4 Manson Testine a Page title here GEMS Learmming Box Manage Making News Varkey GEMS Foundation and Pratham s Summer Volunteering Student Registrations Box Programme It s Good to Talk Manage Fnncpals Messages Manage School Calendar Manage Newsletters 6 Paste the copied code to the content area Source code mode see screenshot below Manage News Top Banner Browse Menage Wetec Manage Photo Gallery j azn El Source an Manage Carousel Manage Enrolling Schools Manage Tezirmorasgly lt hzsPagce title hered hi gt _ n p gt dapan style font size smali gt lt astrong gt Varkey GEMS Foundation and ee Frathes s Summer Volunteering Programme iquotiiIt s Good te Manage Malong Mews Talk quot lt strong gt lt span gt lt p gt Student Legetrahans Boor Manage Prnopals Messages Manage School Calendar Manage harwshetters Manage School Events 7 Click the Source button again to go back to the normal edit mode If you are happy of how it looks like then
19. pire Be GEMS gt LIST OF OUR SCHOOLS b GEMS DIFFERENCE GEMS Core Values Prepanng ror Lire E CHOOSING THE RIGHT SCHOOL P 360 VIRTUAL TOUR ONLINE STUDENT REGISTRATION REFER A FRIEND gt ENGLISH LANGUAGE LEARNING For mere infermaton please viet ww esportedubs com E E SPORTS SUMMER CAMPS Downloads E Inserting Links There are several ways of inserting a link into the page content area e By typing pasting the link e By adding the link into the text content paragraph text e By adding the link into the image hyperlinked images pictures Just like in other programs when you type a complete URL address in the content area it automatically becomes a live link example when you type www google com or www gemseducation com it becomes a live link when you press space or enter key after the com Note that when you type a URL it must have a service protocol eg http or www or ftp followed by a dot and the domain name gemseducation com or google com On the other hand you can always insert a link in a text by way of highlighting the Ese A k amp GB B text and then clicking the insert edit link lo lt Je EE a button to display the add link dialog box r Insert Edit Link BGEMS Education Google Page 7 of 15 E Marketing GEMS CMS User Manual Part 2 GEMS Education Select the type of Protocol and then type ink gt the URL See sample screenshot Li
20. tton is clicked without selecting any option this action will display all pages from the site and are arranged according to the date when it was created or published It would be a good practice to make an inventory or list of all the pages of your school site with their details in a spreadsheet MS Excel so it would be easier to search them when needed Edit Page Options A page result will be displayed after executing a search and through that result you may perform the following actions Mattage Wes Manage Videos Manage Fhoto Gallery Dy u r Manage Carousel No Tithe Sine Status Replicate Share Preview Edit Trash K B Manage Enrolling Schools ee Manage Testimonials GEMS Learning Box Manage Making Hews Be ph Be Ci x E Replicate the page and use it as a template Share the page to other sites Preview the page on a pop up window Edit the page Delete the page og I a Page 4 of 15 E Marketing GEMS CMS User Manual Part 2 GEMS Education Note A deleted page may be recovered using the Recycle Bin however be advised that you to take precaution when pressing the Trash button G Banners and Images Page banners are images or pictures that span across while giving a nice look and appeal to the page Technically page banners are unique to every page that means it can be different from one page to another However pages from within information groups tabs such as Our school Admissions Education a
Download Pdf Manuals
Related Search