# Website Media
Welcome to the comprehensive guide on utilizing the Media Manager feature in Lagom WHMCS Website Builder (opens new window). This article takes you through the seamless process of managing and optimizing media assets for your website. Learn how to effortlessly enhance the visual appeal and engagement of your web pages by efficiently handling images through CMS pages.
# Media Manager
Assets which are shown "Media Manager" are stored in /templates/lagom2/assets/img/page-manager/ directory. Which means that these files can be also managed via "File Manager", directly on your server.
following actions are available on this page:
- Upload - Allows to upload new graphics.
- Search - Search for specific graphic name.
- Remove - Click on "Trash" icon to remove specific graphic.
- Preview - Hover over specific graphic and click on the "Zoom" icon, to display bigger preview.
# Media Modal
Lagom WHMCS Website Builder lets you choose different graphic types, which can be selected via modals in management of CMS pages, as shown in below examples.
# Small Icons
Display predefined icons in 12px size, which are available by default in Lagom WHMCS Client Theme.
# Medium Icons
Display predefined icons in 18px size, which are available by default in Lagom WHMCS Client Theme.
# FontAwesome
Display FontAwesome icon set, which is available by default in WHMCS.
# SVG Icons
Display predefined icons in 64px and 156px size, which are available by default in Lagom WHMCS Client Theme. List of available SVG icons is available on our demo page (opens new window).
# SVG Illustrations
Display predefined illustrations, which are available by default in Lagom WHMCS Client Theme and Lagom WHMCS Website Builder. List of available SVG illustrations is available on our demo page (opens new window).
# Library
Library tab display all graphics loaded from /templates/lagom2/assets/img/page-manager/ directory.
# Upload
If you decide to use your own graphics, in specific website element, you can use the "Upload" tab. Uploaded files will be then available in "Library" tab, and in "Media Manager" page.
# Alternate Text
Custom graphics assigned to the website sections, will have automatically generated alt attribute in following format [Page Title] - [Section Title]
- Page Title - Text assigned to the "SEO Title" field for specific CMS page.
- Section Title - Text generated from ["Section Title"] field, if this field will be empty, we will use ["Caption"] field. If both fields will be empty, then alternate text will not be assigned to the.
# Graphics Color Scheme
The graphics in our Media Manager are static PNG files that cannot be edited using CSS code. Previously, these were only available in blue. To provide greater flexibility with visual customization, we have created multiple color versions of these graphics. Now, when you select a different Color Scheme (opens new window) in our addon, the corresponding colored PNG will automatically load to match the selected scheme.
For example, if you wish to have the graphics in green color, you have to activate this color scheme in our Style Manager (opens new window) by following these steps:
- Open our "RS Themes" addon.
- Select "Styles" tab.
- Choose your currently active theme, for example, "Modern" and click on the "Manage" button under the "Actions" dropdown menu.
- Select your desired color and click on "Save Changes".
- Important: If you have Section Cache (opens new window) enabled, you need to clear it by following the steps below:
- Navigate to "RS Themes" → "Tools" tab.
- Click on the "Refresh" button next to the "Section Cache"
After changing the color scheme to “Green”, the PNG graphic with green accents will be automatically loaded as you can see on the example below.
Here are more examples of colors used in our PNG graphics.