Changes

||56 112 pixels high (the width of the logo can vary but something around only 250 pixels wide or less is recommended).

# ::: {{Icon-Menu}}: :* Select '''Global Settings'''.# :* Click on the '''Branding''' tab.# :* For '''Logo''' click on the '''Browse…''' button, which looks like an open folder and select the desired file you want to upload.# :* Click the '''Upload''' button.# :* Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC).

:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# For '''Favicon''' click on the '''Browse…''' button which looks like an open folder and select the desired file.:# Click the '''Upload''' button.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC). ==Compact Header==Use the compact header for a cleaner and more streamlined look. This header option, gives you more screen real-estate to work within. Toggle this setting on or off based on your preference. Note this setting applies to all users of the system. [[File:branding-main-heading-2-2019.png|thumb|none|500px|Compact header]] ===How to enable the Compact Header===:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# Toggle on '''Enable Compact Header'''.:# Click the '''Save''' button.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC).

:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# Click the '''Colors & Styles''' link.:# Click on the desired color picker to choose a new color or enter a Hexadecimal value (example: #000000). You may also want to choose some style options that appear under the select one inputs.:# Click '''Save'''.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC).

||: If you want a gradient on your buttons, choose a slightly lighter hue or tint of the background color. This setting gives buttons a slight 3D appearance. Typically, the button foreground and background are set to the same color giving buttons a flat look.

:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# Click the '''Colors & Styles''' link.:# In the action bar located near the header click on the '''Export Styles''' button.:# A modal window will open. Copy the code in the modal window.:# Go to the system where you want to apply these styles.:# Follow steps 1 to 4 above.:# In the action bar located near the header, click on the '''Import Styles''' button.:# Paste the styles you copied into the modal window of the desired system.:# Click the '''Import Styles''' button on the bottom of the modal window.:# Click '''OK''' on the alert.:# Close the alert and the modal window.:# Click '''Save'''.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC). ==Tip: Image sizing and compression==When you upload images to your SmartSimple system, always size them to the desired dimensions and format. This usually involves resizing the chosen image and saving it as optimized in photo editing software such as Adobe Photoshop. For example, if you upload a 16MB image it will take several seconds to download and display plus it will use up more of your client’s data. Conversely the same Image could be saved in JPG format at medium compression and its file size will be less than 0.1MB which will load instantly with no discernible difference to the look and feel. Generally, files should be saved in JPG or PNG format and make use of compression options. Joint Photographic Experts Group (JPG/JPEG) is a lossy format best for photos such as an image of people or a landscape. Portable Network Graphics (PNG) is a lossless format that supports transparency and is best suited for logos and graphics. ==Tip: Sourcing imagery==Don’t have photos to use in your SmartSimple system? Here are some websites that offer copyright free stock photos for commercial use. Find the images you want, crop and size the images then upload them into SmartSimple. https://unsplash.com/ https://gratisography.com/ https://morguefile.com/ https://pixabay.com/ https://www.stockvault.net/ https://www.pexels.com/ https://picjumbo.com/ https://www.rawpixel.com/ https://www.reshot.com/  You may also want to check out the following paid stock photo sites. https://www.iStockphoto.com https://www.Shutterstock.com  For free icons https://www.flaticon.com/