WordPress.org

Ready to get started?Download WordPress

Forums

[closed] [Theme: Twenty Twelve] Replace site title with image? (20 posts)

  1. lak3000
    Member
    Posted 1 year ago #

    Hi,

    I'm using the Twenty Twelve theme and I'd like to know how to replace the site title and tagline with an image.

    Thank you!

  2. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    you know, you can use a header image in Twenty Twelve and hide the title and tagline (dashboard - appearance - header)- do you want to have another image instead of title and tagline?

    before you start any customisations, create a child theme to work with; http://codex.wordpress.org/Child_Themes

  3. lak3000
    Member
    Posted 1 year ago #

    hi, alchymyth,

    thanks for your response!

    i have already created a child theme.

    i would like to put a logo where the site title and tagline are now, then put a header image below that. the logo would be the name of a person and her occupation, and the header image below would be a photo of a forest.

    i could incorporate the logo into the header image, but the header image changes page-by-page, and i don't want to have to load in the logo every time the user changes pages. (does that make sense?)

    thanks!

  4. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    for instance, edit header.php;

    insert this before <hgroup>:

    <img class="site-logo" src="<?php echo get_stylesheet_directory_uri(); ?>/images/site-logo.png" alt="site logo" />

    this assumes that the site-logo.png is saved in an /images folder of the child theme.

    add this to style.css to hide the site title and tag line and restrict the size of the logo for small screens:

    .site-header hgroup { display: none; }
    .site-logo { max-width: 100%; height:auto; }
  5. lak3000
    Member
    Posted 1 year ago #

    thank you, alchymyth.

    i'm having problems specifying the file path for my site logo (i don't know PHP). the absolute file path is

    http://www.mysite.com/wp-content/uploads/2012/12/site-logo.jpg

    how do i specify this in your code?

  6. lak3000
    Member
    Posted 1 year ago #

    never mind -- i figured it out. thank you!

  7. damse
    Member
    Posted 1 year ago #

    is it possible to put in a logo instead of the tagline without child theme? And with a url to the pic and not a path lige you mention?

  8. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    is it possible to put in a logo instead of the tagline without child theme?

    yes - but not recommended.

    And with a url to the pic and not a path like you mention?

    also possible - you can use a full absolute url to the image

  9. damse
    Member
    Posted 1 year ago #

    But how ? I have absoulutely no ide. I just want a logo above my menu :b

  10. pilotindia.arnab
    Member
    Posted 1 year ago #

    Hello Alchymyth!!

    When I put the code u provided the logo appears above the site title. I want the site title to appear to the right side of the logo. Any way to do it?? My doimain - http://www.wingsofindia.com

    Thanks

  11. pilotindia.arnab
    Member
    Posted 1 year ago #

    Please ignore the post above. I found the magazine theme would be better coz my site is a news portal.

  12. dgissen
    Member
    Posted 1 year ago #

    The above code works great and thanks, but what url do i put in so that when you click on the site logo you return to the site's homepage?

  13. Andrew
    Forum Moderator
    Posted 1 year ago #

    Dgissen, if you require support for your own issue, create your own thread.

  14. dgissen
    Member
    Posted 1 year ago #

    It's actually related; there is code that you put in that very line. But thanks. I may do both.

  15. gbicket
    Member
    Posted 1 year ago #

    alchymyth, I was able to use your technique to replace the site title with my logo, and it worked fine, thanks for that advice. I used the specific company name in the image name and alt tag (instead of just the generic "site-title.png"); Do you know if my SEO will be affected adversely by hiding the actual site-title, or will it still be read by search engines? Thanks

  16. newsgrip
    Member
    Posted 1 year ago #

    Hello Alchymyth. Your solution is working fine except my logo does not link to home page, what code should I add, to you code?

  17. Andrew
    Forum Moderator
    Posted 1 year ago #

    @newsgrip, what page does it link to?

  18. Mark Shirley
    Member
    Posted 1 year ago #

    Hi - Thanks to alchymyth his instruction worked fine. Question is it possible to have the image click back to the home page.

  19. Amitabha Roy
    Member
    Posted 1 year ago #

    Go to Dashboard > Appearance > Editor
    Edit header.php
    Find the following line:
    <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>

    Make the change:
    <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><img src="http://javaadmin.com/wp-content/uploads/2013/05/logo-1.png" style="float: right;" alt="Logo" /></a></h1>

    Note: Don't forget to put the right URL for the logo.

  20. Mark Shirley
    Member
    Posted 1 year ago #

    Im using the code below and it works fine. I have tried Amitabha Roy's code but I cant get it to center accurately on the phone.

    <img class="site-logo" src="<?php echo get_stylesheet_directory_uri(); ?>/images/new-vanit-hair-logo.png" alt="site logo" />
    
    .site-header hgroup {
    display: none;
    } 
    
    .site-logo {
    	max-width: 100%; height:auto;
    	margin-left: auto;
    	margin-right: auto;
    	display:block;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic