By default, the theme hero media for pages and posts is set from Theme Options -> Header -> Hero Media Header.
Theme options Hero Media Header will apply for Hero Media header if you have “Global” set in Appearance Options.
Hero Media Header can be overwritten for specific pages from Edit Page → Header Options by switching the “global” option to one of the options from the dropdown
- Video
- Image
- Theme Slider
- No Header
- Google Maps
- Revolution Slider
Custom Hero Media Header Options Explained
Video as Hero Media Header
- Supports self-hosted video in MP4, WEBM, OGV formats.
- Includes an optional cover image for devices that do not support video.
- Design options:
- Fullscreen or fixed height.
- Overlay color with opacity control.
Header example with video header
Image as Hero Media Header
- Can be fullscreen or fixed height.
- Supports an overlay color with adjustable opacity.
- Background style options: Cover or Contain.
- Add Title over Image and SubTitle over Image
- There is an option to enable parallax effect from Header -> Hero Media Header -> Parallax effect for image/video header media? -> YES
Header example with image as header
Theme Properties Slider as Hero Media Header
You can show in a properties sliders as Hero Media for specific pages selecting “Theme Slider” from the dropdown
- You Configure from Theme Options → Header -> Hero Media – Theme Slider
- More details: Theme Slider Help
Header example with Theme Properties Slider as Hero Header
Maps as Hero Header
- Set custom latitude and longitude from Maps (Google Maps or Open Street Maps)
- Enable ByPass fit bounds to use custom coordinates and zoom settings.
- Configure height, zoom level, and other settings in Theme Options → Maps Configuration.
- More details: Maps Configuration
Example of a page that has Hero Media as Maps
Revolution Slider as Hero Media Header
- Create a slider in Revolution Slider Menu.
- Enter the Alias name in the custom header settings for each page.
- More details: Revolution Slider Guide
Then you must type the name of the slider in each page custom header settings – where Revolution Slider name is set to display.
Example of a page with Hero Media as Revolution Slider
Transparency Header Settings per page
The transparent header is a design feature where the background of the header (which typically contains elements like navigation, logo, and menu) becomes see-through. It can be used to create a more visually appealing design
Choose transparency option for each page from – Appearance Options -> Use transparent header – YES/NO
Example of Transparent Header enabled for a specific page