3 Column block/Twitter
@imperialcollege
Tweets by imperialcollegeGive it a try
Adding a 3 Column block/Twitter is a three stage process. (The first part is identical to creating a 3 Column block).
Stage one
1. Create a hidden sub-section (sub-folder) of the section where the 3 Column block/Twitter will live. This folder needs to be called 'Column block' (case sensitive).
Stage two
2. Then create a second hidden sub-section as a child of this page. This can be called anything you like. This will contain the links and images for each column. In this example it's been named column items 1.
Remember, each separate instance of a 3 Column block on a single page will need its own sub-section, the second block could have it's section named column items 2. See example below:
3. To your hidden section, e.g. column items 1 add a 3 Column block item content type (find out how to add a content type to a section)
(This first item populates the left most column in the block.)
4. A form with a number of fields will appear. Each of these fields relates to the components of your 1st Column, fill in the form, example below:
Field title | What should I do? | Is it compulsory? |
---|---|---|
Name* | There will be three of these content types (one for each column), in this example we've named this links col 1 | Yes |
Title* | Adds a heading to the column | No |
Show block title | Ticking this box will make the heading show to all users, not just screenreaders | No |
Image | Add an image, at least 332 x 212 pixels is required | No |
Link Text 1* | This is the first link in the column's list | Yes |
Link 1 Internal | Use the Select link to add an internal link OR | No, but each added link must be created or the formatting won't work correctly |
Link 1 External | Copy and paste URL from external website OR | No, but each added link must be created or the formatting won't work correctly |
Link 1 Media Library | Add a document (pdf, Word, Powerpoint etc.,) from the Media Library | No, but each added link must be created or the formatting won't work correctly |
Link Text 2 | This is the second link in the column's list | No |
Link 2 Internal | Use the Select link to add an internal link OR | No, but each added link must be created or the formatting won't work correctly |
Link 2 External | Copy and paste URL from external website OR | No, but each added link must be created or the formatting won't work correctly |
Link 2 Media Library | Add a document (pdf, Word, Powerpoint etc.,) from the Media Library | No, but each added link must be created or the formatting won't work correctly |
Link Text 3 | This is the third link in the column's list. All links now on are optional | No |
Link 3 Internal | Use the Select link to add an internal link OR | No, but each added link must be created or the formatting won't work correctly |
Link 3 External | Copy and paste URL from external website OR | No, but each added link must be created or the formatting won't work correctly |
Link 3 Media Library | Add a document (pdf, Word, Powerpoint etc.,) from the Media Library | No, but each added link must be created or the formatting won't work correctly |
Links 4 to 10 | The same pattern of fields repeats for every link | No |
5. Click Add & Approve to save
6. You'll need to create a 3 Column block item for each of the 3 columns in the block. (3 x 3 Column block item.) For consistency in this example links col 2 and links col 3. (Repeat steps 2-5 twice.)
7. Once these are in place you can modify the content list in your folder, example, column items 1 and should look like the screenshot below:
Stage three
We can now tie the whole thing together.
8. Add a 3 Column block/Twitter content type to the section (page) where the block is to appear, in the example, the section is called 3 Column block/Twitter (the parent of column items 1). See above.
9. A form for your Twitter account with a number of fields will appear. Each of these fields relates to the components of your Twitter feed, fill in the form, example below:
Field title | What should I do? | Is it compulsory? |
---|---|---|
Name* | Name the block and give it a concise description | Yes |
Twitter Search Term* | Add the username or hashtag. In this case we used: @imperialcollege | Yes |
Twitter Embed Code* | Enter the Twitter Embed code - How to generate your Twitter Embed Code | Yes |
Twitter Link* | The URL of the Twitter feed you're displaying. eg. https://twitter.com/imperialcollege | Yes |
Find items* | Select the section column 1 items. This ties the Column block items built earlier to the rest of the block. | Yes |
Display items* | Defaults to ticked | Yes |
Twitter Widget - please do not use | This is a redundant field |
The Find items field in this content type tells the content type where to find the links.
11. Click Add & Approve to save.
As the name suggests 3 Column block/Twitter is very similar to the 3 Column block.
This block gives users a quick way to add lists of links. It's for use on all page layouts.
Each row must have a minimum of two links and a maximum of ten. The picture at the top is optional but for the sake of balance, it looks best if images feature across all three columns or no columns.
Multiple blocks can be added to pages.