Experiencing an issue?

Adding a Multilingual Page Link

The Multilingual Component is a handy link tool if you have website content in more than one language. The tool provides an easy to find menu link that connects your Chinese pages to content in other languages. Link to pages on the same site or different websites.

For maximum visibility, place the Multilingual Component in the header.

 

multi-6a.png

 

 

1  Inserting the Multilingual Component

This procedure describes how to place the Multilingual Component in the header.

  1. Click WEBSITE on the top menu bar. 
  2. On the left side menu, select the CONTENT folder and then click Manage. The Website Content page displays. 
  3. Hover the mouse pointer on the Homepage.
  4. Click the Edit button. The Edit Content area opens.
  5. Hover the mouse pointer on the header.
  6. Click the Edit Header Pencil button. The edit panel opens.
  7. Drag the Multilingual Component into an empty space in the header.
  8. Hover the mouse pointer on the Multilingual Component.
  9. Click the Settings button in the left corner of the toolbar. The Settings panel opens.

 

multi-1a.png

 

2  Adding a language and link

  1. Click the Languages tab. English is the preset language.
  2. Highlight English with the mouse pointer and then click the Pencil button. The Language Settings panel displays.
  3. In the Language field, type the name of a new language, if desired.
  4. In the Page URL field, click the Pencil button. Check the link of an existing webpage on the Sinorbis site or enter the URL of another page. Include the http:// or https:// prefix.
  5. Check the Default Language box, if prefered.
  6. Click OK.
  7. Click the green + sign to add a new language.
  8. Repeat process to add a new link.

 

multi-2a.png

 

3  Customising link appearance

Modify the design and appearance of the multilingual link.

  1. Hover the mouse pointer on the Multilingual Component.
  2. Click the Settings panel on the toolbar.
  3. Click the Appearance tab. The Appearance Settings panel displays.

 

mutli-3b.png

 

Alignment

Choose the way content displays in the component: to the left, in the centre, or to the right. This feature works when Width is set to a figure of less than 100%.

Height

Click the plus (+) or minus (-) boxes to increase or decrease the height of the component.

Width

Click the plus (+) or minus (-) boxes to increase or decrease the width of the component.

Font Size

Click the plus (+) or minus (-) boxes to increase or decrease the font size. The maximum size is 40 px.

Font

Change the Simplified Chinese and English font families.

Font Color

Choose the text colour. Click the square button to open the Colour Picker. Choose one of your branding colours (if selected) or a colour from the palette. Click the box with a red line to select a transparent background. For information about branding colours, see:

Background Color

Open the Colour Picker and set the colour behind the text. Choose one of your branding colours (if selected) or a colour from the palette.

Background Hover Color

Change the background colour when the mouse pointer hovers the multilingual component. Choose one of your branding colours (if selected) or a colour from the palette.

Background Hover Font Color

Change the text colour when the mouse pointer hovers the multilingual component. Choose one of your branding colours (if selected) or a colour from the palette. 

List Background Hover Color

Change the colour of the text background when the mouse pointer hovers a language item in a list. Choose one of your branding colours (if selected) or a colour from the palette.

List Font Hover Color

Change the text colour when the mouse pointer hovers a language item in a list. Choose one of your branding colours (if selected) or a colour from the palette.

 

4  Customising Spacing

Click the plus (+) or minus (-) boxes to increase or decrease the padding and margins.

 

5  Customising Advanced features

ID or Class Name

To learn about custom styling with ID and Class Name selectors, see:

Component Visibility

Control which devices display the content. The default is all devices. To learn about visibility settings, see:

Related articles