Community Forums › Forums › Archived Forums › General Discussion › new box for widget
- This topic has 7 replies, 2 voices, and was last updated 10 years ago by Lauren @ OnceCoupled.
-
AuthorPosts
-
April 14, 2014 at 6:22 am #100161karlhenMember
I have the agency theme and I've added two widgets (home-left2 and home-right2) on the home page. However, i'm unable to put the new widgets in a seperate box than the home-left, home-middle, and home-right.
Can you assist? Thank you.
http://poimena.comApril 14, 2014 at 6:53 am #100168Lauren @ OnceCoupledMemberThe hook you're using is putting it inside the entry-content. Try using the hook "genesis_after_content" instead, or "genesis_after_content". You'll probably need to do additional styles at that time.
We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com
April 14, 2014 at 7:28 am #100171karlhenMemberHello, I'm sorry I don't understand. I didn't place any code in the genesis simple hooks. I added followed the tutorial at http://wpsites.net/web-design/adding-duplicating-home-page-widgets-genesis/
Thanks
April 14, 2014 at 1:46 pm #100265Lauren @ OnceCoupledMemberI see. In that case, I would just make a few adjustments:
Remove the background from the home page div in question using:
.home #inner { background-color: transparent; }
In my home file, I would wrap my home-left2 and home-right2 in another div with ID home2.
Then I would add this style:
#home, #home2 { -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 2px #999; -webkit-box-shadow: 0 1px 2px #999; background-color: #fff; border-radius: 5px; box-shadow: 0 1px 2px #999; margin: 20px auto 0; }
We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com
April 14, 2014 at 7:10 pm #100324karlhenMemberSo close; however, the #home and #home 2 are truncated on the left and right. Not sure why that is?
April 15, 2014 at 7:30 am #100374Lauren @ OnceCoupledMemberAdd "padding: 0;" to your #inner block, then add that padding back inside your #home blocks.
We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com
April 15, 2014 at 10:06 am #100492karlhenMemberLauren you have been great ... and I thank you for your patience.
However, I need for you to be a more specific, please. Where should the padding: 0; be placed with the #inner block and #home blocks?
Thank you.
April 15, 2014 at 11:45 am #100532Lauren @ OnceCoupledMemberHere you go Karlyn:
.home #inner { background-color: transparent; -moz-box-shadow: initial; -webkit-box-shadow: initial; box-shadow: initial; } .home #inner .wrap { padding: 0; }
#home, #home2 { -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 2px #999; -webkit-box-shadow: 0 1px 2px #999; background-color: #fff; border-radius: 5px; box-shadow: 0 1px 2px #999; margin: 20px auto 0; padding: 25px 30px; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ }
We create mobile-first, PageSpeed-optimized, pixel-perfect custom themes! https://www.oncecoupled.com
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.