Developer Hub » Image Settings » Profile Photos, Logos & Cover

Link: https://support.brilliantdirectories.com/support/solutions/articles/12000019275-developer-hub-image-settings-profile-photos-logos-cover

IMPORTANT NOTE: Unless the site has heavy customizations to the underlying code of the website's design, there is no need to touch these settings as they will already be optimized for use around the website.


This article will cover the image settings for the following:

  • Profile Photo for Website
  • Profile Photo for Social Media Sharing
  • Profile Logo for Website 
  • Profile Logo for Social Media Sharing
  • Profile Cover

When viewing the Image Settings page, the settings covered here can be seen in this section:



Additional Information:

Profile Logo Settings


Here are some things to know regarding editing Profile Logo:

  • The ratio of the Profile Logo will always be "Open" so members are not forced to upload a logo that is a certain shape - it can be square, wider than it is tall, or taller than it is wide.

  • Since the ratio is always "Open", the "Width" and "Height" numbers serve as limits for the maximum width and height of the image.  For example, if both the Width and height are set to 200px, and a member uploads an image that is 2000px wide x 2000px tall, the final image will be resized to be 200px wide x 200px tall, maintaining the same aspect ratio of the original image, but downsizing it to be no more than the 200px x 200px limit.  This helps ensure that the website loads these images as quickly and efficiently as possible, thus reducing the overall time to load all of the website's pages as much as possible.



  • Attempting to set the "Profile Logo" width to be less than 162px, an error message will appear:



    This is done to make sure that large images are resized to dimensions that will look relatively uniform in the various areas of the website where profile logos are used.


  • Attempting to set the "Profile Logo Social Media" dimensions to be less than the required 200px x 200px, an error message will appear:



Profile Photo Settings


The Profile Photo Settings work very similarly to the Profile Logo Settings, with the one difference being that the Aspect Ratio for Profile Photos is always 3:4.  This is done to ensure these images fit as well possible in the various areas of the website where profile photos are displayed:




Please note: Changing the Aspect Ratio of this is possible, but not recommended.  Doing so would require customizing the design of the website significantly in order to accommodate a different aspect ratio for these images around the website and should only be requested by Advanced Users of the software that have significant experience in customizing the design of Brilliant Directories websites. 



Profile Cover Settings


Here are some things to know regarding editing Profile Logo:

  • The ratio of the Profile Cover will always be "Open" so members are not forced to upload an image that is a certain shape - wider than it is tall, or taller than it is wide.

  • Since the ratio is always "Open", the "Width" and "Height" numbers serve as limits for the maximum width and height of the image.  For example, if the Width and height are set to 1200px x 500px, and a member uploads an image that is 2000px wide x 800px tall, the final image will be resized to be 1200px wide x 500px tall, maintaining the same aspect ratio of the original image, but downsizing it to be no more than the limit.  This helps ensure that the website loads these images as quickly and efficiently as possible, thus reducing the overall time to load all of the website's pages as much as possible. 




How To Upload Logo Images As A Member


  1. Login as a member and go to the "Profile Photo" Tab

  2. Click on "Upload Logo":



  3. Select an image to upload:


  4. Click on Upload Image. If the logo is not large enough the member will receive the following message, warning them that the current image is smaller than 200px x 200px and will have to be stretched in order to meet the minimum size requirements for sharing on social media websites, and the logo will appear on the website at a smaller size than other Profile Logos:



How To Upload Profile Photos As A Member


When uploading the profile photo, they will follow the same process as uploading a Profile Logo.  However, the members will be required to use the built-in cropping tool which will ensure that the final image uses the 3:4 Aspect Ratio specified in the Profile Photo Settings:




The following warning message will show should they wish to force the crop regardless:



  

It is now possible to revert, rotate, and zoom in & out while cropping profile photo images using the tools below the image:




How To Upload Cover Images As A Member


When uploading the cover photo, they will follow the same process as uploading a Profile Picture/Logo.  

However, the members will be required to use the built-in cropping tool which will ensure that the final image uses the dimensions specified in the Profile Cover Settings:



Additional Information 


The image module is made up of text labels that can be edited:




» How to locate Text Labels on the Front end of a Website

» Settings » Text Labels