There are a few ways you can tweak your background look & feel within kvCORE.
Note: These options and layouts are specific to the "Hero" template. The "Foundation" template is an old version of the site which should not be used.
Part 1: Choosing from default images.
Begin by clicking on 'Web & IDX' in the left hand navigation.
Then, click 'EDIT SETTINGS' to edit your website settings.
The first section at the very top of this page allows you to select one or more background images.
It's very straightforward, simply select the images you want to use and click save.
When you choose more than one image at a time, they will be chosen randomly each time your homepage is loaded.
Part 2: Custom Background Images
A custom background image may be used on your kvCORE site, but there are a few tips that you can follow to make this process a little easier.
- Make sure your image is 1600px wide by 650px tall, at least.
- Try to make sure that your background image is as small as possible, in terms of the amount of space it takes up. In the image below, you can see that this image only takes up 765KB, which is much less than 1MB. 1MB = 1,024 KB. The reason this is important is because the larger the image size is, the longer it will take to upload, to edit, and for website visitors to see. It's possible to optimize the size of your professional images, just ask for versions of them in jpeg format with a website-appropriate image quality setting.
- Click on the grey area below the background image selector and choose your image.
2. Once added, you will see some controls. Click on the edit icon (#2 in the image below) to tweak your image.
3. In the edit interface, there are a few more controls that will allow you to tweak your image to your liking.
- Rotate the image
- Click and drag to move the cropped area
- Use the drag handles to re-size the cropped area.
- Click 'Confirm' when you are satisfied with your edits.
- Click 'Cancel' if you prefer to not make any edits.
4. After your modifications are complete, you'll see the edited image ready to upload. Click the upload icon to continue.
While your image is uploading, wait for the success messages that will show at the right hand side of the page.
5. Now your custom image is select-able from the background chooser at the top of the page. Select it and click 'Save!'
When you re-visit your home page, your custom image will be visible.
Part 3 : Background Image Enhancements.
On the Website settings page, click 'Template Settings' on the left.
Dark Background Image
Scroll down to 'Dark Background Image' and click 'Yes' to enable it.
This adds a dark overlay to your background image to help tone it down, which can be useful if you find that the text on your home page is getting washed out by a very bright or very noisy background.
Large Background Image
Also within Template Settings you may find the 'Large Background Image' setting and set it to 'yes' to increase the size of the background image area on your homepage.
This will increase the size of the area from 550px tall to 700px tall.
Videos do not play on mobile sites, to save bandwith.
On your website settings page, click 'Template' on the left.
Right away, the 'Background Video YouTube ID' field should be visible:
Here, you may specify a background YouTube video, that will play behind the header elements, graphics, and search bar on the home page. The YouTube ID comes after the "?v=" in the URL of youtube.com.
For example: https://www.youtube.com/watch?v=tLxeyLyvw-0
The ID needed is: tLxeyLyvw-0
Do not include anything before or after the alphanumeric characters. Many times when you are looking at YouTube links they can be quite messy. You only want the portion after v= and before any other characters such as & , #, etc.
For example: https://www.youtube.com/watch?v=tLxeyLyvw-0&t=1s
The ID here would be: tLxeyLyvw-0
This replaces the background images you have selected on all desktop versions of your website with the specified video. On mobile sites the background images are used instead to save your users bandwith and keep your mobile site moving quickly.