Large Button Element

Prerequisites

Example of Large Button

Step 1: Find and Resize Your Image

1. Find an image that will work well with whatever content you are linking to.
2. The image height should be 60% of its width, so you may need to crop or resize it.
3. The dimensions of the image depends on the size of the container you are putting it in. The below assume that you are using the left navigation:
   • 33%
     • With nav: ~325px
     • Without nav: ~400px
   • 50%
     • With nav: ~425px wide
     • Without nav: ~575px wide
   • 66%
     • With nav: ~575px wide
     • Without nav: ~775px wide
   • 100%: Don't use this element in 100% wide containers.
4. Tutorial on resizing images.

Step 2: Insert the Large Button Element

1. Log in to CommonSpot and go into Author or Edit mode.
2. Choose the container you want to put this large button in.
3. Click on "Insert new element"at the bottom of the container.
4. Click on the CIN category.
5. Click on the Button - Large element.

Step 3: Define the Large Button Element

1. The Large Button element is now inside your container.
2. Click Click here to define the Button - Large element at the bottom of your container.
3. Text: This text will appear on top of your image.
4. URL: The page you want to send people to.
5. Background Image: This will be the button's background image.
   • Tutorial on uploading images

Step 4: Publish Your Changes

At this point you have made two changes that need to be published; adding the large button element to the container, and defining the large button element. Both changes will need to be submitted before the public sees your button.