Portal II

1
Portal II

• Changes and
• How to Use Them

2
Container Changes - Overview

• Banner size
• Top nav color/image
• Search box lengthened
• Advanced Search button
• If HTML in title will not display code on browser
  banner/title
• Site map layout is changed

3
Banner Size

• We are now able to change the size and appearance
  of the banner, allowing us to give more room for
  the rest of the page and to change the look of
  the site seasonally.
• The area consumed by the Banner height will
  automatically resize according to the height of
  the image used for the banner.

4
Top Navigation Color/Image

• Add an asset that will be repeated in that area.
• One-pixel color
• Vertical image
• Add the image to the SITE_ASSET category.
• In the description use TOP_NAV_BG.

5
Search Box Lengthened

• The Search feature has been enhanced to give more
  room to type a search phrase.
• This change is automatic.

6
Advanced Search Button

• A link to Advanced Search features has been added
• This change is automatic.

7
If HTML in Title - Will Not Display Code in
Browser Banner/title

• If an author places HTML code in the title field,
  it will be stripped away before it is displayed
  in the browser banner/header.

• This change is automatic.

8
Site Map Layout Is Changed

• The Site Map has been reformatted and made easier
  to read.
• This change is automatic.

9
Left Navigation - Overview

• Broken Images
• Create Link Directly off of a Navigation Item

10
Broken Images

• If the image for a button is missing, the broken
  image icon will not be displayed rather, the
  text for the button will be displayed in its
  place.
• This change is automatic.

11
Create Link Directly off of a Navigation Item

• Create the category
• Set the Page Layout to Full Content
• Create content in that category as follows
• Make the Content Type Link
• Complete the rest of the link items
• DO NOT create subcategories under this left
  navigation category. Because the link will go to
  a different site or page, there is no place for
  the sub-categories to be displayed.

12
Body Changes - Overview

• Printer Friendly on component page
• Body Tighter Less spacing
• Bullet goes away if image is associated to item
  and is on the left
• Text wraps around image in component
• Can place two title images in a component one
  on top and one to the left or right.
• Position title image to the top, left, or right.

13
Body Changes - Continued

• Can select if associated image appears in
  Component, Body or both
• If title is blank field or only has a space, will
  eliminate space for title and pull it up
• When adding/editing content can specify as triple
  wide
• New layout content archive
• When linking to a document automatically displays
  image of file type
• List with more component

14
Printer Friendly on Component Page

• All pages will now have the Printer Friendly
  link, including pages with components.
• This change is automatic.

15
Body Tighter Less Space

• The body spacing has been tightened up to allow
  more information to be displayed.
• This change is automatic.

16
Bullet Replaced by Image When Associated Image is
on Left

• When
• Image is associated to a piece of content
• Associated on the left side of the component
• What
• The bullet will not be used for that item only
• The image will take the place of the bullet
• This change is automatic

17
Text Wraps Around Image in a Component

• The text of the component now wraps around the
  images when the images are on the left side of
  the component.
• This change is automatic.

18
Issue with above change

• The above change prevents you from having an
  image to the left that spans all the content. For
  example, previously the second and third bullets
  were on the right side of this image

19
Resolution to Issue

• Can now place two title images in a component
• one on top
• one to the left or right

20
Display Two Title Images with a Component

• Do not associate the image to any content. OR
• Do not display associated content images in
  component
• In the Component Modifier, enter the Asset ID for
  the image in the Title Text field for the image
  on the side
• The Title Image Location field applies to the
  image in the Title Text field when there is an
  Asset ID number in that field.
• If there is no Asset ID number in the Title Text
  field, then the Title Image Location field
  applies to the Title Image field.

21
Set Position of Component Title Image

• A title image for a component can be placed on
  the top of a component, as it is now, or to the
  left or right of a component.
• In the Component Modifier, under the Title Image
  field, there is now a field for Title Image
  Location with radio buttons for Top, Left and
  Right. Top will always be the default.

22
Display Associated Image in Component, Body or
Both

• Previously an associated image would
  automatically appear in both the component and in
  the body of the content.
• Now the content author has the ability to choose
  in which element it will appear.
• Component
• Body
• Both

23
Selecting Component, Body, or Both

• First associate the asset then click the Edit
  link on the right.
• To have the asset display in BOTH places, do
  nothing or select None.
• To have the asset display in only the COMPONENT,
  select Component Only
• To have the asset display in only the BODY of the
  Content, select Content Only.

24
Tip

• Using this method you could associate two image
  assets to the content, then
• Select Component Only for one
• Content Only for the other
• This would allow you to have one image in the
  component and a different image in the body of
  the content.

25
Blank Title Field Spacing Eliminated

• If the author wants to omit the title field, s/he
  is obliged to put a space in the field. When this
  is done, the space is displayed and there is too
  much white space at the top of the component.
• Now the space will be recognized and the
  Description Field shifted up.
• This change is automatic.

26
Triple-Wide Page

• A triple-wide page can now be used at any time
• Add/Edit Content Item
• Check box immediately below the Priority field
• Specify this content as Full Display (triplewide)

27
New Layouts/Templates - Overview

