Make 2 Columns Dynamic Sidebar

Resolved Adi Azudin
(@adiazudin)

11 years, 1 month ago

Hi all,
A lot of things has been accomplished to my site to date.

This topic, I need help to make the widgets / new dynamic sidebars to appear side by side (2 columns). I did 3 “dynamic sidebars” before, as you can see Announcement and Agenda in home page, while Comment Policy appear in every single page after my post.

My sample page
My sidebars setup

My new dynamic sidebars:
a) Home 1 (Sidebar ID: home1)
b) Home 2 (Sidebar ID: home2)

Link to my site: blog.adiazudin.com

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

bdbrown
(@bdbrown)

11 years, 1 month ago

Hey Adi. Couldn’t you just drop them in index.php, just below the Agenda sidebar, and then maybe use a float:left and set the width using css?

Thread Starter Adi Azudin
(@adiazudin)

11 years, 1 month ago

The column not set using php? Let me try first.
Thread Starter Adi Azudin
(@adiazudin)

11 years, 1 month ago
Done setup, but it appears in 2 rows not 2 columns. I not sure how to set them in column style.
```
/* Home 1 */
/* ------------------------------------ */
.home1-title {
  width: auto;
  height: 40px;
  color: #fff;
  text-align: center;
  background-color: #d93d4c;
  box-shadow: 2px 2px 3px #888888;
  padding-top: 16px;
  margin-bottom: 30px;
}
.home1 {
  width: 50%
}

/* Home 2 */
/* ------------------------------------ */
.home2-title {
  width: auto;
  height: 40px;
  color: #fff;
  text-align: center;
  background-color: #d93d4c;
  box-shadow: 2px 2px 3px #888888;
  padding-top: 16px;
  margin-bottom: 30px;
}
.home2 {
  width: 50%
}
```
bdbrown
(@bdbrown)

11 years, 1 month ago
Give this a try:
```
.home1 {
  width: 49%;
  float: left;
}

.home2 {
  width: 49%;
  float: right;
}

.entri-terkini {
  width: 100%;
  float: left;
}
```
Thread Starter Adi Azudin
(@adiazudin)

11 years, 1 month ago

Allright, it’s done beautifully. So simple to setup, I think too much about how to make column style 😀

Thanks @bdbrown
bdbrown
(@bdbrown)

11 years, 1 month ago
Glad that worked. Here’s one other change you might consider. It will center-align the Recent Posts banner like the rest of the banners:
```
.entri-terkini p {
  text-align: center;
}
.entri-terkini:after {
  margin-left: 350px;
}
```
Thread Starter Adi Azudin
(@adiazudin)

11 years, 1 month ago

Thanks @bdbrown for suggestions.

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

The topic ‘Make 2 Columns Dynamic Sidebar’ is closed to new replies.

Tags