Docs

[Eric M]

We have a client with 4 subbrands that will all be enclosed with in one site. On the pages for sub brand #1, we would like to use the logo for that brand and then the same for each other subbrand. What is needed, css and php wise to make that happen.

Also, they all have different color schemes and we are using breadcrumbs. what is the css form to change the colors in nav and page title areas.

[Lely]

Hello Eric,

Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Then copy _brand.php file from wp-content\themes\x\framework\views\global to wp-content\themes\x-child\framework\views\global. Then change the entire code to this:

<?php

// =============================================================================
// VIEWS/GLOBAL/_BRAND.PHP
// -----------------------------------------------------------------------------
// Outputs the brand.
// =============================================================================

$site_name        = get_bloginfo( 'name' );
$site_description = get_bloginfo( 'description' );
$logo             = x_make_protocol_relative( x_get_option( 'x_logo' ) );
$site_logo        = '<img src="' . $logo . '" alt="' . $site_description . '">';

?>

<?php echo ( is_front_page() ) ? '<h1 class="visually-hidden">' . $site_name . '</h1>' : ''; ?>

<a href="<?php echo home_url( '/' ); ?>" class="<?php x_brand_class(); ?>" title="<?php echo $site_description; ?>">
  <?php if(is_page(4)){ // Change 4 to your subpage page ID and also the source of the below ?> 
  <?php echo '<img src="http://virtualhost.dev/latestwp/wp-content/uploads/2016/04/WIN_20160105_17_17_34_Pro.jpg" alt="' . $site_description . '">'; ?>
  <?php }else if(is_page(3)){ // Change 3 to your subpage page ID and also the source of the below ?> 
  <?php echo '<img src="http://logo-url-of-specific-page.png"" alt="' . $site_description . '">'; ?>
  <?php }else{ ?>
  <?php echo ( $logo == '' ) ? $site_name : '<img src="' . $logo . '" alt="' . $site_description . '">'; ?>
  <?php }?>
</a>

The CSS code will depend per page. Please share the site URL and give us a detailed description of the changes so we can check.

Always,
X

[Eric M]

if the same logo is on multiple pages, would they be separated by a comma?

[Eric M]

Can we set it up to have the logo also take to you different pages?

[Paul R]

Hi Eric,

1. If you would like the same logo for multiple pages, you can add a ||

eg.

if(is_page(3) || is_page(4) || is_page(5))

2. To set each logo a different link, you can try this code instead.

<?php

// =============================================================================
// VIEWS/GLOBAL/_BRAND.PHP
// -----------------------------------------------------------------------------
// Outputs the brand.
// =============================================================================

$site_name        = get_bloginfo( 'name' );
$site_description = get_bloginfo( 'description' );
$logo             = x_make_protocol_relative( x_get_option( 'x_logo' ) );
$site_logo        = '<img src="' . $logo . '" alt="' . $site_description . '">';

?>

<?php echo ( is_front_page() ) ? '<h1 class="visually-hidden">' . $site_name . '</h1>' : ''; ?>

  <?php if(is_page(4)){ // Change 4 to your subpage page ID and also the source of the below ?> 
  <?php echo '<a href="'.home_url( '/' ).'" class="'.x_brand_class().'" title="'.$site_description.'"><img src="http://virtualhost.dev/latestwp/wp-content/uploads/2016/04/WIN_20160105_17_17_34_Pro.jpg" alt="' . $site_description . '"></a>'; ?>
  <?php }else if(is_page(3)){ // Change 3 to your subpage page ID and also the source of the below ?> 
  <?php echo '<a href="'.home_url( '/' ).'" class="'.x_brand_class().'" title="'.$site_description.'"><img src="http://logo-url-of-specific-page.png"" alt="' . $site_description . '"></a>'; ?>
  <?php }else{ ?>
  <?php echo ( $logo == '' ) ? $site_name : '<a href="'.home_url( '/' ).'" class="'.x_brand_class().'" title="'.$site_description.'"><img src="' . $logo . '" alt="' . $site_description . '"></a>'; ?>
  <?php }?>

You may change ‘.home_url( ‘/’ ).’ with the url of the page you want your logo to go into.

Hope that helps.

[Author]

Posts