• Hey there,

    as the title suggest,
    I have tried replacing a smaller logo only when the sticky function activates. However am unsuccessful in making it work.

    I do note that there are many explanations provided over the website as well. Have tried but failed as such. Do please guide me through this as it is an extremely urgent adjustment for the website.

    Have tried many methods (1 method for example):
    .myfixed img.nd_options_position_absolute.nd_options_left_15 { visibility:hidden; }
    .myfixed .nd_options_position_absolute.nd_options_left_15 { width:200px; height:200px; box-sizing:border-box; padding-left: 200px; background: url(‘imageurl’) left top no-repeat; }

    Hope to hear from you soon!

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter shaneleapdsc

    (@shaneleapdsc)

    Hey there,

    Noticed that there seems to be no response yet.
    It would be best to give at least an estimated time for the response. As this is a crucial factor for the website.

    My main objective is to REPLACE the logo with another image once the menu goes sticky. However, based on the code attempted given above, seems to be unsuccessful regardless.

    Please advice on this. Would really gladly appreciate your assistance.
    Hope to hear from you soon!

    Inside header.php find this part for displaying logo (search for comment LOGO because image will be showed using php):

    <!--LOGO-->
    <a href="https://leapdsc.com/client/samhealth">
      <img style="top:11px;" alt="" class="nd_options_position_absolute nd_options_left_15" src="https://leapdsc.com/client/samhealth/wp-content/uploads/2018/02/SAMH-logo-web.png" width="151">
    </a>

    so, leave code for first image as it is and after it add second logo image, it’s our initially hidden image:

    <!--LOGO-->
    <a href="https://leapdsc.com/client/samhealth">
    
      <img style="top:11px;" alt="" class="nd_options_position_absolute nd_options_left_15" src="https://leapdsc.com/client/samhealth/wp-content/uploads/2018/02/SAMH-logo-web.png" width="151">
    
      <img style="top:11px;" alt="" class="nd_options_position_absolute nd_options_left_15 initial_hidden" src="https://leapdsc.com/client/samhealth/wp-content/uploads/2018/02/SAMH-logo-web.png" width="151">
    
    </a>

    Dont forget to change url for second image…
    In mysticky options / style section add this to Style CSS field, at the end:

    /* hide first logo when fixed */
    #mysticky-nav .myfixed a img.nd_options_position_absolute {
    display:none;
    }
    
    /* hide second logo when not fixed */
    
    #mysticky-nav a img.nd_options_position_absolute.initial_hidden {
    display:none;
    }
    
    /* display second logo when fixed */
    #mysticky-nav .myfixed a img.nd_options_position_absolute.initial_hidden {
    display:block;
    }

    Hope this helps, let me know…

    • This reply was modified 6 years, 8 months ago by damiroquai.
    • This reply was modified 6 years, 8 months ago by damiroquai.
    • This reply was modified 6 years, 8 months ago by damiroquai.
    Thread Starter shaneleapdsc

    (@shaneleapdsc)

    hey there,

    Thank you for the quick reply,

    However I do not seem to be able to locate the actual folder.
    As I have looked under Appearance > Editor > header.php. Am I looking in the right folder / the correct header.php as there seems to be afew?

    What was generated are all PHP codings instead of HTML coding as shown earlier by you. (see below for ORIGINAL CODE). Please guide me as such.

    <!–START LOGO OR TAGLINE–>
    <?php

    $nicdark_customizer_logo_img = get_option( ‘nicdark_customizer_logo_img’ );
    if ( $nicdark_customizer_logo_img == ” or $nicdark_customizer_logo_img == 0 ) { ?>

    <div class=”nicdark_grid_3 nicdark_text_align_center_responsive”>
    <div class=”nicdark_section nicdark_height_10″></div>
    “><h3 class=”nicdark_color_white”><?php echo esc_html(get_bloginfo( ‘name’ )); ?></h3>
    <div class=”nicdark_section nicdark_height_10″></div>
    “>
    <p class=”nicdark_font_size_13”><?php echo esc_html(get_bloginfo( ‘description’ )); ?></p>

    <div class=”nicdark_section nicdark_height_10″></div>
    </div>

    <?php

    }else{

    $nicdark_customizer_logo_img = wp_get_attachment_url($nicdark_customizer_logo_img);

    ?>

    <div class=”nicdark_grid_3 nicdark_text_align_center_responsive”>
    “>
    “>

    </div>

    <?php } ?>
    <!–END LOGO OR TAGLINE–>

    Have tried inserting both PHP and CSS within their respective areas but doesn’t seem successful. Logo seems to be blank instead after sticky.
    Please advice on this, as Im not proficient in areas of PHP.

    Gladly appreciate the help. Hope to hear from you soon!

    You should contact your theme support and ask them in which file is your logo generated . Since it’s a paid theme I’, not able to help…

    try to search for <!–LOGO–> comment…

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Replacing logo with a small logo’ is closed to new replies.