Zoom & crop of header

Hi there,

The first step here is for you to copy the theme’s header.php file to your child theme (I can see you’ve already completed this step via your other thread here).

The following uses a conditional tag to check whether a page is set as Pique’s front page before displaying a header image:

if ( ! pique_is_frontpage() AND get_header_image() ) : ?>

Remove the conditional tag in order to display the header image on your front page:

if ( get_header_image() ) : ?>

Next, you’ll need to add some custom CSS to make sure the menu is styled the same way as it is on other pages on your front page:

@media (min-width: 768px) {
    .pique-frontpage #site-navigation:not(.sticky) {
        background: #2d2a26;
        border-top: 1px solid #49443d;
        border-bottom: 1px solid #49443d;
    }
}

Hope that’s helpful! Let us know how you get on or if questions come up.

Unfortunately that doesn’t work either. I feel like my setup isn’t recognizing the fact that I have a child theme at all. Does the fact that I’m setup in a multi-site network make any difference?

I think you’re right that your child theme isn’t being detected. Having a multi-site network shouldn’t be the cause of this, though.

Can you navigate to Appearance > Themes and confirm that your child theme (and not Pique itself) is active there? Please also copy/paste the top section of your child theme’s style.css file in your next reply. I’ll take a look to see if anything is wrong.

Thanks for your patience Siobhan ??

No the child theme isn’t showing at all under Appearance > Themes

Here’s a screen shot of everything that’s on my Theme page:
https://panopticnews.com/foundations/wp-content/uploads/sites/20/2016/11/Screen-Shot-2016-11-25-at-9.50.49-AM.png

This is the top part of the style.css in my child theme:
/*
Theme Name: Pique Child
Description: Pique Child Theme
Template: pique
*/
/*
Theme Name: Pique
Theme URI: https://wordpress.com/themes/pique/
Description: A one-page scrolling theme for small businesses.
Version: 1.2.9
Author: Automattic
Author URI: https://wordpress.com/themes/
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pique
Tags: custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, left-sidebar, one-column, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, two-columns
*/

/*————————————————————–
>>> TABLE OF CONTENTS:
—————————————————————-

Hi @gazette-gal,

It looks you’ve copied/pasted the contents of the parent theme’s style.css file beneath the first part of your child theme’s style.css file. That’s not necessary as the parent theme’s CSS will automatically be loaded with the child theme.

Only the following is needed at the very top of your child theme’s style.css file:

/*
 Theme Name:   Pique Child
 Description:  Pique Child Theme
 Template:     pique
 Text Domain:  pique-child
*/

Any custom CSS that you wish to add would then be added beneath that top section.

In addition to the style.css file, your child theme should have a functions.php file with the following code:

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'parent-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

After you’ve updated both the child theme’s style.css and functions.php files, you should be able to activate it via Appearance > Themes.

Can you take a look through the above and let me know when you’ve updated your files?