• Content Archive
• Basic List with gtMore
• SOM Home

28
Content Archive

• Automatically creates an archive of content in
  that category according to your specifications.
  By
• Month
• Quarter
• Season
• Alpha

29
Content Archive Continued

• Select Content Archive as a page layout
• Select the Content Archive component from the
  drop-down list
• In the Style field select how you want the
  archived categorized.

30
Basic List with gtMore

• One of the single wide components is replaced
  with a new component
• List with gtmore
• Instructions to follow

31
SOM Home

• Double Wide with an Image
• 2 components 300 px 100 px
• Second is a List gt more
• Double Wide
• 2 components 300 px 100 px
• Second is a List gt more

32
List with gtmore Component

• In the Component Modifier, select the ListgtMORE
  component.
• Set the length of the list in the component from
  the List Length field

33
List with gtmore Component

• To turn the component into a select list drop
  down box, in the Style field, choose SELECT_LIST.
  You can then specify the text size and the list
  width.

34
Automatically Displays Image of File Type

• When there is a link to a non-HTML page, such as
  a PDF file or Word Document, an image will be
  displayed beside the link indicating what type of
  file it is.
• (This applies to Link type content and Associated
  Assets only)
• This change is automatic.

35
Right Navigation - Overview

• More State Web Sites on Right
• Related Content
• Space in title content not shown
•  Duplicate content not displayed
•  Content with no body not displayed
•  Related content 20

36
Right Navigation - Overview

• Quick Links
• More Quick Links
•  Defined separately
•  Quick Links appearance
•  Dont have to display global
• Right Links
• Right Links
•  Right links can be text or image links
•  Can be an HTML include file with or without an
  asset
•  Heading for the Right Links can be an image

37
More State Web Sites on Right

• The link to all of the State Web Sites
• Moved to the top of the right navigation
• It is larger more visible
• On every page that displays the right navigation
• This change is automatic.

38
Related Content

• Space in title field content not displayed
• Duplicate content not displayed
• Content with no body not displayed
• Related content now shows 20 items
• NOTE Make sure that any content that should not
  be displayed in related content is expired or
  otherwise removed.
• These changes are automatic

39
Quick Links

• More Quick Links
• Can now display 12 Global and 12 Local quicklinks
• Defined separately
• Global and Local quicklinks will be displayed
  separately with their own headings
• To modify the heading, in the Quiklinks category,
  edit the Display Text.

40
Quick Links

• Quick Links appearance has been tightened up so
  that they dont take up as much room.

41
Quick Links

• Global Quick Links do not need to be displayed on
  all pages.
• Edit Category for the sub-categorys quicklinks
• Place the term (all caps) NO_GLOBAL in the Short
  Display Text field

42
Right Links

• The ability to display Right Links has been added
  (similar to Left Links)
• Right links can be text or image links
• Can be an HTML include file with or without an
  asset
• Heading for the Right Links can be an image

43
Right LinksExample
44
CMA - Overview

• Categorized Call can be sorted by alpha or date
• EWD Home link added to top nav of CMA
• No color fields displayed in edit/add category
  when not applicable
• Browse category has link for category tree
• Edit Category has links to Add Child Cat Add
  New Content
• Edit Category has link to Browse Cat
• Cache managers can do cache clear from production
  preview
• Added information to the top of the Component
  Modifier screen.
• Can use style sheet to change font colors, link
  colors, background colors, etc.

45
Categorized Call Sort

• Can be sorted by alpha or date
• In Component Modifier, there is now a Sort field.
• Select ALPHA from the drop down box.
• This will sort the categories and the content
  alphabetically.
• STANDARD will sort the categories by priority and
  the content within the categories by release date.

46
EWD Home Link Added to Top Nav of CMA

• On the top navigation of the CMA a link has been
  added to the EWD website.
• This will take the user to http//www.michigan.gov
  /e-michigan

47
Color Fields in Category Edit

• The color fields only apply to the TOP_LEVEL
  category.
• They have been removed from all other category
  levels.
• This change is automatic.

48
Category Tree

• A link has been added to the Browse Category
  screens
• Category tree
• Starting from the current category

49
Edit Category

• Links at the top of the Edit Category screen
• Add Child Category
• Add New Content

50
Edit Category

• Link to Browse Category
• This change is automatic

51
Cache Managers

• Cache clear can be done from production preview
• Links have been added in key locations to allow
  the admin to clear the cache
• The cache admin must be signed into the CMA

52
Component Modifier

• Displays what category the components will be
  applied to.
• Links to
• Browse the category
• Edit the category

53
Style Sheet

• Site administrators can create style sheets for
• Alternating colors for Quick Links and Right
  Links
• Monthly Index month and year colors
• FAQ link colors
• Top and Bottom navigation link colors

54
Style Sheets

• To create a style sheet, contact your CMA
  representative in e-Michigan for further
  instructions. E-Michigan will assist you with the
  format of the style sheet and will upload the
  style sheet for you.

55
Behind the Scenes

• The layout of the table structure for the
  container was changed.
• Style sheets were added to accommodate
  differences in display between Netscape and IE.

56
QuestionsComments