How to hide the Site Logo in other pages?

Hi,

I want the site logo to be displayed only in the homepage (Front Page) and I dont want it to be displayed in the other pages … How do I do that ???

Thanks in advance …

Also, Can I have a different site logo for an another page apart from the homepage ?

Hello there,

To hide the logo on inner pages, add this CSS code to Appearance > Customize > Additional CSS from dashboard.

    body:not(.home) .site-header .col-md-4 a {
      display: none;
    } 

To set custom logo on specific page, try doing these steps:

  1. Install and activate the TC Custom JavaScript plugin
  2. Go To Appearance > Custom JavaScript
  3. Paste the following code into the provided box
    (function($){

      $.fn.setLogo = function(image) {
        if( this.length ) {
          this.find('.col-md-4 a').css('display', 'block');
          this.find('.site-logo').attr('src', image);
        }
      }

      // Set custom logo for specific page
      $('.page-id-2').setLogo('http://yoursite.com/wp-content/upload/path/to/your-logo.jpg');

    })(jQuery);

Supply the link to your logo image in this line:

$('.page-id-2').setLogo('http://yoursite.com/wp-content/upload/path/to/your-logo.jpg');

and adjust the page ID number to match the respective page. You can get the page’s ID number when editing it – in the web browser’s address bar you’ll see a URL that reads something like: yoursite.com/wp-admin/post.php?post=2&action=edit

4 . Update

Regards,
Kharis

Thanks Kharis,

In continuation to the above - This time, for one of the page , I want only the Site Logo to be displayed without any Menu or Site title etc…

Request your help on this…

Also, In the Video Header when I right click there are options (to download the video, Copy video location, e-mail video etc…) How do I disable these ??

You’re welcome!

You can hide the main menu on specific page with this simple CSS code:

    .page-id-2 .site-header .col-md-8 {
      display: none;
    }

To disable right click options on the video header, add this jQuery code to Appearance > Custom JavaScript.

    (function($){

      $('.wp-custom-header').mousedown(function(event) {
         if(event.which === 3) {
            $('.wp-custom-header').bind('contextmenu',function () { return false; });
          }
          else {
            $('.wp-custom-header').unbind('contextmenu');
          }
      });

    })(jQuery);

Regards,
Kharis

Thanks Kharis !!! It worked…

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis