{"type":"doc","content":[{"type":"paragraph","content":[{"text":"This guide will show you how to create an Accordion with a different look at feel to our existing built in Accordion template.","type":"text"}]},{"type":"paragraph","content":[{"text":"It would be useful to understand some CSS and HTML before you attempt to create bespoke Content Types.","type":"text"}]},{"type":"paragraph","content":[{"text":"At this time we do not fully support bespoke CSS but understand that our customers would like the freedom to add their own stylesheets and templates to meet branding guidelines.","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Guide Overview","type":"text"}]},{"type":"paragraph","content":[{"text":"In myday, there is particular order in which to carry out the steps when creating a new Content Type:","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Create new stylesheet - this will allow you to change the colours, fonts and formatting of the Accordion","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Create a new template - this will allow you to change the structure of the Accordion","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Create a new Content Type - this will allow you to generate new Accordions based on the the bespoke design you create in steps 1 and 2","type":"text"}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Step One - Create a stylesheet","type":"text"}]},{"type":"paragraph","content":[{"text":"Navigate to Content Management/Advanced/Stylesheets","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1912,"id":"efc32b67-ffdf-4b4f-bb0e-a76d6933bd0b","collection":"contentId-139919444","type":"file","height":778}}]},{"type":"paragraph","content":[{"text":"Click on “Create New”","type":"text"}]},{"type":"paragraph","content":[{"text":"Enter a display name and logical name (all lowercase, no spaces) for your stylesheet .","type":"text"}]},{"type":"paragraph","content":[{"text":"Apply the style sheet code to the right hand window","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1650,"id":"37f10391-10ac-4367-aac1-29f5e2b26d11","collection":"contentId-139919444","type":"file","height":879}},{"type":"caption","content":[{"text":"In this example the colours of the accordion are being changed to match institution branding","type":"text"}]}]},{"type":"paragraph","content":[{"text":"Click on Save","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Step Two - Create a template","type":"text"}]},{"type":"paragraph","content":[{"text":"Navigate to Content Management/Advanced/Templates","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1650,"id":"727af62d-4887-44cd-8c83-86301e27eb78","collection":"contentId-139919444","type":"file","height":196}}]},{"type":"paragraph","content":[{"text":"Click on “Create new”","type":"text"}]},{"type":"paragraph","content":[{"text":"Enter a Display Name, logical name and Description for your template","type":"text"}]},{"type":"paragraph","content":[{"text":"Select “Content” under Type","type":"text"}]},{"type":"paragraph","content":[{"text":"Select the style sheet you just created from the Stylesheet dropdown list","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1650,"id":"e33b7856-b561-4e49-9dd4-2753c1d0e372","collection":"contentId-139919444","type":"file","height":873}}]},{"type":"paragraph","content":[{"text":"At this point you can either copy and paste an existing template or you can use the attached code which will create you a blank accordion","type":"text"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"text":"

\n\n\n\n\n

Your content for item 1.

\n\n\n

Your content for item 2.

\n \n\n

Your content for item 3.

\n\n\n

Your content for item 4.

\n\n\n

Your content for item 5.

\n \n\n","type":"text"}]},{"type":"paragraph","content":[{"text":"Click on Save","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Step Three- Create a content type","type":"text"}]},{"type":"paragraph","content":[{"text":"Navigate to Content Management/Advanced/Content Types","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1658,"id":"c3d0f8f2-7614-4e95-b183-cc59a7836a9f","collection":"contentId-139919444","type":"file","height":205}}]},{"type":"paragraph","content":[{"text":"Click on “Create New”","type":"text"}]},{"type":"paragraph","content":[{"text":"Enter a Display Name, logical name and Description for your content type","type":"text"}]},{"type":"paragraph","content":[{"text":"Tick the “Can be used as a root content type” tick box","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1003,"id":"5e9cac15-e302-4d07-8714-7bc9d37e1284","collection":"contentId-139919444","type":"file","height":449}}]},{"type":"paragraph","content":[{"text":"Leave “Allowed Child Items” as default setting","type":"text"}]},{"type":"paragraph","content":[{"text":"Select the template you just created from the “Allowed Templates” drop down","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":269,"id":"c36aee12-3555-4560-89c7-14f2719f7f93","collection":"contentId-139919444","type":"file","height":200}}]},{"type":"paragraph","content":[{"text":"Select the template you just created from the “Default template” dropdown list","type":"text"}]},{"type":"paragraph","content":[{"text":"Click Save","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Step Four- Create content from your new content type","type":"text"}]},{"type":"paragraph","content":[{"text":"Navigate to “Content Management/Content”","type":"text"}]},{"type":"paragraph","content":[{"text":"Select your newly created content type from the list in the left hand panel","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1924,"id":"9f0bf933-1094-46f5-8d2f-e9b9c914e134","collection":"contentId-139919444","type":"file","height":680}}]},{"type":"paragraph","content":[{"text":"Click on “Create new FAQ Accordion”","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1651,"id":"36adb6b3-5bf0-4b00-8757-83652f475012","collection":"contentId-139919444","type":"file","height":383}}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":749,"id":"253c0285-8a82-4165-be87-06200a845d81","collection":"contentId-139919444","type":"file","height":660}}]},{"type":"paragraph"},{"type":"paragraph","content":[{"text":"Enter the Display Name, Path (lowercase, no spaces)","type":"text"}]},{"type":"paragraph","content":[{"text":"Make sure that the content type matches the one you just created","type":"text"}]},{"type":"paragraph","content":[{"text":"Select the template you created from the “Template” drop down list","type":"text"}]},{"type":"paragraph","content":[{"text":"Click “Save”","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1653,"id":"59208616-d95f-41d5-a47a-12e21491fa29","collection":"contentId-139919444","type":"file","height":607}}]},{"type":"paragraph"},{"type":"paragraph","content":[{"text":"On the next screen click on “Save Changes” then “Save and Publish” ","type":"text"}]},{"type":"paragraph","content":[{"text":"Click on “Preview Published page” to see your accordion","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":1650,"id":"b2c55d12-d149-49b6-9f2b-f2967ab4aa5e","collection":"contentId-139919444","type":"file","height":710}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Editing your Accordion","type":"text"}]},{"type":"paragraph","content":[{"text":"The content of the accordion is created within the template itself, so you may want to build your template in notepad first and then paste into the template content.","type":"text"}]}],"version":1}

Item 1

Item 2

Item 3

Item 4

Item 5

Browser not supported