WP Residence Help WP Residence Help

  • WpEstate
  • How to Build Your Website
  • Video Tutorials
  • Client Support
  • API
Home / Technical how to | Custom Code Required, WpResidence 5.0 / WPResidence Header Media Functionality Detailed Guide

WPResidence Header Media Functionality Detailed Guide

150 views 0

The header_media.php file in the WPResidence theme is a crucial component that manages the display of various header types on different pages of your real estate website. This guide will provide a detailed, step-by-step explanation of its key functions.

1. header_media.php Overview

The header_media.php file is responsible for determining and rendering the appropriate header media for different page types in the WPResidence theme. It contains several key functions that work together to achieve this:

  • wpestate_header_media_type_for_singular(): Handles header media for singular pages.
  • wpestate_header_media_global_header(): Manages global header settings.
  • wpestate_header_image(): Generates and displays header images.

2. wpestate_header_media_type_for_singular() Function

This function determines and displays the appropriate header media type for singular pages (like single property pages or regular WordPress pages).

Step-by-step breakdown:


function wpresidence_header_media_type_for_singular($header_type, $postID) {
switch ($header_type) {
case 1: // none
// No header media is displayed
break;
case 2: // image
$custom_image = esc_html(get_post_meta($postID, 'page_custom_image', true));
wpestate_header_image($custom_image);
break;
case 3: // theme slider
wpestate_present_theme_slider();
break;
case 4: // revolution slider
if(function_exists('putRevSlider')) {
$rev_slider = esc_html(get_post_meta($postID, 'rev_slider', true));
putRevSlider($rev_slider);
}
break;
case 5: // google maps
if(!wpestate_half_map_conditions($postID)) {
include(locate_template('templates/google_maps_base.php'));
}
break;
// ... other cases
}
}

  1. The function takes two parameters: $header_type and $postID.
  2. It uses a switch statement to handle different header types.
  3. For each case:
    • Case 1: No header is displayed.
    • Case 2: A custom image is retrieved and displayed using wpestate_header_image().
    • Case 3: The theme’s built-in slider is displayed.
    • Case 4: If available, a Revolution Slider is displayed.
    • Case 5: Google Maps is displayed, but only if not on a half map page.
  4. Additional cases handle video headers, taxonomy headers, and special page types like splash pages or agency pages.

3. wpestate_header_media_global_header() Function

This function renders the global header media based on the specified header type and context. It’s used when a global header setting is applied across multiple pages.

Step-by-step breakdown:


function wpresidence_header_media_global_header($is_archive, $is_singular_post, $is_singular_property, $global_header_type) {
switch ($global_header_type) {
case 0: // No header
break;
case 1: // Image header
$global_header_image = wpresidence_get_option('wp_estate_global_header', 'url');
if ($is_archive) {
$global_header_image = wpresidence_get_option('wp_estate_header_taxonomy_image', 'url');
} else {
if($is_singular_post) {
$global_header_image = wpresidence_get_option('wp_estate_header_blog_post_image', 'url');
} else if($is_singular_property) {
$global_header_image = wpresidence_get_option('wp_estate_header_property_page_image', 'url');
}
}
wpestate_header_image($global_header_image);
break;
case 2: // Theme slider
wpestate_present_theme_slider();
break;
case 3: // Revolution slider
if (function_exists('putRevSlider')) {
$global_revolution_slider = $is_archive
? wpresidence_get_option('wp_estate_header_taxonomy_revolution_slider', '')
: wpresidence_get_option('wp_estate_global_revolution_slider', '');
if($is_singular_post) {
$global_revolution_slider = wpresidence_get_option('wp_estate_header_blog_post_revolution_slider', '');
} else if($is_singular_property) {
$global_revolution_slider = wpresidence_get_option('wp_estate_header_property_page_revolution_slider', '');
}
putRevSlider($global_revolution_slider);
}
break;
case 4: // Google Maps
include(locate_template('templates/google_maps_base.php'));
break;
}
}

  1. The function takes four parameters: $is_archive, $is_singular_post, $is_singular_property, and $global_header_type.
  2. It uses a switch statement to handle different global header types.
  3. For each case:
    • Case 0: No header is displayed.
    • Case 1: An image header is displayed. The image source varies based on the page type (archive, singular post, singular property).
    • Case 2: The theme’s built-in slider is displayed.
    • Case 3: If available, a Revolution Slider is displayed. The slider ID varies based on the page type.
    • Case 4: Google Maps is displayed using a template file.
  4. The function uses conditional logic to determine which specific header image or slider to use based on the page context.

