This guide explains the layout options for your new IdeaScale community’s custom landing page, and the inner community pages. We’ve provided you with a number of options for quickly and beautifully representing your brand, while simultaneously ensuring code maintainability and mobile-responsiveness across diverse screen sizes.

To read about general custom layout guidelines and tips, click here.

Otherwise, let’s jump into the options you have when setting up your community:

You can communicate your landing page and color preferences to your account manager using the Custom Landing Page Feature Request Form. Please ask your Innovation Architect for more information.

Landing Page Options


 

custom layout form

 

<br/ >

Here are some sample communities you may view, to get an idea of what is possible for you to create with the options outlined here:


Back to Top

Quick Image Size Reference

When you set up your community, you’ll have to upload images. Here’s a quick reference about optimal sizes of the various images:

Image Recommended Size (pixels)

Hero/Slider Image

hero

1130×500

Campaign Banner/Logo

small banner

At least 690 x 518, and should contrast well against white text

Community Banner

small banner

1130 x 150

Back to Top

 

Colors

Representing your brand is simple.

You may choose three colors:

  • Highlight color: this color is used to call out specific action items in the community and should also contrast well with white
  • Accent color 1: Should be more muted than the highlight and contrast well with white.
  • Accent color 2: we recommend a slightly lighter version of the first accent color that contrasts well with white
You can choose three colors.
Here's the application of those colors

You can communicate your color choices to your account manager using the Custom Landing Page Feature Request Form. Please ask your IA for more information.

Back to Top

Landing Page Options

Widget Description Options

Hero/Carousel

hero

The hero or carousel is the first item on the custom landing page. You may choose up to five slide images and associated header, text and buttons for the hero.
If you don’t want the carousel functionality, you may choose a single image and a frozen slide or simple “hero” image and associated title text and buttons.
For each carousel slide, you may choose any combination of the following:

  • One title item, up to 25 characters (including spaces)
  • One description paragraph, up to 250 characters (including spaces).
  • Up to two action buttons

In addition to choosing a responsive image, consider a 1300 x 700 pixel image that is not so busy or bright that it will make any text you choose to place on your slide illegible.

Welcome Area

hero

Greet your users with this widget which displays the logged in username. You can customize the line of text under the username.

Active Campaigns

active campaign with campaign logo

If you’ve added campaign logos to your campaigns, then you might try this layout, which smartly displays the campaign title over a campaign logo. We recommend a darker, quiet campaign logo. Also, keep in mind that the image has to hold up against different responsive views. The campaign title is limited to 100 characters (including spaces), and the campaign description is limited to 360 characters of html-sanitized text, (including spaces). You can set the logo for each campaign in the campaign setup. Recommended size: 690 x 500px.

General Text Area

general text area

White text on your first accent color. You can select the text you’d like to appear here.

Pinned Ideas

fun pinned ideas

A fun layout for pinned ideas that you wish to showcase.

Callout Ideas

callout ideas

Another fun way to display ideas and increase engagement and highlight active users. Title limited to 35 characters (including spaces), and description to 120 characters (including spaces).

Discussion Tags

The tags widget uses a algorithm to create a word cloud of the most popular tags in your community.

The tags widget uses a algorithm to create a word cloud of the most popular tags in your community. The boldest/largest/darkest words are the highest frequency tags, and the smallest/lightest words appear with least frequency. Clicking on a tag loads search results for for that tag on ideas in your community.

Video

Video

A video on your first accent color Please upload your video to YouTube for easy embedding

Footer

The footer provides four columns for you to provide categorized links.

The footer provides four columns for you to provide categorized links All of the links are customizable


Back to Top