Add second side bar

  • I moved the sidebar of my theme from right to left, but i now wish to add a 2nd sidebar on the right. I am currently stuck with the side bar at the bottom of the page. Could anyone tell me what I’m doing wrong? Thanks in advance.

    site – https://cruxof.it/blog/

    I tried adding margin-left: to right side bar to push it over, as i did with orginal move, but it still stays at bottom.

    Style sheet

    * {
	margin: 0 auto;
}
body {
	background: #ffffff;
	color: #000000;
	font-family: Georgia, Helvetica, sans-serif;
	font-size: .75em;

}
a {
	color: #000000;
	text-decoration: none;
}
cite {
	font-style: normal;
}
cite a {
	color: #ffffff;
	font-style: normal;
}
code {
	background: #efefef;
	border: 1px solid #dfdfdf;
	display: block;
	font-size: 1.1em;
	line-height: 1.3em;
	padding: 10px; */
}
h2 {
	font-size: 1.5em;
	font-weight: normal;
}
p {
	line-height: 1.5em;
	margin: 1.2em auto;
	text-align: left;
}
pre {
	background: #efefef;
	border: 1px solid #dfdfdf;
	display: block;
	font-size: 1.1em;
	line-height: 1.3em;
	overflow: auto;
	padding: 10px;

}
textarea {
	font-family: "Georgia, Helvetica, sans-serif;"
	font-size: 1.2em;
}

/* -header- */

#headerwrap {
	margin: 20px 0 20px 0;
	width: 100%;
        border: 0;
}
#header {
	clear: both;
	width: 800px;
}
.bloginfo {
	width: 700px;
        border: 0;
}
.bloginfo a {
        background-color: transparent;
        border: 0;
}
.searchform {
	width: 220px;
}

/* -content- */

}
#content {
	float: left;
	width: 500px;
}
/* -adjust to page content width- */
#contentwrap {
	width: 880px;
}

/* -post and entries- */

.post {
	margin-bottom: 20px;
        margin-left: 160px;

}
.post a {
	color: #000000;
	text-decoration: none;
}
.post a:hover {
	color: #00ffff;
}
.post blockquote {
	background: #efefef;
	border: 0;
	margin: 1.2em auto;
	padding: 0.1em 1em;
}
.post embed, .post img, .post object {
	display: block;
	margin: 1em auto;
	max-width: 500px;
}
.post img, .post object {
	/* background: #efefef;
	border: 1px solid #dfdfdf;
	padding: 2px; */
}
.post embed.alignleft, .post img.alignleft, .post object.alignleft {
	margin: 0 10px 10px 0;
}
.post embed.alignright, .post img.alignright, .post object.alignright{
	margin: 0 0 10px 10px;
}
.post h2 {
        color: #ffffff;
        /* border-top: 2px solid #000000; */
	font-size: 1.5em;
	/* font-weight: bold; */

	text-transform: none;
        background-color: transparent;
}
.post h3 {
        color: #acacac;
}
.post h2 a {
	color: #000000;
}
.post h2 a:hover {
	color: #00FFFF;
}
.post ul, .post ol {
	line-height: 0em;
	margin: 1em auto;
}
.post .wp-smiley {
	border: none;
	display: inline;
	margin: 0;
}
.postmetadata-top {
	border-bottom: 1px dotted #dfdfdf;
	margin-top: 0;
	padding-bottom: 0em;
        padding-left: 5px;
	text-transform: uppercase;
}
.postmetadata-bottom {
	margin: 0em;
	text-transform: uppercase;
}
.post .comment-button {
	margin: 1.2em 0 1.2em 0;
	text-transform: uppercase;
}
.post .comment-button a {
	background: #000000;
	color: #ffffff;
	padding: 3px 10px 3px 10px;
}
.post .comment-button a:hover {
	color: #00FFFF;
}

/* -post tables- */

.post table {
	background-color: transparent;
	line-height: 1.5em;
	margin: 0em auto;
        border-collapse: collapse;
        width: 100%;
}
.post th, .post td {
        border-top: 1px solid #000000;
	background: transparent;

}

/* -sidebar- */

#sidebar1wrap,
#sidebar2wrap {
	float: left;
	margin-bottom: 20px;

}
#sidebar1 {
	width: 140px;
            float: left;
}

#sidebar2 {
	width: 140px;
        margin-left: 680px;
        float: left;
}

