• I’m using the Pharmacy Child-theme and would like to style my logo area to house a background image.

    The image is an svg graphic logo which needs to sit to the left of the site name.

    You see, having the site name rendered by WP and the graphic logo to the left of it is preferable.

    Any best practices or suggestions would be much appreciated.

Viewing 1 replies (of 1 total)
  • Hi Sri Shunyata,

    This is the code I use in my Storefront-child theme.
    https://www.micronator.org/affaires

    /* ******************************************************************* */
    /* ***** style.css ***** */

    /* Hide Site Title and Tagline */
    .site-header .site-branding { display: none;}

    /* To insert 10px above picture of header and (0px under main menu) */
    .site-header {
    padding-top: 10px;
    padding-bottom: 0;
    }

    /* To get rid of the space above and below Cart */
    a.cart-contents, .site-header-cart .widget_shopping_cart a {
    padding: 0.0em 0 !important;
    }

    /* To get rid of the space above and below Main Menu */
    @media screen and (min-width: 767px) {
    .main-navigation ul.menu > li > a, .main-navigation ul.nav-menu > li > a {
    padding-top: 0px;
    padding-bottom: 0px;
    }
    }

    /* ******************************************************************* */

    /* ***** functions.php ***** */

    /* Do not display Search in header */
    add_action( ‘wp_enqueue_scripts’, ‘theme_name_parent_styles’ );
    add_action( ‘init’, ‘jk_remove_storefront_header_search’ );
    function jk_remove_storefront_header_search() {
    remove_action( ‘storefront_header’, ‘storefront_product_search’, 40 );
    }

    /* APPEARENCE | CUSTOMIZE | HEADER */
    /* No background image */
    /* Background color: #fcf3de (SAME AS BOTH td in table below) */
    /* Text color: #9aa0a7 */
    /* Link colors: #96588a / Violet */
    /* IMAGE FOR THE HEADER */
    /* Site Title: /PDF/Images/EN-TETE/logo_Micronator_250x65_res_1200x1200_TB.png */
    /* LINK: / */
    /* IMAGE: /PDF/Images/EN-TETE/Reseau_complet_avec_clone_TB-OK_800.png */
    /* LINK: aucun */
    /* ALL OF THE BELOW, INSERTED BEFORE THE LAST ?> OF THE FILE */

    add_action( ‘storefront_header’, ‘jk_storefront_header_content’, 40 );
    function jk_storefront_header_content() { ?>
    <div>
    <table style=”text-align: center; width: 100%; “>
    <tbody>
    <tr>
    <td style=”width: 22%; text-align: left; vertical-align: top; padding: 0px; background-color: #fcf3de;”>Page principale</td>
    <td style=”text-align: right; vertical-align: top; width: 68%; padding: 0px; background-color: #fcf3de;”>Réseau Micronator</td>
    </tr>
    </tbody>
    </table>
    </div>
    <?php
    }

    ?>

Viewing 1 replies (of 1 total)
  • The topic ‘Add a Background Graphic to the Logo Area’ is closed to new replies.