Ask Giúp mình chỉnh sửa Sidebar trong Theme WP với...?

newbievnx · Apr 6, 2013

Dưới đây là file sidebar.php,có 3 Box-1,Box-2,Box-3

Nhưng trong theme thì cả 3 box này đều nằm trên 1 cột...Giờ mình muốn chỉnh sửa 3 box này nằm trên 3 cột...Mong các bác giúp đỡ mình với. Cảm ơn các bác nhiều.

PHP:

<div class="sidebar">
	<form method="get" id="searchform" action="<?php bloginfo('url'); ?>/">
	<div>
    	<input type="text" value="<?php the_search_query(); ?>" name="s" id="s" /><input type="image" src="<?php bloginfo('template_url'); ?>/images/search-button.jpg" id="searchsubmit" value="Search" />
	</div>
	</form>

<?php if (function_exists('dynamic_sidebar')&&dynamic_sidebar('Box-1')):else: ?>
	<div class="box1">
		<div class="box1text">
		<ul>
			<?php wp_list_categories('show_count=0&title_li=<h2>Categories</h2>'); ?>
		</ul>
		</div> <!-- BOX1 TEXT -->
	</div> <!-- BOX1 -->
<?php endif; ?> 

<?php if (function_exists('dynamic_sidebar')&&dynamic_sidebar('Box-2')):else: ?>
	<div class="box2">
		<div class="box2text">
		<ul>
			<li><h2>Archives</h2>
				<ul>
				<?php wp_get_archives('type=monthly'); ?>
				</ul>
			</li>
		</ul>
		</div> <!-- BOX2 TEXT -->
	</div> <!-- BOX2 -->
<?php endif; ?> 

<?php if (function_exists('dynamic_sidebar')&&dynamic_sidebar('Box-3')):else: ?>
	<div class="box3">
		<div class="box3text">
		<ul>
			<?php wp_list_bookmarks(); ?>
		</ul>
		</div> <!-- BOX3 TEXT -->
	</div> <!-- BOX3 -->
<?php endif; ?>





</div> <!-- SIDEBAR -->

theocean · Apr 6, 2013

không chỉ cần sửa class="box1" hay box2....
Bạn cần phải sửa cả CSS nữa nhé.

newbievnx · Apr 6, 2013

theocean said:
không chỉ cần sửa class="box1" hay box2....
Bạn cần phải sửa cả CSS nữa nhé.

css đây ... bác giúp mình với :binhsua07:

PHP:

* { margin: 0px; border: 0px; padding: 0px; }

.all {
padding-top: 20px;
width: 760px;
margin: 0 auto;
}

/* HEADER */
.header h1 a{
text-decoration: none;
font-family: "Trebuchet MS";
font-size:25px;
margin-top: 5px; margin-bottom: 0px;
text-align: left;
font-weight: normal;
color: #6B3109;
}
.header h2{
font-family: "Trebuchet MS", Tahoma;
font-size: 12px;
font-weight: lighter;
font-variant: normal;
color: #C1AB45;
margin-top: 10px;
letter-spacing: 0.2em
}


/* HORIZONTAL MENU */
.menu1 {
margin-top: 10px;
margin-bottom: 10px;
float: right;
text-align: right;
background: transparent url(images/img_04.jpg) right top no-repeat;
padding-right: 6px;
}
.menu2 {
padding-left: 6px;
height: 24px;
float: right;
text-align: right;
background: #9B6B3A url(images/img_03.jpg) left top no-repeat;
}

.menu1 li{
padding-top: 0px;
padding-bottom: 0px;
list-style: none;
display: inline;
}
.menu1 li a{
display: block;
float: left;
padding: 1px 6px;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size: 15px;
color: #fff;
text-transform: capitalize;
text-decoration: none;
font-weight: bold;
height: 22px;
}
.menu1 li a:hover{
background-color: #CC8035;
}

.current_page_item a {
background-color: #CC8035;
}

/* CONTENT */
.content {
margin-top: 10px;
float: left;
width: 524px;
background: url(images/img_10.jpg) center repeat-y;
}
.contenttext {
padding-left: 17px;
padding-right: 17px;
}

/* POST */
		/* POST HEADER*/
.postheader {
margin-top: 10px;
}

.postdate {
padding-bottom: 10px;
background: transparent url(images/img_16.jpg) left top no-repeat;
height: 37px;
width: 39px;
text-align: left;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #B4936A;
float: left;
margin-right: 4px;
}
.postday {
padding-top: 3px;
width: 29px;
text-align: center;
}
.postmonth {
padding-top: 4px;
width: 29px;
text-align: center;
}

.posttitle h3 a{
text-decoration: none;
width: 445px;
display: block;
float: left;
color: #8D6649;
font-family: "Trebuchet MS";
font-size: 19px;
font-weight: normal;
font-variant: normal;
}