#sidebar1 a, #sidebar1 li.recentcomments, #sidebar1 .textwidget,
#sidebar2 a, #sidebar2 li.recentcomments, #sidebar2 .textwidget {
	border-bottom: 1px dotted #dfdfdf;
	color: #000000;
	display: block;
	padding: 2px 2px 2px 10px;
}
#sidebar1 a:hover,
#sidebar2 a:hover {
	background: #000000;
	color: #00ffff;
}
#sidebar1 h2,
#sidebar2 h2 {
	/ *background: #dfdfdf;
        display: block; */
        color: #000000;
        border-bottom: 1px solid #000000;
	font-size: 1em;
	/* font-weight: bold; */
	padding-left:10px;
	text-transform: none;
}
#sidebar1 h2.small,
#sidebar2 h2.small {
	margin: 10px 0 10px 0;
}
#sidebar1 li,
#sidebar2 li {
	list-style: none;
}
#sidebar1 li.recentcomments:hover,
#sidebar2 li.recentcomments:hover {
	background: #000000;
	color: #ffffff;
}
#sidebar1 li.recentcomments:hover a,
#sidebar2 li.recentcomments:hover a {
	color: #ffffff;
}
#sidebar1 li.recentcomments a,
#sidebar2 li.recentcomments a {
	border: none;
}
#sidebar1 li.widget_categories ul li,
#sidebar2 li.widget_categories ul li {
	border-bottom: 1px dotted #dfdfdf;
	display: block;
	padding: 3px 3px 3px 10px;
        font-size: 0em;
}
#sidebar1 li.widget_categories ul li a,
#sidebar2 li.widget_categories ul li a {
	border-bottom: none;
	display: inline;
	padding: 0;
}
#sidebar1 li.widget_categories ul li:hover, #sidebar1 li.widget_categories ul li:hover a,
#sidebar2 li.widget_categories ul li:hover, #sidebar2 li.widget_categories ul li:hover a {
	background: #000000;
	color: #ffffff;
}
#sidebar1 select,
#sidebar2 select {
	margin: 3px 0 3px 0;
	width: 100%;
}
#sidebar1 small,
sidebar2 small {
	text-transform: uppercase;
}
#sidebar1 .textwidget,
#sidebar2 .textwidget {
	padding: 3px 0 3px 0;
}
#sidebar1 .textwidget img,
#sidebar2 .textwidget img {
	display: block;
}
#sidebar1 .textwidget a,
#sidebar2 .textwidget a {
	display: inline;
}
#sidebar1 ul,
#sidebar2 ul {
	margin: 0;
	padding: 0;
}
#sidebar1 ul.children a, #sidebar1 li.page_item ul li.page_item a,
#sidebar2 ul.children a, #sidebar2 li.page_item ul li.page_item a {
	padding-left: 20px;
}
#sidebar1 ul.children ul.children a, #sidebar1 li.page_item ul li.page_item ul li.page_item a,
#sidebar2 ul.children ul.children a, #sidebar2 li.page_item ul li.page_item ul li.page_item a {
	padding-left: 30px;
}
#sidebar1 ul.children ul.children ul.children a, #sidebar1 li.page_item ul li.page_item ul li.page_item ul li.page_item a,
#sidebar2 ul.children ul.children ul.children a, #sidebar2 li.page_item ul li.page_item ul li.page_item ul li.page_item a {
	padding-left: 40px;
}
#sidebar1 .widget_text a, #sidebar1 .widget_text a img,
#sidebar2 .widget_text a, #sidebar2 .widget_text a img {
	border: none;
	padding: 0;
}
#sidebar1 .widget_tag_cloud,
#sidebar2 .widget_text a, #sidebar2 .widget_text a img {
	border-bottom: 1px dotted #dfdfdf;
	margin-bottom: 10px;
	padding-bottom: 3px;
}
#sidebar1 .widget_tag_cloud a,
#sidebar2 .widget_tag_cloud a {
	border: none;
	display: inline;
	padding: 0 3px 0 3px;
}
#sidebar1 .widget_tag_cloud h2,
#sidebar2 .widget_tag_cloud a {
	margin-bottom: 10px;
}
#sidebar1 .widget_rss h2.small a,
#sidebar2 .widget_rss h2.small a {
	border: none;
	display: inline;
	color: #ffffff;
	padding: 0;
}
#sidebar1 .widget_rss h2.small a img,
#sidebar2 .widget_rss h2.small a img {
	display: none;
}
#sidebar1 .widget_rss ul li {
#sidebar2 .widget_rss h2.small a img {
	border-bottom: 1px dotted #dfdfdf;
	display: block;
}
#sidebar1 .widget_rss ul li a.rsswidget,
#sidebar2 .widget_rss ul li a.rsswidget {
	border: none;
	display: block;
	padding: 3px 3px 3px 10px;
}
#sidebar1 .widget_rss ul li cite,
#sidebar2 .widget_rss ul li cite {
	color: #00FFFF;
	font-size: .75em;
	text-transform: uppercase;
	padding-bottom: 3px;
}
#sidebar1 .widget_rss ul li .rss-date,
#sidebar2 .widget_rss ul li .rss-date {
	color: #00FFFF;
	display: block;
	font-size: .75em;
	text-transform: uppercase;
}
#sidebar1 .widget_rss ul li .rssSummary,
#sidebar2 .widget_rss ul li .rssSummary {
	padding-bottom: 3px;
}

/* -sidebar calendar- */

#sidebar1 .widget_calendar h2 {
	display: none;
}
#sidebar1 .widget_calendar caption {
	background: #000000;
	color: #ffffff;
	font-size: 1em;
	font-weight: bold;
	margin: 20px 0 10px 0;
	padding: 10px;
	text-align: left;
}
#sidebar1 .widget_calendar table {
	border: 1px dotted #dfdfdf;
	width: 100%;
}
#sidebar1 .widget_calendar table a {
	border: none;
	color: #000000;
	display: block;
	padding: 3px;
}
#sidebar1 .widget_calendar table a:hover {
	background: #000000;
	color: #ffffff;
}
#sidebar1 .widget_calendar table td {
	color: #dfdfdf;
	text-align: center;
}
#sidebar1 .widget_calendar table th {
	color: #000000;
	text-align: center;
}

/* -comments- */