4. Interaction Between Functions

These functions work together to provide a flexible header media system:

  1. The main WordPress template (like header.php) typically calls a function that determines whether to use a singular or global header.
  2. If it’s a singular page, wpestate_header_media_type_for_singular() is called with the appropriate header type and post ID.
  3. If it’s using global settings, wpestate_header_media_global_header() is called with the current page context and global header type.
  4. Both of these functions may then call other helper functions like wpestate_header_image() or wpestate_present_theme_slider() to actually render the header content.

5. Extending the Functionality

To extend these functions, you can:

  1. Add new cases to the switch statements to support new header types.
  2. Create new helper functions for rendering custom header types.
  3. Modify existing cases to change how certain header types are displayed.

Example of adding a new header type:


// In wpestate_header_media_type_for_singular()
case 25: // custom parallax header
wpestate_custom_parallax_header($postID);
break;

// New function to handle the custom header type
function wpestate_custom_parallax_header($postID) {
$parallax_image = get_post_meta($postID, ‘custom_parallax_image’, true);
echo ‘<div class=”custom-parallax-header” style=”background-image: url(‘ . esc_url($parallax_image) . ‘);”></div>’;
}

This detailed breakdown of the header_media.php file and its key functions should provide a clear understanding of how WPResidence manages its header media system, allowing for easier customization and extension of the theme’s capabilities.

Technical how to | Custom Code RequiredWpResidence 5.0

Related Articles

  • Introduction to WPResidence Header Customization
  • Understanding WPResidence Header Types: An Overview
  • Customizing the WPResidence Logo Display
  • Configuring the Primary Navigation Menu in WPResidence

WP Residence Documentation

  • 1. General
    • How to Get Support
    • Get your buyer license code.
    • Use SSL / https
    • Server / Theme Requirements
  • 2. Installation
  • 3. Installation FAQ
  • 4. Advanced Search
    • Advanced Search Display Settings
    • Advanced Search Form
    • Geolocation Search for Half Map
    • Save Search Theme Options
    • Advanced Search Colors
  • 5. Agent, Agency & Developers
  • 6. Property Page
  • 7. Properties List
  • 8. Property Taxonomies
  • 9. Property Custom Template
  • 10. Blog Posts & Blog List
  • 11. Shortcodes
    • Contact Form
    • Featured Agency/Developer
    • Membership Packages
    • Testimonials
    • Google Map with Property Marker
    • Listings per Agent, Agency or Developer
    • Display Categories
    • Agent List
    • Recent Items Slider
    • Recent items
    • List Properties or Articles by ID
    • Featured Agent
    • Featured Article
    • Featured Property
    • Login & Register Form
    • Icon Content Box Shortcode
  • 12. Widgets
  • Theme Options
    • General Settings
    • User Types Settings
    • Appearance
    • Logos & Favicon
    • Header
    • Footer Style and Colors
    • Price & Currency
    • Property Custom Fields
    • Features & Amenities
    • Listing Labels
    • Theme Slider
    • Permalinks
    • Splash Page
    • Social & Contact
    • Map Settings
    • Pin Management
    • How read from file works
    • General Design Settings
    • Custom Colors Settings
    • Header Design & Colors
    • Mobile Menu Colors
    • User Dashboard Colors
    • Print PDF Design
    • Property, Agent, Blog Lists Design Settings
    • Sidebar Widget Design
    • Font management
    • How to add custom CSS
    • Custom Property Card Unit – Beta version
    • Email Management
    • Import & Export theme options
    • reCaptcha settings
    • YELP API Integration
    • iHomefinder Optima Express IDX
    • MEMBERSHIP & PAYMENT Settings
    • Property Submission Page
    • PayPal Setup
    • Stripe Setup
    • Wire Transfer Payment Method
  • Translation
  • FAQ
  • Pages
  • Header
  • Footer
  • Google or Open Street Maps
  • Payment Options
  • Plugins
    • Included Plugins
    • Third Party Plugins – IDX Compatibility
    • Third Party Plugins – Multi Languages
    • Third party Plugins – Other
  • Technical
    • Technical how to | Custom Code Required
    • Technical: Child Theme
  • Theme Updates

Join Us On

Powered by WP Estate - All Rights Reserved
  • WpEstate
  • How to Build Your Website
  • Video Tutorials
  • Client Support
  • API