.postmeta {
width: 445px;
display: block;
float: left;
}

.postauthor {
height: 26px;
background: transparent url(images/img_19.jpg) left center no-repeat;
padding-left: 15px;
padding-top: 4px;
margin-right: 20px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #B57A42;
float: left;
}

.postcategory{
height: 26px;
float: left;
padding-left: 15px;
padding-top: 4px;
background: transparent url(images/img_21.jpg) left center no-repeat;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #979795;
font-size: 10px;
}
.postmeta a{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
text-decoration: underline;
color: #B57A42;
}
.postmeta a:hover{
text-decoration: none;
}


		/* POST TEXT */
.posttext {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 16px;
color: #414449;
}

.posttext img {
padding: 1px;
border: 1px #FAE0C5 solid;
margin: 0px 5px 5px 0px;
}

.posttext blockquote {
padding: 5px 5px 5px 40px; background: #F1FAFF url(images/img_28.jpg) top left no-repeat; margin: 5px 0px; color:#1F89C7; border: dashed 1px #D8ECF7;}
.posttext blockquote p { font-size: 11px; padding: 5px 0px; margin: 5px 0px; line-height: 15px; }

		/* POST FOOTER */
.postfooter {
margin-top: 15px;
margin-bottom: 30px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
height: 32px;
background: #FCF2C1 url(images/img_30.jpg) left top no-repeat;
display: table;
#position: relative;
width: 490px;
overflow: hidden;
height: 32px;
}

.postfooter2 {
background: url(images/img_31.jpg) right top no-repeat;
}

.postcomments {
margin-top: 9px;
margin-left: 6px;
background: transparent url(images/img_36.jpg) left center no-repeat;
height: 20px;
padding-left: 18px;
color: #6A330C;
float: left;
}

.posttags {
margin-left: 20px;
background: url(images/img_42.jpg) left center no-repeat;
height: 20px;
padding-left: 18px;
color: #9B9796;
width: 290px;
#position: absolute;
#top: 50%;
display: table-cell;
vertical-align: middle;
}
.posttags2 {
#position: relative;
#top: -50%;
}
.postfooter a{
text-decoration: none;
color: #6A330C;
}
.postfooter a:hover{
text-decoration: underline;
}

.postnr {
width: 50px;
height: 31px;
background: #F7E382 url(images/img_33.jpg) right top no-repeat;
float: right;
text-align: center;
padding-top: 1px;
}
.postnrtext {
width: 30px;
padding-left: 10px;
padding-top: 4px;
margin-left: 7px;
margin-top: 4px;
background: transparent url(images/img_39.jpg) left center no-repeat;
height: 20px;
color: #6A330C;
}

.post p {
padding-bottom: 15px;
}
.posttext a {
color: #9A6A3A;
}
.post ul, .post ol {
padding-left: 25px;
}

h3.single_h3 {
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size: 17px;
color: #9A6A3A;
text-align: center;
margin: 0;
}



/* SIDEBAR */
.sidebar {
margin-top: 16px;
float: right;
width: 223px;
color: #9A6A3A;
}

.box1 {
width: 223px;
background: #FAEFB9 url(images/img_13.jpg) center top no-repeat;
margin-bottom: 15px;
}

.box2 {
width: 223px;
background: #F7B9BA url(images/img_29.jpg) center top no-repeat;
margin-bottom: 15px;
}


.box3 {
width: 223px;
background: #F8D7B6 url(images/img_52.jpg) center top no-repeat;
margin-bottom: 15px;
}

.box1text, .box2text, .box3text {
min-height: 120px;
padding: 12px;
}
.box1text {
padding-bottom: 20px;
background: url(images/img_27.jpg) bottom no-repeat;
}
.box2text {
padding-bottom: 20px;
background: url(images/img_50.jpg) bottom no-repeat;
}
.box3text {
padding-bottom: 20px;
background: url(images/img_54.jpg) bottom no-repeat;
}


.sidebar li{
list-style: none;
}

.sidebar h2{
font-size: 18px;
font-weight: normal;
color: #A37C43;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}
.sidebar .box2 h2, .sidebar .box3 h2{
color: #95513A
}
.sidebar li a{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-decoration: none;
color: #6A330A;
text-transform: capitalize;
padding: 3px 6px;
}
.sidebar ul li ul{
padding-left: 10px;
}

.sidebar .box1 li a:hover{
background-color: #F5DF72;
}
.sidebar .box2 li a:hover{
background-color: #F17575;
}
.sidebar .box3 li a:hover{
background-color: #F2AF6B;
}


.postfooter2 h3 {
text-align: center;
color: #9A6A3A;
height: 27px;
font-size: 15px;
padding-top: 5px;
}

.footer {
margin-top: 10px;
background: #f7e382 url(images/footer-left.jpg) left top no-repeat;ht
}
.footertext {
color: #9D6B3A;
padding: 5px 0;
text-align: left;
padding-left: 15px;
font-size:11px;
font-family: Verdana, Arial, Helvetica, sans-serif;
background: url(images/footer-right.jpg) right top no-repeat;
}

.footer a{
color: #9D6B3A;
text-decoration: underline;
}

a.design{
margin: 9px 10px 0 0;
display: block;
width: 84px;
height: 20px;
background: url(images/designed-by.jpg) top center no-repeat;
text-decoration: none;
float: right;
}
a.design span{ display: none; }


/************** COMMENTS DESIGN **************/
ol.commentlist {
	margin:0;
	padding:0;
	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	}

.commentlist li {
	list-style:none;
	margin-bottom:14px;
	}

.commentlist cite {
	padding: 7px;
	display:block;
	font-style:normal;
	color:#fff;
	}	

.cite2 {
	background-color: #F2AF6B;
	font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
}

.commentlist a:link, .commentlist a:visited {
	color:#FFF;
	text-decoration: underline;
	}

.commentlist cite img {
	border:3px solid #fff;
	float:left;
	margin-right:9px;
	}

.commentlist .author {
	font-weight: bold;
	text-decoration: none;
	color: #FFFFFF;
	}

.time {
	background: url(images/time.png) no-repeat 1px;
	padding-left:20px;
	color: #FFFFFF;
	}

.commenttext {
	border:1px solid #F2AF6B;
	color:#0f7eb3;
	}

.commenttext2 {
	padding: 0 20px 0px 20px;
	background: url(img/comm/bottom-left.jpg) bottom left no-repeat;
	font-size: 13px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#comments, #respond {
text-align: center;
color: #0c587c;
margin-bottom: 10px;
font-size: 20px;
}

.commenttext2 p{
padding: 10px 0;
}

.comm {
background-color: #FCF2C1;
font-size: 16px;
padding: 10px;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

.comm a{
color: #9A6A3A;
}

.comm textarea{
border: 1px #9A6A3A solid;
padding: 5px;
color: #333333;
}
.comm input{
border: 1px #9A6A3A solid;
padding: 3px 5px;
color: #333333;
}

#submit {
background-color: #9A6A3A;
color: #FFFFFF;
border: 1px #FFFFFF solid;
padding: 3px 6px;
cursor: pointer;
font-weight: bold;
}
#submit:hover {
background-color: #FFFFFF;
color: #9A6A3A;
border: 1px #9A6A3A solid;
padding: 3px 6px;
cursor: pointer;
}

.alignleft {
float: left;
}

.alignright {
float: right;
}

.navigation a {
text-decoration: none;
display: block;
width: 86px;
height: 21px;
text-align: center;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #95513A;
font-weight:bold;
padding-top: 3px;
background: url(images/nav-bg.jpg) top center no-repeat;
}

.navigation a:hover {
background: url(images/nav-bg-hover.jpg) top center no-repeat;
}


.notfound {
background-color: #F27676;
padding: 30px 20px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.notfound h2{
font-size: 20px;
}
.notfound p{
font-size: 15px;
}

.notfound input{
margin-top: 30px;
}

.notfound #s {
padding: 2px 5px;
width: 200px;
}

.notfound #searchsubmit {
color: #A37C43;
font-weight: bold;
border: 1px #FFFFFF solid;
background-color: #F5DF72;
}

#searchform {
padding-bottom: 10px;
}

.sidebar #s {
background: #f7e382 url(images/search-bg.jpg) left top no-repeat;
height: 22px;
margin-top: 0px;
vertical-align: top;
width: 167px;
color: #9A6A3A;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
font-size: 14px;
padding: 4px 10px 0px 10px;
}




.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.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-dd {
	font-size: 11px;
	line-height: 17px;
	padding: 0 4px 5px;
	margin: 0;
}

newbievnx · Apr 7, 2013

Ai help mình với .................

(

silverammo · Apr 7, 2013

Bác này nói chuyện buồn cười vãi, không có theme mà cài localhost test thì sửa sao biết đúng sai vừa vặn được. Có phải vất mỗi cái CSS với sidebar.php lên đây là được đâu, web bác có mỗi cái sidebar.php à

)

Ask Giúp mình chỉnh sửa Sidebar trong Theme WP với...?

newbievnx

Senior

theocean

Junior

newbievnx

Senior

newbievnx

Senior

silverammo

Junior

Announcements

Richest Users

Most MR

Today's birthdays

Forum statistics

Most viewed of week

Most discussed of week

Most viewed of week

Most discussed of week

About us

Quick navigation