Walk Through

Creating your Student Profiles Add-On

If you don’t already have an active Add-Onsfolder for your page you will need to create one.

Right-click the Add-Ons folder and click Insert.

A menu will show up with several different Add-On options. Find Student Profile Content, then click it.

A dialog window will pop up asking you to name your Student Profile Content. Name it something related to the overall group of students to make it easier for you to edit in the future. After you are done naming it, click OK.

Now you will see new fields in your content loading dock.

First create a title for your student profile group, one that reflects the content of the group.

You can also enter a small blurb about the group in Group Information, no more than a short paragraph in length, just to summarize who these people are.

Additional Header and Additional Information are also optional. This will appear in a textbox next to your student profiles. Remember to keep them concise.

Creating Student Profiles

A pop-up window will appear asking you to name the file. Name it after the person it is profiling.

After you are done naming it, click OK.

You will now see your student folder pop up in the content tree.

There are also fresh fields in the content loading dock to the right.

Lock the page to begin editing.

Creating Student Profiles

On your newly created Student Profile, notice the vertical red bars to the left of the fields Student Full Name and Student Thumbnail. These are required in order to create the profile.

Enter in the student's full name.

Next, you will need to upload a thumbnail.

The thumbnail must be 96 pixels wide and 120 pixels tall in order to fit the profile. You must resize your images to the correct dimensions. Please check out our Pixlr tutorial on how to resize your images in an external editor.

To enter the thumbnail click the browse tab above the student thumbnail field. A window will pop up with the media library content tree on the left side.

Find your thumbnail, click it and then click OK.

Remember that the student thumbnail will be the first picture your viewer sees.

Here is how the profile should look when visitors first view the page:

Here is how the profile looks once the visitor clicks on the student profile:

Notice the X located in the right hand corner of the open textbox. Clicking that X will return the user to the textbox that was located there before.

Additional Content

You have several options when including additional features to your Student Profile.

Locate the Student Thumbnail Label field. Filling this in will create overlaying text on the student thumbnail you have uploaded and chosen.

Make sure the text is no longer than 25 characters, or it won’t fit on the image.

Student Picturegives you the option to upload a separate student image that will show up when the thumbnail image is clicked.

Student images must be 96 pixels wide and 120 pixels tall in order to fit the profile. You must resize your images to the correct dimensions. Please check out our Pixlr tutorial on how to resize your images in an external editor.

If you do not choose this option, the thumbnail you have previously chosen will be used.

Remember, pictures must be 96 pixels wide by 120 pixels height.

To upload a picture, click Browse and locate it in the media content tree. Click OK.

You can provide additional information about the student in Student Information.

To add content to the Student Information field click on the show editor above the Student Information field. It behaves like your typical text editor and allows you to enter links add font style, etc. Do not add images into this text field.

Keep the information brief and concise so the information does not drag the page length.

Once you are done, click Accept and save the page.

Here is how the page would look with all the optional fields filled out:

Once you have filled out the desired fields, click Save.

If you want to preview your work, make sure you preview it from the parent folder you created it in.

To add more profiles just repeat the steps starting at thegroup profile page.

Don’t overdo it with the student profiles, though. Anymore than 15 profiles in one group will crowd the page.

Also, a page can have more than one student profile group on the same page but having more than 18 total profiles on a page will look cluttered.

Just create the profile folder in the same Add-ons folder you started with and follow the steps from there.

Don’t forget to save your work and submit it for publishing when you are done.

FAQ

How many student profiles can I have on one page?

Anymore than 15 profiles in one group will crowd the page.

Can I sort the profiles into groups?Yes, a page can have more than one student profile group on the same page but having more than 18 total profiles on a page will look cluttered. If you would like to add another group of profiles simply add another container by right-clicking Add-Ons, then Insert, then Student Profile Content and adding a new group of student profiles.

Do they work in Tabs?The Student Profiles Add-On works in tabs!

Best Practices

Thumbnail sizes should be 96 pixels wide by 120 pixels tall. Refer to the
Web Team's Pixlr tutorial if you need more information on resizing
images.

A page can have more than one student profile group on the same page but having more than 18 total profiles on a page will look cluttered.