Display both logo and title in header 17


Here’s a quick snippet to display both your logo and your site title in the header.

 

 

Where to copy/paste this code? => in your functions.php file. I strongly recommend to create a child theme. Download a start-up child theme here.

Everything you need to know about child theme with Customizr here.

Hope this will help!


About Nicolas

My name is Nicolas Guillaume (nikeo). I am the developer of the WordPress Customizr Theme. This website is a discussion platform, your comments are welcome!


17 thoughts on “Display both logo and title in header

  • Reply
    Andrew

    Hi Nicolas, first of all, thank you for the great theme! I have been playing with Customizr for some time, but have got confronted with the following problem: The items on the webpage (DIVs) are moving whenever I resize the browser window. I went through a lot of forums and tried many things, but nothing works. Please help! It might be very helpful to have a kind of a snippet or simple solution that is put out on this website for everybody since this problem arises for every newbie.

    I am sorry if this is not the right place for posting it.
    Thanks!

    • Reply
      Nicolas Post author

      Hi Andrew, the smooth moves that you see on resize are caused by a CSS3 property : transition: width, …, -moz-transition: width ….
      Easy to disable with the value none.
      Hope this helps,

      • Reply
        Andrew

        Nicolas, I tried to put ” -moz-transition:none;” into #wrapper { } in the beginning, also into the #customizr-slider.carousel .item {}, and so on. The only part of the website that does not move on resizing the window (and everything else does move) is the manu bar, but it eventually disappears when the window size becomes too small.. I am confused — if I want the property “-moz-transition:none;” to be attributed to every item on the website, how can I do so? (I thought the #wrapper in the very benning would help) Thank you a lot!

  • Reply
    q bone

    Hi, great theme use!

    is it also possible to display logo left and blogname to the right beside? instead of logo above blogname.

    thanks

  • Reply
    David

    I tried to place this code into the child theme’s functions.php file, but all this does is make the code show up at the top of my page.

    Any advice? (i am new to web design/development)

  • Reply
    Marianne Munro

    Is it possible to put a logo (or small picture) in the upper right corner of the front page and leave the Site Title where it is on the left? If so, what code would I use in the custom css to do this?
    Thanks

  • Reply
    Tobias

    Thank you for this wonderful theme.
    I would like to make the logo in the rectangle with description, social feed… Is it possible ?

  • Reply
    Adam Peter

    Hi Nicholas, I have installed child theme, but do not have fuctions.php, only style.css. Where should I copy-paste the code? Thanks.

  • Reply
    Shawn Rundblade

    I am curious the the suggested/best way to replace the text in my logo, with just the graphic and make the text separate text so Google can see it. Suggestions?

  • Reply
    William

    I would like to use this custom code to display both a logo and a title in the header of my blog. I am using the Karma theme on my web site. These are the steps I have taken:

    1) Installed a child theme (www.themesandco.com/extension/customizr-child-theme/)
    2) Installed wp-FileManager (http://wordpress.org/plugins/wp-filemanager/)
    3) Configured wp-FileManager to allow all options (Create file, Create folder, etc)

    At this point I do not know where to create the functions.php file with your custom code. I am new at WordPress so any help that you can give me would be appreciated!

    • Reply
      Nicolas Post author

      Hi William, this code snippet is specific to the Customizr theme and won’t work in another theme.
      You might want to ask the developer of the Karma theme if he can provide the appropriate code.
      Cheers

Leave a Comment

Your email address will not be published. Required fields are marked *

Do you need to share some code? To display it in a nice looking syntax highlighter, wrap your code between the following tags (css code in this example) : <pre class="lang:css">YOUR CODE</pre> ( possible code language acronyms : css, php, xhtml, javascript, sql)

You may also use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">