Trying to add horizontal opt-in box in welcome widget wide – need help!

There are a lo of steps to take to create a widget area….it may be easier to just edit the one you have it in.

In order to fix the image issue, you would have to add the image in so I can see it in action and know where the issue is.

Take a look around line 2167 in your css for this –

input, 
select, 
textarea {
    background-color: #FFFFFF;
    border: 1px solid #DDDDDD;
    padding: 0.3125rem 0.625rem;
    width: 100%;
}

and remove the width.

The background can be changed on line 3365 –

.epik-orange #head-wrap, 
.epik-orange #welcome, 
.epik-orange #home-feature-bg-dark, 
.epik-orange .author-box, 
.epik-orange .footer-widgets {
    background: none repeat scroll 0 0 #C37A1C;
    color: #F0F0F0;
}

But you’ll need to separate the #welcome part of the code and change the color so the other parts aren’t affected.

Here’s what I mean by separate –

.epik-orange #welcome {
    background: #fff;
}

The height you’re looking at is actually from the content inside the widget…and the padding on top and bottom. You can adjust the padding by looking around line 1197 –

#welcome .wrap {
    margin: 0 auto;
    overflow: hidden;
    padding: 40px 0 0;
    width: 1152px;
}

Yes take a look at the code in your home.php file and separate the code (using html as it appears in the widgets)…then make the changes to those ID’s or Classes in your css file.

Yes the php code is the actual widget shortcut code, and you can see the “echoed” code is what adds the html divs.

For example, these 2 divs wrap around the entire welcome area –

echo '<div id="welcome"><div class="wrap">';

and it is closed out at the bottom of the code –

echo '</div><!-- end .welcome-features --></div><!-- end .wrap --></div><!-- end #welcome -->';

You can also reference the source code of your homepage to look at how the code shows up from the home.php file above. Whatever you change on the home.php file above will be displayed on your actual homepage of the site. So you can move the divs around to however you would want them to be displayed. You can also add or remove divs by using the “echo” code above as well.