WordPress.org

Ready to get started?Download WordPress

Forums

Added a header image but it keeps repeating (5 posts)

  1. novice2012
    Member
    Posted 1 year ago #

    Hi. I am using the Fresh & Clean theme and I went into the Style.css and changed out the language so the theme accepts a header image, which I added by adding the URL. I succesfully added the header, but now it keeps repeating itself. Can someone suggest how to change out the code to stop the repeat? The header language is listed below:

    /*** Header ***/
    #header{background-image:url(http://www.xxxxxx.biz/images/title.jpg); margin:25px auto 0 auto; width:920px; padding: 20px; border-top: 1px solid #CCC; border-left:1px solid #CCC; border-right:1px solid #CCC; min-height:60px; position:relative}
    #header-logo{width:600px; text-align:left}
    #header-description{text-transform:capitalize; font-size:12px; margin:0 0 0 5px}

    #header-logo h1, #header-logo h2{font-family: 'Pacifico', arial, serif; font-size:30px; margin:0; border:none; line-height: 1.2em; padding: 0;}
    #header-logo a{color:#2C2C2C}

    #header-banner{width:468px; height:60px; position:absolute; right:20px; top:20px}

  2. j.musick
    Member
    Posted 1 year ago #

    #header {background-repeat:none}

    w3schools.com

  3. j.musick
    Member
    Posted 1 year ago #

    although, from the looks of it, your theme was designed to hold an image in the header div. If you have a file labeled header.php, check it for an image tag. Post a link?

  4. novice2012
    Member
    Posted 1 year ago #

    I can't post a link because it's a private client site, but here is the code for the header.php:
    [ Moderator Note: Please post code or markup snippets between backticks or use the code button. ]

    <?php $options = get_option( 'fresh_theme_settings' ); ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
    <head profile="http://gmpg.org/xfn/11">
    
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    <title><?php wp_title(''); ?><?php if(wp_title('', false)) { echo ' :'; } ?> <?php bloginfo('name'); ?></title>
    
    <!-- Styles & Favicon -->
    <link rel="icon" type="image/png" href="<?php echo $xs_favicon; ?>" />
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />
    
    <!-- JS & WP Head -->
    <?php
    if ( is_singular() ) wp_enqueue_script( 'comment-reply' );
    wp_head();
    ?>
    
    <? if ( is_front_page() ) { ?>
    <!-- nivoslider -->
    <script type="text/javascript">
    jQuery(function($){
    $(window).load(function() {
    //homepage Slider
    	$('#slider').nivoSlider({
    		directionNav: true,
    		directionNavHide: true,
    		captionOpacity: 0.8,
    		controlNav: false,
    		boxCols: 8,
    		boxRows: 4,
    		slices: 15,
    		effect:'<?php if($options['effect'] != '') { echo $options['effect']; } else { echo 'fade'; } ?>',
    		animSpeed: <?php if($options['anim_speed'] != '') { echo $options['anim_speed']; } else { echo 500; } ?>,
    		pauseTime: <?php if($options['pause_time'] != '') { echo $options['pause_time']; } else { echo 3000; } ?>
    	});
    	});
    });
    </script>
    <? } ?>
    
    <!-- Superfish Navigation Menu -->
    <script>
    jQuery(function($){
        $(document).ready(function() {
            $('ul.sf-menu').superfish({
                delay: 100,
                animation: {opacity:'show',height:'show'},
    			speed: 'normal',
                autoArrows:  false,
                dropShadows: true
            });
        });
    });
    </script>
    
    <?php
    // Get And Show Analytics Code
    echo stripslashes($options['analytics']);
    ?>
    
    </head>
    <body>
    <div id="header">
      <div id="header-logo">
     			 <?php if($options['logo'] !='') { ?>
                	<a>/" title="<?php bloginfo( 'name' ) ?>" rel="home"><img src="<?php echo $options['logo']; ?>" alt="<?php bloginfo( 'name' ) ?>" /></a>
               	 <?php } else { ?>
                	<?php if (is_front_page()) {?>
            			<h1><a>/" title="<?php bloginfo( 'name' ) ?>" rel="home"><?php bloginfo( 'name' ) ?></a></h1>
                    <?php } else { ?>
                    	<h2><a>/" title="<?php bloginfo( 'name' ) ?>" rel="home"><?php bloginfo( 'name' ) ?></a></h2>
    				<?php } ?>
            		<p id="header-description">
    					<?php bloginfo( 'description' ) ?>
    				</p>
                    <?php } ?>
    	</div><!-- /header-logo -->
    
    		<?php if($options['header_ad'] != '') { ?>
                <div id="header-banner">
                    <?php echo stripslashes($options['header_ad']); ?>
               </div><!-- END header-ad -->
           <?php } ?>
    
    </div><!-- /header -->
    <div id="primary-nav">
    <?php wp_nav_menu(
    	array(
    		'theme_location' => 'primary',
    		'sort_column' => 'menu_order',
    		'menu_class' => 'sf-menu',
        	'fallback_cb' => 'default_menu' ) ); ?>
    <div class="clear"></div>
    </div><!-- /primary-nav -->
    <div id="wrap">
    <?php if (is_front_page()) {?>
    <?php get_template_part( 'nivoslider' ) ?>
    <?php } ?>
  5. j.musick
    Member
    Posted 1 year ago #

    it looks like #header-banner is for an optional advertisement. What you've done by inserting a background image into #header will certainly work, as long as you specify the width and height of the <div>. Be aware that both the title/subtitle text and the advertisement will appear above the image. Currently, I think the height of that <div> is meant to fluctuate depending on whether you're on the home page or not, (based on the title appearing in <h2> tags instead of <h1>.) Also, unless you change the html, the image you're inserting will not be a link back to the home page.

    From a design perspective, if I understand what you want correctly, that isn't what background-image is really for. You are better off adding an <img> tag to the php, possibly removing completely the title and about portions.

Topic Closed

This topic has been closed to new replies.

About this Topic