Profile Page Design Overview | Qsuite Help Desk

The Profile Page Design allows you to preview your changes to the look and feel of your Profile interface as you make them.

Layout & Design is where you set the base color styling for your Profile page.

Page Background

Page Background enables you to change the outside border settings.

Background Image: You can use an image for the outer border. Click + Add New to upload a new image, click Select Existing icon to choose an image file from your existing library, or click the Remove icon to remove a currently selected image. If an image is uploaded, you can control the image repetition horizontally (Repeat Across), vertically (Repeat Down), or you can tile the image (Repeat Both).
Background Color: Set the background color for the outer border. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.

Click [Apply] to update your Profile page.

Page Foreground

Page Foreground enables you to edit the inner form background and font attributes.

Foreground Color: Set the inside color for the Profile interface. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.
Foreground Opacity: Set the opacity for the entire foreground so the background can show through. This setting affects all the foreground elements including the Header, Footer, Text, Data Fields, etc.
Rounded Corners: Set the degree of roundness to the section corners.
Border Size: Set the thickness of the section border.
Border Color: Set the color for the section border. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.
Shadow Distance: Set the section shadow distance in pixels (shadow falls to the right).
Shadow Color: Set the color for the shadow. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.
Font Type: Select a font from the drop-down.
Font Weight: Sets normal or Bold text.
Font Style: Sets normal or Italic text.
Font Color: Set the color for the font. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.

Click [Apply] to update your Profile page.

You can include an optional Header and/or Footer on your Profile interface to further brand and style the page to better represent your organization.

Header

You can include a header on your Profile page.

Background Image: You can use an image for the header. Click + Add New to upload a new image, click Select Existing icon to choose an image file from your existing library, or click the Remove icon to remove a currently selected image. The ideal banner width is 900 pixels, but Qsuite will resize to fit the width, unless you check the box to maintain the original dimensions. If an image is uploaded, you can control the image repetition horizontally (Repeat Across), vertically (Repeat Down), or you can tile the image (Repeat Both).
Height: Set the height (in pixels) of the header.
Background Color: Set the background color for the header section. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.
Text: Enter a title or other text that will appear in the header. Text will appear over a header image if you upload an image.
Font Type: Select a font for the header text.
Font Weight: Sets normal or Bold text.
Font Style: Sets normal or Italic text.
Font Color: Set the color for the font. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.
Alignment: Set the header text alignment to Left, Center, or Right.
Vertical Alignment: Set the header text vertical alignment to Top, Middle, or Bottom.

Click [Apply] to update your Profile page.

Footer

You can include a footer on your Giving Page.

Background Image: You can use an image for the footer. Click + Add New to upload a new image, click Select Existing icon to choose an image file from your existing library, or click the Remove icon to remove a currently selected image. If an image is uploaded, you can control the image repetition horizontally (Repeat Across), vertically (Repeat Down), or you can tile the image (Repeat Both).
Height: Set the height (in pixels) of the footer.
Background Color: Set the background color for the footer. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.
Text: Enter text that will appear in the footer.
Font Type: Select a font for the footer text.
Font Weight: Sets normal or Bold text.
Font Style: Sets normal or Italic text.
Font Color: Set the color for the font. You can enter a Hex Color Code (if known) or select a color and shade using the color picker located to the right of the hex code field.
Alignment: Set the footer text alignment to Left, Center, or Right.
Vertical Alignment: Set the footer text vertical alignment to Top, Middle, or Bottom.
Include Powered by Q and Security Metrics logos checkbox: You can include “Powered by Q” and the “Security Metrics Credit Card SAFE” logos in the footer.

Click [Apply] to update your Profile page.