Home page block css

Hello,

I have a custom html block on my home page.  How can I have this block have custom css so it looks different than the other page blocks.  I am looking to remove the white background for this block (it will contain images, so I would rather have the background be the main site background.

Any pointers on how to tackle this would be helpful.

You can do this by changing its designbox.

Indeed. But you know he will want to know how exactly to do that don't you.

Deano, he just wants to run up his post count.  I remember you writing this up for 6.1.  Did you do it for D7 as well?

I don't follow my post count. That said, I had to run when I made that post, so the information was lacking. For more information on design boxes, follow this link: http://www.boonex.com/unity/forums/topic/Blocks-without-titles-.htm.

RE:

In case you ever want to, its right next to your name on every post.

I never noticed that. Thanks!

I appreciate the advice.  I do know how to change the Designbox.  Is the next step to having custom CSS for that designbox type then having a new row in the bx_profile_custom_units table and then finally putting the proper css in the stylesheet?

Thanks again for the help.

I did have a write up on how to do this for 6.1. Never did one for 7.0. The process is similar and easier then D6.

first in templates/base/ make a copy of designbox_1.html and name it designbox_4.html

Edit designbox_4.html and rename the css class names so they look like this.

<div class="disignBoxFirst4">
<div class="boxFirstHeader4"><div class="dbTitle4">__title__</div>__caption_item__</div>
<div class="boxContent4">__designbox_content__</div>
__bottom_item__
</div>

save the file and upload to your server.

That creates a new design box to use. Now you need to add css for it so you can change its colors.

now edit templates/base/css/general.css and add this to the bottom.

.disignBoxFirst4 {
position:relative;
border:1px solid #0D3966;
margin-bottom:10px;
background-image:url('../images/head_cutting.gif');
background-repeat:repeat-x;
background-color:#000000;
}
.boxFirstHeader4 {
height:17px;
padding:3px 0px 0px 8px;
font-size:12px;
font-weight:bold;
color:#FFF;
text-align:left;
border-bottom: 1px solid #0D3966;
}
.boxFirstHeader4 a,  .boxFirstHeader4 a:link,  .boxFirstHeader4 a:active,  .boxFirstHeader4 a:visited {
text-decoration: none;
color: #FFF;
}
.boxFirstHeader4 a:hover {
text-decoration: underline;
color: #FFF;
}
.boxContent4 {
overflow:hidden;
font-size:13px;
padding:10px;
}

.disignBoxFirst4 .boxFirstHeader4 .dbTitle4 {
position: relative;
float: left;
}


Now all you need to do is edit the database table sys_page_compose, find the page block you want to change and change the designbox field from 1 to 3

Now you need to clear the cache, or remove the file sys_page_compose.inc from the cache directory so dolphin rebuilds the page cache.


I don't know where you saw this bx_profile_custom_units table info, but it has nothing to do with it, so don't touch it. I believe that table stores info for members profile customization. It has nothing to do with site design boxes.

The instructions worked well with one edit.  Instead of changing the designbox to 3, it worked as planned when changing it to 4.

I greatly appreciate the help.

Yes, i see my typo.

Now all you need to do is edit the database table sys_page_compose, find the page block you want to change and change the designbox field from 1 to 3

It is supposed to say this.

Now all you need to do is edit the database table sys_page_compose, find the page block you want to change and change the designbox field from 1 to 4


But because boonex decided to put a time limit on editing posts, i can't go back and fix it.