When you use an image as header logo(whichever size it is) in the bootstrap theme the img-responsive class will automatically resize the image. But in wordpress theme, if you use large image for logo, it will occupy too much space in the page( I used 1475x 500 and It's occupying all the space in the page). So how do I make the image to resize itself i.e., add class img-responsive to it (whichever styles logo takes using wordpress theme).


Better method is to add only css code:

.custom-logo-link img {
  max-width: 100%;
  height: auto;

But if you need to add a custom class to logo you can add a filter:

// Add custom class to logo.
add_filter( 'get_custom_logo', 'change_logo_class' );
function change_logo_class( $html ) {
    $html = str_replace( 'custom-logo-link', 'header-brand', $html );
    $html = str_replace( 'custom-logo', 'img-responsive', $html );

    return $html;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.