#comments, #respond {
	background: #ffffff;
	width: 510px;
}
#commentpages {
	margin-bottom: 20px;
}
ul#commentlist {
	list-style: none;
	margin-bottom: 20px;
	padding: 0;
}
ul#commentlist li.comment {
	border-top: 1px dotted #dfdfdf;
	padding: 20px 0 20px 0;
}
ul#commentlist ul.children {
	list-style: none;
	padding: 0 0 0 20px;
}
ul#commentlist ul.children li {
	border-top: 1px dotted #dfdfdf;
	margin: 10px 0 0 0;
	padding: 10px 0 0 0;
}
ul#commentlist li blockquote {
	background: #efefef;
	border: 1px solid #dfdfdf;
	margin: 1.2em auto;
	padding: 0.1em 1em;
}
/*ul#commentlist a {
	color: #00FFFF;
}*/
h2.comments {
	background: #000000;
	color: #ffffff;
	display: block;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 20px;
	padding: 10px;
	text-transform: uppercase;
}
h2.respond {
	background: #000000;
	color: #ffffff;
	display: block;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 20px;
        margin-left: 110px;
	padding: 10px;
	text-transform: uppercase;
}
h2.commentpages {
	background: #000000;
	color: #ffffff;
	display: block;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 20px;
	padding: 10px;
	text-transform: uppercase;
}
small a.comment-edit-link {
	color: #00FFFF;
	text-transform: uppercase;
}
#commentlist div .avatar {
	background: #efefef;
	border: 1px solid #dfdfdf;
	float: left;
	margin: 0 10px 10px 0;
	padding: 3px;
}
.vcard .fn, .vcard .says {
	font-weight: bold;
}
.comment-meta {
	font-size: .8em;
	margin-bottom: 40px;
	text-transform: uppercase;
}
.comment-meta a {
	color: #000000;
}
.comment-meta a.comment-edit-link {
	color: #00FFFF;
}
.reply {
	margin-top: 20px;
	text-align: left;
}
li.depth-1 #respond {
	margin: 0 0 -20px 0;
}
li.depth-2 #respond {
	margin: 0 0 -20px -20px;
}
li.depth-3 #respond {
	margin: 0 0 -20px -40px;
}
li.depth-4 #respond {
	margin: 0 0 -20px -60px;
}
li.depth-5 #respond {
	margin: 0 0 -20px -80px;
}
#commentform {
	padding-bottom: 20px;
	width: 550px;
}
#commentform a {
	color: #00FFFF;
}
#commentform input, #commentform textarea {
	background: #efefef;
	border: 1px solid #dfdfdf;
	color: #000000;
	padding: 3px;
}
#commentform #commentbox {
	height: 100px;
	width: 510px;
}
#commentform #submit {
	color: #000000;
	margin-top: 20px;
}
#commentform small {
	text-transform: normal;
}
.commentlinks a {
	color: #000000;
	padding: 5px 10px 5px 10px;
}
.commentlinks a:hover {
	background: #000000;
	color: #ffffff;
}
.commentlinks .current {
	background: #000000;
	color: #ffffff;
	padding: 5px 10px 5px 10px;
}

/* -search form- */

#s {
	background: #ffffff url("images/mag.png") top left no-repeat;
        border: 1px solid #000000;
	color: #000000;
	padding: 3px 3px 3px 22px;
	width: 150px;
}
#searchsubmit {
	display: none;
}

/* -footer- */

#footer {
	border-top: 1px solid #000000;
	clear: both;
	padding: 20px 0 20px 0;
	text-align: right;
	width: 880px;
}
#footer a {
	color: #000000;
}
#footer small {
	text-transform: uppercase;
}

/* -misc and universal- */

.navlink {
	background: #ffffff;
	color: #000000;
	display: block;
	margin: 20px 0 20px 0;
	padding: 10px;
	text-align: right;
}
.navlink a:hover {
	color: #00FFFF;
}
.uppercase {
	text-transform: uppercase;
}
.wp-smiley {
	border: none;
	display: inline;
	margin: 0;
}

/* -floats - */

.aligncenter, div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.alignleft {
	float: left;
}
.alignright {
	float: right;
}

    Main index

    <?php get_header();?>
<?php include ('sidebar1.php'); ?>
<div id="content">
		<?php if (have_posts()) : ?>
		<?php while (have_posts()) : the_post(); ?>
		<div class="post" id="post-<?php the_ID(); ?>">
			<TABLE border="0" valign="bottom"><tr><td align="left"><h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a> <?php edit_post_link('- Edit Post'); ?></h2></td>
                         <td align="right">
                          <h3><font size="-2"><?php the_date('d.M.Y'); ?></font></h3></td></tr>
                         </TABLE>
			<div class="postmetadata-top"><small>Filed In: <?php the_category(', '); ?></small></div>
			<?php the_content('Read more &rsaquo;'); ?>

                      <div class="postmetadata-bottom"><small>Tags: <?php the_tags('', ', '); ?><br />
                      Written by: <?php the_author_posts_link(); ?></small></div>

                      <div align="right" class="comment-button">
                      <small><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?></small></div>

		</div>
		<?php endwhile; ?>
		<?php endif; ?>
		<div class="navlink">
			<?php posts_nav_link(' <font color="#a5a5a5">&mdash;</font> ', '&lsaquo; Newer Posts', 'Older Posts <font color="#a5a5a5">&rsaquo;</font>'); ?>
		</div>
	</div>
	<?php include ('sidebar2.php'); ?>
