Using custom images in a platform
When you would like to include your own logo or background image in your custom CSS, you should first upload it to the platform. You can do this by following the steps below:
- Go to Design at the top menu of Admin.
- Choose Assets at the left menu.
- Press the Add button and select the file you would like to use in the platform. You should now see it appear as a thumbnail.
- Press the Save button.
- Go back to the All Browsers tab. Above the Custom Style field, you should see an icon to open your assets. Click on the one you wish to use and a link is automatically added to the CSS code.
Using custom images in CSS
Should you want to add a background image to the header, first look for the block of CSS that defines the header, also known as the selector:
#header_wrapper { }
A background image in CSS is called with the property “background”. Following the colon is the referral to the location of the image, also known as the “value”. Together the property and the value form a rule, also known as “declaration”. A declaration should always end with a semicolon.
The selector combined with its declarations form the rule set:
#header_wrapper {
background: url(“https://platformname.CMNTY.nl/uploads/ image.jpg“) no-repeat scroll left top transparent;
}
When you paste this rule set in your Custom CSS and replace the bold referral with a link to your own image, you should now see the platform loading your custom image into the header background.