Missing Sidebar and Footer

  • Resolved atomSmasher

    (@atomsmasher)


    13 years, 3 months ago

    Excuse my ignorance, I am very new to the web scene. I am missing a sidebar and footer on my custom theme. I was able to get the background images to appear for the header and content, but not for the footer and sidebar. I have followed several tutorials, researched to both ends of the internet and cannot figure out what I am doing wrong.

    I am attempting to create a layout that consists of a header, content and right sidebar. I really don’t want anything in my side bar from WordPress. I am going to put the site navigation and login there, but I would like the background to show up! I will post the basic code here and give the link to my site. I will be glad to give more code if its needed. Thanks in advance!

    index.php

    <?php get_header(); ?>

		<div id="container">
			<div id="content" role="main">

			<?php
			/* Run the loop to output the posts.
			 * If you want to overload this in a child theme then include a file
			 * called loop-index.php and that will be used instead.
			 */
			 get_template_part( 'loop', 'index' );
			?>
			</div><!-- #content -->
		</div><!-- #container -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

    header.php

    <!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title><?php
	/*
	 * Print the <title> tag based on what is being viewed.
	 */
	global $page, $paged;

	wp_title( '|', true, 'right' );

	// Add the blog name.
	bloginfo( 'name' );

	// Add the blog description for the home/front page.
	$site_description = get_bloginfo( 'description', 'display' );
	if ( $site_description && ( is_home() || is_front_page() ) )
		echo " | $site_description";

	// Add a page number if necessary:
	if ( $paged >= 2 || $page >= 2 )
		echo ' | ' . sprintf( __( 'Page %s', 'twentyten' ), max( $paged, $page ) );

	?></title>
<link rel="profile" href="https://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php

	if ( is_singular() && get_option( 'thread_comments' ) )
		wp_enqueue_script( 'comment-reply' );

        wp_head();
?>
</head>

<body <?php body_class(); ?>>
<div id="wrapper" class="hfeed">
	<div id="header">
		<div id="masthead">
                 .......
		</div><!-- #masthead -->
	</div><!-- #header -->

	<div id="main">

    sidebar.php

    <div id= "sidebar" class="widget-area" role="complementary">

</div><!-- #sidebar -->

    footer.php

    </div><!-- #main -->

	<div id="footer" role="contentinfo">

	</div><!-- #footer -->

</div><!-- #wrapper -->

<?php wp_footer(); ?>
</body>
</html>

    style.css

    /*
Theme Name: Mod Theme
Theme URI: https://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/
Description: My First Theme
Version: 1.0
Author: Jason
Author URl: https://www.itssimplydesign.com
*/

/* =Layout
-------------------------------------------------------------- */

/*
LAYOUT: Header, Content and Sidebar
DESCRIPTION:
*/

body {
	background-color: #e6e9Df;
}

#container {
	float: left;
	margin: 0 -240px 0 0;
	width: 100%;
}

#header {
	background: url(https://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/images/background_main_01.png) no-repeat;
	width: 1000px;
	height: 332px;

}

#sidebar {
	background: url(https://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/images/background_main_03.png) no-repeat;
	float: right;
	clear: right;
	overflow: hidden;
	width: 300px;
}

#content {
	background: url(https://www.itssimplydesign.com/wordpress/wp-content/themes/mod_theme/images/background_main_02.png) no-repeat;
	min-height: 668px;
	width: 700px;
	float: left;
}

#footer {
	clear: both;
	width: 100%;
}

Viewing 3 replies - 1 through 3 (of 3 total)

  • It’s all there according to your code. What exactly is the problem?

    Thread Starter atomSmasher

    (@atomsmasher)

    Sorry, I did a poor job of explaining. There are three background files. One for the header, which is showing at the top. One for the content, which is showing on the left. And there is a third, which should be the sidebar. It SHOULD appear under the gray strip in the header and to the right of the content. It shows up under media in page info, but not on the page.

    I discovered that the footer is actually working. I was coding much too late and didn’t realize it was blank!

    Thread Starter atomSmasher

    (@atomsmasher)

    Ok, so I figured out my problem. I didn’t pay enough attention to my styles. The sidebar was missing all of the height and width information! Rookie mistake.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Missing Sidebar and Footer’ is closed to new replies.