<?php get_footer();?>

Viewing 14 replies - 1 through 14 (of 14 total)
  • Thread Starter nmknmk

    (@nmknmk)

    Sorry, link is actually https://cruxof.it/blogtest/ moved to test area

    Thread Starter nmknmk

    (@nmknmk)

    Anyone?

    try following the instructions here:
    https://www.blogohblog.com/adding-extra-sidebar-to-your-wordpress-theme/

    what you are doing wrong is basically 2 things :
    1. you have 2 (yes, two) content divs nested one inside the other, but same id)
    2. your css code is full of errors, which makes it very difficult for the browser to understand what you want, mainly because you have a lot of not closed rules, one of which , at line 339 more or less, regards also your sidebar (among others)

    I’m actually having a similar problem at my test site

    https://cmstest.jediarchiveonline.com

    i’m convinced it has something to do with my css… I just cant figure it out.

    /*————————————————*/
    /*——————[BASE STYLES]—————–*/
    /*————————————————*/
    body { margin: 0px 0px; padding: 0px 0px; color: #84878E; background-color:#292929; background-image: url(images/bg.gif); background-repeat: repeat-y; background-position: top; font-family: Trebuchet MS; font-size: 11px; line-height: 18px; }
    a:link, a:visited { text-decoration: none; color: #3399FF; }
    a:hover { color: #FFF; text-decoration: underline; }
    h1, h2, h3, h4, h5 { margin: 0px 0px 10px 0px; font-weight: normal; }
    h3 { font-size: 20px; }
    ul { line-height: 22px; list-style-image: url(images/bullet-Blue.gif); }

    /*————————————————*/
    /*——————[MAIN LAYOUT]—————–*/
    /*————————————————*/
    .headings { color: #000; margin-bottom: 10px; display: block; width: 100%; }
    #wrapper { width: 1226px; margin: auto; padding: 0px 0px 0px 0px; margin-top: 62px; }
    #wrapper2 { width: 100%; margin: 0px 0px; background-image: url(images/bg2.png); background-color: #000000 ; background-position: top center; background-repeat: no-repeat; float: left; }
    .single-entry { float: left; width: 613px; margin-bottom: 10px; padding: 13px; background-color: #262D2B; background-image: url(images/category-post-bg.gif); background-position: bottom; background-repeat: no-repeat; }
    .post-wrapper { background-color: #262D2B; margin-top: 0px; padding: 0px 15px 15px 15px; background-image: url(images/category-post-bg.gif); background-repeat: no-repeat; background-position: bottom; width: 609px; float: left; }
    .home-post-wrap { width: 313px; height: 280px; float: left; background-color: #262D2B; background-image: url(images/home-post-bottom.gif); background-repeat: no-repeat; background-position: bottom; margin: 0px 13px 10px 0px; padding: 0px; }
    .home-post-wrap-2 { width: 313px; float: left; background-color: #262D2B; background-image: url(images/home-post-bottom.gif); background-repeat: no-repeat; background-position: bottom; margin: 0px 13px 10px 0px; padding: 0px; }
    .post-inside { padding: 8px 13px 13px 13px; }
    .post-inside-small { padding: 4px 13px 4px 13px; margin-top: 4px; float: left; }
    .comments-bubble { background-image: url(images/comment-count-bg-Blue.gif); width: 18px; height: 15px; float: right; margin: 0px; padding: 0px 0px 0px 4px; color: #6D200C; display: block; }
    .comments-bubble a, .comments-bubble a:visited, .comments-bubble a:hover { font-size: 8px; color: #6D200C !important; margin: -5px 0px 0px 0px; float: left; padding: 0px; }
    blockquote { overflow: auto; padding: 0 10px; margin: 20px 30px; background: #1E2422; border: 1px solid #141918; }
    #container { float: left; width: 1226px; color: #CFCFCF; border-top: 1px solid #515E5B; background-color: #323C3A; background-image: url(images/content-bg.gif); background-repeat: repeat-x; }
    #left-div { width: 927px; float: right; padding-left: 13px; padding-right: 13px; }
    .icons { margin-top: 0px; margin-bottom: -5px; margin-right: 10px; }
    .post-info { color: #5B6461; font-size: 10px; display: block; border-top: 1px solid #3B4341; border-bottom: 1px solid #3B4341; padding: 2px 0px 2px 0px; margin: 0px 0px 5px 0px; }
    .post-info-small { color: #5B6461; font-size: 10px; display: block; width: 228px; border-top: 1px solid #3B4341; border-bottom: 1px solid #3B4341; padding: 2px 0px 2px 0px; margin: 0px 0px 0px 0px; float: right; }
    .post-info a { color: #5B6461; }
    .logo { float: left; border: 0px; border-left: 0px solid #515E5B; }
    .current-category { background-color: #3E4846; color: #FFFFFF; border: 1px solid #485351; padding: 5px; display: block; margin-bottom: 10px; width: 629px; }
    .thumbnail { border: 5px solid #333E3C !important; margin-right: 10px; float: left; display: inline; }
    .thumbnail-small { border: 3px solid #333E3C !important; margin-right: 10px; float: left; display: inline; }
    .articleinfo { border-bottom: 1px solid #EEEEEE; padding-bottom: 7px; color: #545454; }
    .adwrap { float: left; margin: 10px 0px 0px 9px;}
    #about-image { float: left; margin: 0px 10px 5px 0px; border: 8px solid #394340; }

    /*————————————————*/
    /*———————[TITLES]——————-*/
    /*————————————————*/
    .single-entry-titles { width: 614px; height: 23px; background-image: url(images/post-title-bg-2-Blue.gif); color: #FFF; display: block; padding: 7px 10px 0px 15px; font-weight: bold; float: left; margin: 0px; font-size: 12px; }
    .single-entry-titles a { float: left; }
    .post-title { line-height: 30px; margin-top: 10px; }
    .post-title a { font-size: 25px; }
    .home-post-titles { width: 288px; height: 23px; background-image: url(images/post-title-bg-Blue.gif); color: #FFF; display: block; padding: 7px 10px 0px 15px; font-weight: bold; }
    .home-post-titles h2 { font-size: 12px; margin: 0px; font-weight: bold; }
    .home-post-titles a { float: left; }
    .home-post-titles a:link, .home-post-titles a:visited { color: #FFF; }
    .titles { font-weight: normal; font-size: 24px; text-decoration: none; }
    .titles a:link, .titles a:visited, .titles a:active { text-decoration: none; font-size: 20px; font-family: Trebuchet MS; margin-bottom: 10px; margin-top: 10px; display: block; }

    /*————————————————*/
    /*——————–[COMMENTS]——————*/
    /*————————————————*/
    .commentlist { padding: 0px; margin: 0px 0px 0px 27px; width: 560px; background-image: url(images/comment-bg.gif); list-style-image: none; list-style-type: none; float: left; }
    .commentlist li { font-weight: bold; width: 560px; display: block; background-image: url(images/comment-bottom.gif); background-repeat: no-repeat; background-position: bottom left; padding: 0px 0px 45px 0px; margin: 0px; list-style-image: none; list-style-type: none; float: left; }
    .commentlist li div { width: 540px; display: block; background-image: url(images/comment-top.gif); background-repeat: no-repeat; margin: 0px; padding: 10px; float: left; }
    .commentlist li .avatar { float: left; border: 1px solid #eee; padding: 2px; border: 5px solid #3E4C49; background-color: #3E4C49; }
    .commentlist cite { font-size: 18px; float: left; font-style: normal; margin-left: 10px; margin-right: 6px; margin-top: 5px; font-weight: normal; }
    .says { display: none; }
    .commentlist p { font-weight: normal; line-height: 1.5em; text-transform: none; display: block; float: left; width: 90%; margin-left: 3%; }
    #commentform p { clear: both; }
    .alt { margin: 0; padding: 10px; }
    .nocomments { text-align: center; margin: 0; padding: 0; }
    .commentlist .children li { width: 90%; display: block; margin: 0px; background-color: #2F3836; background-image: url(images/comment-children-bg.gif); background-position: left; background-repeat: repeat-y; border: 1px solid #262D2B; overflow: hidden; }
    .commentlist .children li div { width: 97%; padding: 3%; background-image: url(images/comment-children-top.gif); background-repeat: no-repeat; background-position: top left; }
    .commentlist .commentmetadata { font-weight: normal; float: left; margin: 5px 0px 0px 0px; display: block; clear: both; background-image: none; width: 90%; margin-left: 3%; }
    .commentlist .vcard, .commentlist .children .comment-author, .commentlist .children .vcard, .commentlist .commentmetadata, .commentlist .children .comment-author, .commentlist .children .comment-meta { background-image: none; width: 100%; padding: 0px !important; }
    .commentlist .reply, .commentlist .children .reply { float: right; background-image: none; width: 54px; height: 22px; margin-bottom: 0px; padding: 0px; margin-right: 10px; font: 0.9em ‘Lucida Grande’, Verdana, Arial, Sans-Serif; }
    .commentlist .reply a:link, .commentlist .reply a:hover, .commentlist .children .reply a:link, .commentlist .children .reply a:hover { background-image: url(images/reply.gif); width: 39px; height: 17px; display: block; color: #FFF; font-size: 8px; text-transform: lowercase; font-weight: normal; padding: 5px 0px 0px 15px; letter-spacing: 1px; }
    .commentlist .children li { padding-bottom: 10px; }
    .commentlist .children li ul li { padding-bottom: 10px; background-color: #2F3836; }
    #respond { margin-top: 20px; float: left; background-image: none; }
    .commentlist #respond h3, .commentlist #respond a { margin-left: 28px; }
    #comments { line-height: 30px; }
    .children { clear: both; }
    .children .commentmetadata, .children .vcard { background-image: none; }
    .children textarea { width: 90% !important; }
    .children input { width: 80% !important; }
    #cancel-comment-reply-link { display: block; background-image: url(images/comment-close.gif); width: 144px; height: 21px; padding: 5px 0px 0px 23px; font-weight: normal; color: #84878E; font: 1em ‘Lucida Grande’, Verdana, Arial, Sans-Serif; }
    #respond div { background-image: none; }
    #submit { width: 120px !important; }

    /*————————————————*/
    /*—————–[COMMENT FORM]—————–*/
    /*————————————————*/
    #commentform { margin: 10px 0px 0px 20px; }
    #commentform textarea { background: #1E2422; border: 1px solid #141918; width: 350px; color: #FFF; padding: 10px; }
    #commentform #email { font-size: 13px; background: #1E2422; border: 1px solid #141918; width: 220px; background-image: url(images/comment-email.gif); background-position: 7px 7px; background-repeat: no-repeat; height: 20px; padding-left: 30px; padding-top: 6px; color: #FFF; margin-bottom: 3px; }
    #commentform #author { font-size: 13px; background: #1E2422; border: 1px solid #141918; width: 220px; background-image: url(images/comment-author.gif); background-position: 7px 7px; background-repeat: no-repeat; height: 20px; padding-left: 30px; padding-top: 6px; color: #FFF; margin-bottom: 3px; }
    #commentform #url { font-size: 13px; background: #1E2422; border: 1px solid #141918; width: 220px; background-image: url(images/comment-website.gif); background-position: 7px 7px; background-repeat: no-repeat; height: 20px; padding-left: 30px; padding-top: 6px; color: #FFF; margin-bottom: 3px; }

    /*————————————————*/
    /*—————[PAGES NAVIGATION]—————*/
    /*————————————————*/
    #pages { width: 1226px; float: right; height: 41px; background-image: url(images/pages-bg-Blue.gif); }
    #pages ul { width: 650px; list-style-type: none; list-style-image: none; float: left; padding: 0px 0px 0px 6px; margin: 0px; background-image: url(images/pages-bg-left-Blue.gif); background-repeat: no-repeat; background-position: left; }
    #pages ul li { float: left; display: block; height: 41px; padding: 0px; }
    #pages ul li a:link, #pages ul li a:visited, #pages ul li a:active { float: left; color: #FFDF81; display: block; height: 32px; font-size: 12px; padding: 9px 20px 0px 20px; margin: 0px; font-weight: bold; }
    #pages ul li a:hover { background-color: #0097C2; text-decoration: none; height: 31px; margin-top: 1px; padding-top: 8px; color: #FFF; }

    /*—————[DROPDOWN MENU]—————*/
    .nav, .nav * { margin:0; padding:0; list-style:none; }
    .nav ul { position:absolute; top:-999em; padding-bottom: 9px; }
    .nav li { float:left; position:relative; z-index:99; font-size:12px; height: 40px !important; border: none !important; }
    .nav a { display:block; }
    .nav ul li { width: 100%; }
    .nav li:hover ul, ul.nav li.sfHover ul { left: 0px; top:40px; }
    .nav li:hover li ul, .nav li.sfHover li ul { top:-999em; }
    .nav li li:hover ul, ul.nav li li.sfHover ul { left:15em; top:0px; }
    .nav li:hover ul, .nav li li:hover ul { top: -999em; }
    .nav li li { display: block; padding: 0px; height: 40px; }
    .nav li ul li ul li { left: 60px; }
    .nav li:hover { background-color: #262D2B; padding: 0px !important; margin: 0px; border: none; }
    .nav li li a:link, .nav li li a:visited { width: 180px; display: block; background-color: #262D2B; padding: 10px 30px 0px 30px !important; margin: 0px 0px 0px 0px !important; border: none; font-weight: normal; height: 30px; background-image: none !important; }
    .nav li li a:hover { background-color: #1F2624 !important; text-decoration: none; border: none; }

    /*————————————————*/
    /*————-[CATEGORIES NAVIGATION]————*/
    /*————————————————*/
    #categories { width: 1224px; height: 40px; background-image: url(images/categories-bg.gif); float: left; background-color: #2A3331; border-top: 1px solid #424D4B; border-bottom: 1px solid #1A201E; border-left: 1px solid #424D4B; border-right: 1px solid #1A201E; margin: 0px; }
    #categories ul { margin: 0px; padding: 0px; list-style-type: none; list-style-image: none; float: left; }
    #categories ul li { float: left; display: block; padding-left: 0px; margin: 0px; height: 40px; }
    #categories ul li a:link, #categories ul li a:visited, #categories ul li a:active { height: 31px; display: block; color: #FFFFFF; font-size: 11px; padding: 9px 10px 0px 10px; float: left; margin: 0px 1px; background-image: url(images/categories-line.gif); background-position: right; background-repeat: no-repeat; }
    #categories ul li a:hover { text-decoration: none; }

    /*—————[DROPDOWN MENU]—————*/
    #nav2 li li:hover ul, ul#nav2 li li.sfHover ul { left: 174px; }
    #nav2 li ul { background-image: none; }
    #nav2 li ul { width: 240px !important; }
    #nav2 li { z-index:1001; }
    #nav2 li:hover ul, ul#nav2 li.sfHover ul { left: -6px; }
    #nav2 li li a:link, #nav2 li li a:visited { background-color: #0097c2 !important; padding: 10px 30px 0px 30px !important; font-weight: normal; }
    #nav2 li li a:hover { background-color: #0087ae !important; }
    #nav2 li:hover { background-color: #0097c2; }

    /*————————————————*/
    /*————[CAPTIONS AND ALIGNMENTS]———–*/
    /*————————————————*/
    .aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; }
    .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
    .wp-caption img { margin: 0; padding: 0; border: 0 none; }
    .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; }
    p img { padding: 0; max-width: 100%; }
    img.centered { display: block; margin-left: auto; margin-right: auto; }
    img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; }
    img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
    .alignright { float: right; }
    .alignleft { float: left }

    /*————————————————*/
    /*——————-[SIDEBAR]——————–*/
    /*————————————————*/
    #sidebar { float:left; padding-left: 1px; padding-right: 0px; width: 272px; }
    .sidebar-box { float: left; background-color: #262D2B; background-image: url(images/sidebar-bg.gif); background-repeat: repeat-x; padding-bottom: 15px; width: 273px; }
    .sidebar-box ul li { color: #ffffff; margin: 0px 0px; display: block; float: left; width: 273px; }
    .sidebar-box ul { list-style-type: none; margin: 0px 0px; padding: 0px 0px; width: 273px; }
    .sidebar-box ul li a:link, .sidebar-box ul li a:visited, .sidebar-box ul li a:active { color: #FFF; border-top: 1px solid #36423F; border-bottom: 1px solid #192522; width: 228px; padding: 5px 10px 5px 35px; margin: 0px 0px; display: block; background-image: url(images/bullet-Blue.gif); background-repeat: no-repeat; background-position: 10px 10px; }
    .sidebar-box ul li a:hover { color: #FFF; background-color: #202624; border-bottom: 1px solid #141917; border-top: 1px solid #262D2B; background-image: url(images/bullet-hover.gif); text-decoration: none; }
    .sidebar-box h2 { font-size: 11px; color: #FFF; font-weight: normal; text-transform: lowercase; font-weight: bold; font-family: Trebuchet MS; background-image: url(images/h3-bg.gif); background-repeat: no-repeat; background-position: left; width: 256px; height: 25px; padding: 5px 0px 0px 17px; margin: 0px 0px; }

    /*—————-[RECENT COMMENTS]—————–*/
    #recentcomments li a:link, #recentcomments li a:visited, #recentcomments li a:active { background-image: none; border: none; }
    #recentcomments { margin-top: 10px; }
    #recentcomments li { display: bock; border-top: 1px solid #36423F; border-bottom: 1px solid #192522; background-image: url(images/comment-author.gif); background-position: 10px 4px; background-repeat: no-repeat; padding-left: 35px; padding-top: 5px; padding-bottom: 5px; padding-right: 10px; width: 228px; color: #FFF; }

    /*————————————————*/
    /*——————-[SIDEBAR-RIGHT]————–*/
    /*————————————————*/
    #sidebar-right { float: right; padding-left: 0px; padding-right: 1px; width: 272px; }
    .sidebar-box { float: right; background-color: #262D2B; background-image: url(images/sidebar-bg.gif); background-repeat: repeat-x; padding-bottom: 15px; width: 273px; }
    .sidebar-box ul li { color: #ffffff; margin: 0px 0px; display: block; float: right; width: 273px; }
    .sidebar-box ul { list-style-type: none; margin: 0px 0px; padding: 0px 0px; width: 273px; }
    .sidebar-box ul li a:link, .sidebar-box ul li a:visited, .sidebar-box ul li a:active { color: #FFF; border-top: 1px solid #36423F; border-bottom: 1px solid #192522; width: 228px; padding: 5px 10px 5px 35px; margin: 0px 0px; display: block; background-image: url(images/bullet-Blue.gif); background-repeat: no-repeat; background-position: 10px 10px; }
    .sidebar-box ul li a:hover { color: #FFF; background-color: #202624; border-bottom: 1px solid #141917; border-top: 1px solid #262D2B; background-image: url(images/bullet-hover.gif); text-decoration: none; }
    .sidebar-box h5 { font-size: 11px; color: #FFF; font-weight: normal; text-transform: lowercase; font-weight: bold; font-family: Trebuchet MS; background-image: url(images/h4-bg.gif); background-repeat: no-repeat; background-position: left; width: 256px; height: 25px; padding: 5px 0px 0px 17px; margin: 0px 0px; }

    /*—————-[RECENT COMMENTS]—————–*/
    #recentcomments li a:link, #recentcomments li a:visited, #recentcomments li a:active { background-image: none; border: none; }
    #recentcomments { margin-top: 10px; }
    #recentcomments li { display: bock; border-top: 1px solid #36423F; border-bottom: 1px solid #192522; background-image: url(images/comment-author.gif); background-position: 10px 4px; background-repeat: no-repeat; padding-left: 35px; padding-top: 5px; padding-bottom: 5px; padding-right: 10px; width: 228px; color: #FFF; }

    /*————————————————*/
    /*—————[FEATURED ARTICLES]————–*/
    /*————————————————*/
    .titles-featured a, .titles-featured a:hover, .titles-featured { font-size: 30px; display: block; margin-bottom: 5px; margin-top: 5px; }
    .featured-inside { width: 593px; padding: 13px; margin-top: 109px; background-image: url(images/featured-bg.png); overflow: hidden; height: 105px; }
    .next-button { display: none; position: absolute; }
    .prev-button { display: none; position: absolute; }
    #sections { overflow:hidden; width: 639px; height: 260px; margin: 0px; float: left; margin-bottom: 13px; }
    #sections ul { height: 240px; margin: 0px; list-style-image: none; list-style-type: none; padding: 0px; width: 4000px; }
    #sections ul li { height: 240px; width: 619px; border: 10px solid #27312F; margin: 0px; padding: 0px; float: left; }
    .prev { display: block; width: 42px; height: 98px; cursor: pointer; background-image: url(images/slide-button-left.png); position: absolute; top: 16px; z-index: 1; left: 18px; }
    .next { display: block; background-image: url(images/slide-button-right.png); width: 42px; height: 98px; cursor: pointer; position: absolute; top: 16px; left: 581px; z-index: 2; }
    .titles-featured a, .titles-featured a:hover, .titles-featured { font-size: 28px; line-height: 30px; }
    #featured { background-color: #FFF; background-image: url(images/post-bg.gif); background-repeat: repeat-x; padding: 10px; width: 593px; border: 1px solid #EBEBEB; margin-bottom: 10px; }
    .featured-content { float: right; width: 353px; margin-right: 5px; }

    /*————————————————*/
    /*——————–[FOOTER]——————–*/
    /*————————————————*/
    #footer { clear: both; width: 100%; height: 73px; text-align: center; color: #FFFFFF; padding-top: 14px; background-image: url(images/); background-repeat: no-repeat; ; background-color: #000000 ; background-position: center; margin: 0px; float: center; font-size: 8px; }
    #footer a { color: #FFFFFF; font-size: 8px; }
    #footer a:visited { color: #FFFFFF; }
    #footer a:hover { color: #FFFFFF; text-decoration: underline; }

    /*————————————————*/
    /*——————–[SEARCH]——————–*/
    /*————————————————*/
    .search_bg { height:35px; width:211px; float: right; margin-top: 6px; }
    #search { color:#FFFFFF; padding:0; }
    #search input { background: #FFF; font-size:11px; color:#4A4A4A; font-family:Tahoma, arial, verdana, courier; width:110px; height:18px; vertical-align:middle; padding:6px 10px 0px 10px; border-top: 1px solid #007B9E; border-left: 1px solid #007B9E; border-right: 1px solid #00B6E9; border-bottom: 1px solid #00B6E9; }
    #search .input { width:65px; height:28px; background:none; border:none; vertical-align:middle; margin:0; padding:0; margin-left: 8px; margin-right: 2px; }

    /*————————————————*/
    /*—————-[VIDEO INTEGRATION]————-*/
    /*————————————————*/
    /.home-post-wrap object { width: 289px; height: 193px; }
    /.home-post-wrap embed { width: 289px; height: 193px; }
    /.post-wrapper object { width: 609px; height: 455px; }
    /.post-wrapper embed { width: 609px; height: 455px; }

    .wp-pagenavi { margin-top: 10px !important; }
    a img.linkimage { border: 10px solid #333E3C; float: left; display: inline; margin-right: 10px; margin-top: 15px; }
    .single-entry a img { border: no

    Here is my home.php

    ?<?php get_header(); ?>

    <div id=”container”>
    <div id=”left-div”>
    <?php if (get_option(‘egamer_blog_style’) == ‘on’) { ?>
    <?php include(TEMPLATEPATH . ‘/includes/blogstylehome.php’); ?>
    <?php } else { include(TEMPLATEPATH . ‘/includes/default.php’); } ?>
    </div>
    <?php get_sidebar(); ?>
    <?php get_sidebar(‘right’); ?>
    <?php get_footer(); ?>
    </body>
    </html>
    </div>

    try to put the <?php get_sidebar('right'); ?> directly after the <div id="left-div">

    subject to fine-tuning; only tried in firefox with the web developer add-on; not tested in other browsers; not checked with any other page than the front page.

    well that kind of worked… but now the left bar is kind of in the wrong place, as is the main section

    well, i did not suggest to move the ‘get sidebar();’

    anyway, the possibilities of firefox developer add-on are limited by its way it is working; and the idea was to move ‘get sidebar(‘right’)’ from the spot where it was not working, to a different spot where it might possibly work.

    simply reverse the changes made so far.

    general other ideas:

    call sidebar first, floated left; then call left-div, floated left, width reduced; then call sidebar-right, floated right.

    call sidebar-right first, floated right; then call left-div, floated right, reduced width; then call sidebar, floated left.

    I moved the ‘get sidebar();’ after i tried the other and it did some other very interesting things.

    there is a closing div at the end of sidebar.php (probably also at then end of sidebar-right, if you copied it) that complicates things.

    as far as i can see, it was meant to be the closing div for #container, which worked ok while there was only one sidebar.
    i think it is neccessary that this closing div gets removed and moved into the code of home.php. (and all the other template files that may need to be edited)

    i tried it with the core code of home.php as:

    <?php get_header(); ?>

<div id="container">
<?php get_sidebar(); ?>
<div id="left-div">
<?php if (get_option('artsee_format') == 'Blog Style') { ?>
<?php include(TEMPLATEPATH . '/includes/blogstylehome.php'); ?>
<?php } else { include(TEMPLATEPATH . '/includes/default.php'); } ?>
</div>

<?php get_sidebar('right'); ?>
</div>
<?php get_footer(); ?>

    and these settings in style.css:

    #left-div {
width: 654px;
float: left;
padding-left: 13px;
}

#sidebar {
float: left;
padding-left: 0px;
padding-right: 0px;
width: 273px;
}

#sidebar-right {
float: right;
padding-left: 0px;
padding-right: 0px;
width: 273px;
}

    seems to work in a local installation with the downloaded theme.

    awesome, that last one worked great!

    thanks for your help, stupid ‘</div>’ tags lol…

    you are welcome;

    stupid ‘</div>’ tags

    sometimes programmers think different …

    oh i know, just spent most of last night and this morning trying to figure it out, got a little frustrated, plus side is i know where to find just about everything in this theme now

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Add second side bar’ is closed to new replies.

Tags