insert image into wordpress header

Discussion in 'HTML & Website Design' started by itamarlevy, Jan 29, 2012.

  1. #1
    Hi all,

    I'm having some difficulties inserting an image into my wordpress theme header; I guess I can't find the right place to put my image tag in. can someone please help?
     
    itamarlevy, Jan 29, 2012 IP
  2. riteshsanap

    riteshsanap Well-Known Member

    Messages:
    217
    Likes Received:
    2
    Best Answers:
    3
    Trophy Points:
    168
    #2
    riteshsanap, Jan 30, 2012 IP
  3. JCOnline

    JCOnline Greenhorn

    Messages:
    24
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #3
    What is the theme?
     
    JCOnline, Jan 30, 2012 IP
  4. itamarlevy

    itamarlevy Peon

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    hi again,

    this is the theme im using: templatemonster demo 37481 (cant paste a link)

    i tried to use thesis (just by putting an image tag into thesis header) but with no luck
     
    itamarlevy, Jan 30, 2012 IP
  5. riteshsanap

    riteshsanap Well-Known Member

    Messages:
    217
    Likes Received:
    2
    Best Answers:
    3
    Trophy Points:
    168
    #5
    Well the tutorial i told you is based on Thesis Framework build for WordPress, but if you have custom theme, you can just show the code of header.php then i might be able to tell you how to add image
     
    riteshsanap, Jan 30, 2012 IP
  6. itamarlevy

    itamarlevy Peon

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    here it is...

    <!DOCTYPE html>
    <html <?php language_attributes(); ?>>
    <head>


    <title><?php if ( is_category() ) {
    echo 'Category Archive for &quot;'; single_cat_title(); echo '&quot; | '; bloginfo( 'name' );
    } elseif ( is_tag() ) {
    echo 'Tag Archive for &quot;'; single_tag_title(); echo '&quot; | '; bloginfo( 'name' );
    } elseif ( is_archive() ) {
    wp_title(''); echo ' Archive | '; bloginfo( 'name' );
    } elseif ( is_search() ) {
    echo 'Search for &quot;'.wp_specialchars($s).'&quot; | '; bloginfo( 'name' );
    } elseif ( is_home() || is_front_page() ) {
    bloginfo( 'name' ); echo ' | '; bloginfo( 'description' );
    } elseif ( is_404() ) {
    echo 'Error 404 Not Found | '; bloginfo( 'name' );
    } elseif ( is_single() ) {
    wp_title('');
    } else {
    echo wp_title( ' | ', false, right ); bloginfo( 'name' );
    } ?></title>
    <meta name="description" content="<?php wp_title(); echo ' | '; bloginfo( 'description' ); ?>" />
    <meta charset="<?php bloginfo( 'charset' ); ?>" />
    <link rel="profile" href="http://gmpg.org/xfn/11" />
    <link rel="icon" href="<?php bloginfo( 'template_url' ); ?>/favicon.ico" type="image/x-icon" />
    <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
    <link rel="alternate" type="application/rss+xml" title="<?php bloginfo( 'name' ); ?>" href="<?php bloginfo( 'rss2_url' ); ?>" />
    <link rel="alternate" type="application/atom+xml" title="<?php bloginfo( 'name' ); ?>" href="<?php bloginfo( 'atom_url' ); ?>" />
    <!-- The HTML5 Shim is required for older browsers, mainly older versions IE -->
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <!--[if lt IE 8]>
    <div style=' clear: both; text-align:center; position: relative;'>
    <a href="http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode"><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" alt="" /></a>
    </div>
    <![endif]-->
    <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'template_url' ); ?>/css/normalize.css" />
    <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
    <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'template_url' ); ?>/css/prettyPhoto.css" />
    <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'template_url' ); ?>/css/grid.css" />

    <?php
    /* We add some JavaScript to pages with the comment form
    * to support sites with threaded comments (when in use).
    */
    if ( is_singular() && get_option( 'thread_comments' ) )
    wp_enqueue_script( 'comment-reply' );

    /* Always have wp_head() just before the closing </head>
    * tag of your theme, or you will break many plugins, which
    * generally use this hook to add elements to <head> such
    * as styles, scripts, and meta tags.
    */
    wp_head();
    ?>

    <script type="text/javascript">
    // initialise plugins
    jQuery(function(){
    // main navigation init
    jQuery('ul.sf-menu').superfish({
    delay: <?php echo of_get_option('sf_delay'); ?>, // one second delay on mouseout
    animation: {opacity:'<?php echo of_get_option('sf_f_animation'); ?>',height:'<?php echo of_get_option('sf_sl_animation'); ?>'}, // fade-in and slide-down animation
    speed: '<?php echo of_get_option('sf_speed'); ?>', // faster animation speed
    autoArrows: <?php echo of_get_option('sf_arrows'); ?>, // generation of arrow mark-up (for submenu)
    dropShadows: <?php echo of_get_option('sf_shadows'); ?> // drop shadows (for submenu)
    });

    // prettyphoto init
    jQuery("a[rel^='prettyPhoto']").prettyPhoto({
    animation_speed:'normal',
    slideshow:5000,
    autoplay_slideshow: false
    });

    });

    // Init for audiojs
    audiojs.events.ready(function() {
    var as = audiojs.createAll();
    });
    </script>

    <script type="text/javascript">
    jQuery(window).load(function() {
    // nivoslider init
    jQuery('#slider').nivoSlider({
    effect: '<?php echo of_get_option('sl_effect'); ?>',
    slices:<?php echo of_get_option('sl_slices'); ?>,
    boxCols:<?php echo of_get_option('sl_box_columns'); ?>,
    boxRows:<?php echo of_get_option('sl_box_rows'); ?>,
    animSpeed:<?php echo of_get_option('sl_animation_speed'); ?>,
    pauseTime:<?php echo of_get_option('sl_pausetime'); ?>,
    directionNav:<?php echo of_get_option('sl_dir_nav'); ?>,
    directionNavHide:<?php echo of_get_option('sl_dir_nav_hide'); ?>,
    controlNav:<?php echo of_get_option('sl_control_nav'); ?>,
    captionOpacity:<?php $sl_caption_opacity = of_get_option('sl_caption_opacity'); if ($sl_caption_opacity != '') { echo of_get_option('sl_caption_opacity'); } else { echo '0'; } ?>
    });
    });
    </script>
    <!-- Custom CSS -->
    <?php if(of_get_option('custom_css') != ''){?>
    <style type="text/css">
    <?php echo of_get_option('custom_css' ) ?>
    </style>
    <?php }?>




    <style type="text/css">
    /* Body styling options */
    <?php $background = of_get_option('body_background');
    if ($background != '') {
    if ($background['image'] != '') {
    echo 'body { background-image:url('.$background['image']. '); background-repeat:'.$background['repeat'].'; background-position:'.$background['position'].'; background-attachment:'.$background['attachment'].'; }';
    }
    if($background['color'] != '') {
    echo 'body { background-color:'.$background['color']. '}';
    }
    };
    ?>

    /* Header styling options */
    <?php $header_styling = of_get_option('header_color');
    if($header_styling != '') {
    echo '#header {background-color:'.$header_styling.'}';
    }
    ?>

    /* Links and buttons color */
    <?php $links_styling = of_get_option('links_color');
    if($links_styling) {
    echo 'a{color:'.$links_styling.'}';
    echo '.button {background:'.$links_styling.'}';
    }
    ?>

    /* Body typography */
    <?php $body_typography = of_get_option('body_typography');
    if($body_typography) {
    echo 'body {font-family:'.$body_typography['face'].'; color:'.$body_typography['color'].'}';
    echo '.container {font-size:'.$body_typography['size'].'; font-style:'.$body_typography['style'].';}';
    }
    ?>
    </style>
    </head>


    <!--[if IE 9 ]> <body <?php body_class('ie9'); ?>> <![endif]-->
    <body <?php body_class(); ?>>


    <div id="main"><!-- this encompasses the entire Web site -->
    <header id="header">


    <div class="container_24 container">


    <div class="grid_24">


    <div class="logo">

    <?php if(of_get_option('logo_type') == 'text_logo'){?>

    <?php if( is_front_page() || is_home() || is_404() ) { ?>

    <h1><a href="<?php bloginfo('url'); ?>/" title="<?php bloginfo('description'); ?>"><?php bloginfo('name'); ?></a></h1>
    <?php } else { ?>
    <h2><a href="<?php bloginfo('url'); ?>/" title="<?php bloginfo('description'); ?>"><?php bloginfo('name'); ?></a></h2>
    <?php } ?>

    <?php } else { ?>

    <?php if(of_get_option('logo_url') != ''){ ?>
    <a href="<?php bloginfo('url'); ?>/" id="logo"><img src="<?php echo of_get_option('logo_url', "" ); ?>" alt="<?php bloginfo('name'); ?>" title="<?php bloginfo('description'); ?>"></a>
    <?php } else { ?>
    <a href="<?php bloginfo('url'); ?>/" id="logo"><img src="<?php bloginfo('template_url'); ?>/images/logo.png" alt="<?php bloginfo('name'); ?>" title="<?php bloginfo('description'); ?>"></a>
    <?php } ?>

    <?php }?>
    </div>
    <nav class="primary">
    <?php wp_nav_menu( array(
    'container' => 'ul',
    'menu_class' => 'sf-menu',
    'menu_id' => 'topnav',
    'depth' => 0,
    'theme_location' => 'header_menu'
    ));
    ?>
    </nav><!--.primary-->
    <?php if ( of_get_option('g_search_box_id') == 'yes') { ?>
    <div id="top-search">
    <form method="get" action="<?php echo get_option('home'); ?>/">
    <input type="text" name="s" value="Site Search" onFocus="if(this.value=='Site Search'){this.value=''}" onBlur="if(this.value==''){this.value='Site Search'}" class="input-search"/><input type="submit" value="Go!" id="submit">
    </form>
    </div>
    <?php } ?>
    <?php if( is_front_page() ) { ?>
    <?php include_once(TEMPLATEPATH . '/slider.php'); ?>
    <?php } ?>
    </div>
    </div><!--.container-->
    </header>
    <div class="primary_content_tail">
    <div class="container_24 container primary_content_wrap clearfix">
     
    itamarlevy, Jan 30, 2012 IP
  7. yuranga

    yuranga Peon

    Messages:
    7
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Step 1:Login to wp admin section.
    Step 2:Go to appearance.
    Step 3: Header, then browse the image.
    step 4: upload and save, then Crop image if you want, then publish
    save the changes
     
    yuranga, Jan 30, 2012 IP
  8. itamarlevy

    itamarlevy Peon

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #8
    i dont have "header" under "appearance"...
     
    itamarlevy, Jan 30, 2012 IP
  9. riteshsanap

    riteshsanap Well-Known Member

    Messages:
    217
    Likes Received:
    2
    Best Answers:
    3
    Trophy Points:
    168
    #9
    Hello , according to your header.php it shows that it allows custom image adding, i guess its not in header section, try finding in the Admin panel of the theme for the logo option
     
    riteshsanap, Jan 31, 2012 IP
  10. itamarlevy

    itamarlevy Peon

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #10
    i do have the option to add one logo (i used mine) via my admin panel but i need to add a second logo (of one of my affiliates...).
     
    itamarlevy, Jan 31, 2012 IP
  11. riteshsanap

    riteshsanap Well-Known Member

    Messages:
    217
    Likes Received:
    2
    Best Answers:
    3
    Trophy Points:
    168
    #11
    Well you should have told that already,

    well you can add it beside your main logo by adding this HTML code
    <a href="my_affiliate_link"><img src="my_affiliate_img_url" /></a>
    Code (markup):
    after this code in header.php :
    
    <?php if(of_get_option('logo_type') == 'text_logo'){?>
    
    <?php if( is_front_page() || is_home() || is_404() ) { ?>
    
    <h1><a href="<?php bloginfo('url'); ?>/" title="<?php bloginfo('description'); ?>"><?php bloginfo('name'); ?></a></h1>
    <?php } else { ?>
    <h2><a href="<?php bloginfo('url'); ?>/" title="<?php bloginfo('description'); ?>"><?php bloginfo('name'); ?></a></h2>
    <?php } ?>
    
    <?php } else { ?>
    
    <?php if(of_get_option('logo_url') != ''){ ?>
    <a href="<?php bloginfo('url'); ?>/" id="logo"><img src="<?php echo of_get_option('logo_url', "" ); ?>" alt="<?php bloginfo('name'); ?>" title="<?php bloginfo('description'); ?>"></a>
    <?php } else { ?>
    <a href="<?php bloginfo('url'); ?>/" id="logo"><img src="<?php bloginfo('template_url'); ?>/images/logo.png" alt="<?php bloginfo('name'); ?>" title="<?php bloginfo('description'); ?>"></a>
    <?php } ?>
    
    <?php }?>
    Code (markup):
    replace the my_affiliate_link and my_affiliate_img_url with the respective data
     
    riteshsanap, Jan 31, 2012 IP
  12. itamarlevy

    itamarlevy Peon

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #12
    thank you so much! is there a way to push it to the right so it will be aligned with the navi bar?
     
    itamarlevy, Jan 31, 2012 IP
  13. riteshsanap

    riteshsanap Well-Known Member

    Messages:
    217
    Likes Received:
    2
    Best Answers:
    3
    Trophy Points:
    168
    #13
    well in the image tag add one more attribute :
    align="right"
    Code (markup):
    so the final code will be
    <a href="my_affiliate_link"><img src="my_affiliate_img_url" align="right" /></a>
    Code (markup):
     
    riteshsanap, Jan 31, 2012 IP
  14. itamarlevy

    itamarlevy Peon

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #14
    i tried that but i guess it kept it within the div's width so it appeared just under the navi bar but not to the right...
     
    itamarlevy, Jan 31, 2012 IP
  15. riteshsanap

    riteshsanap Well-Known Member

    Messages:
    217
    Likes Received:
    2
    Best Answers:
    3
    Trophy Points:
    168
    #15
    Well for fixing that i need to see your website
     
    riteshsanap, Jan 31, 2012 IP
  16. itamarlevy

    itamarlevy Peon

    Messages:
    9
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #16
    w3 buzzthe net / ef
     
    itamarlevy, Jan 31, 2012 IP
  17. riteshsanap

    riteshsanap Well-Known Member

    Messages:
    217
    Likes Received:
    2
    Best Answers:
    3
    Trophy Points:
    168
    #17
    Well i have seen your website, try taking out the code from the div of logo
     
    riteshsanap, Jan 31, 2012 IP
  18. yuranga

    yuranga Peon

    Messages:
    7
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #18
    I Agree.....Problem solved.
    Thanks
     
    yuranga, Jan 31, 2012 IP