Community Forums › Forums › Archived Forums › Design Tips and Tricks › Create Full Width Rows in Widgets and Pages
Tagged: full width
- This topic has 5 replies, 2 voices, and was last updated 7 years, 6 months ago by Durandy.
-
AuthorPosts
-
September 19, 2016 at 10:23 am #193368DurandyMember
Hello Studiopress Community,
I have searched around for an answer and cannot come up with any solution. What I am trying to do is make a clean personal resume webpage that has all content on one page (front page). I know with Studiopress themes you are provided with Front Page widgets (1-3). The only way I can currently figure to get around the forced layout of multiple widgets rearranging in Studiopress' predesignated fashion is by using something such as Site Origin page builder to construct my own layout within a widget. If for example I add 2 text widgets to the Front Page widget 2 box they are automatically placed side by side when I would like them to be one on top of the other. I am trying to make it so I can create multiple rows on the home page that are all full width (stretched completely to both edges with no spaces). If you go to my website adamdurand.com and look at the section "My Brand", or "My Team" you will see that the black backgrounds stop short of the sides. How can I set it up to model after garysheng.com where all of my content is centered and if I add a colored background it stretches across the entire screen with no gaps. I would also like to note that I am not very code savvy so a detailed, step by step instruction, response would greatly help me to learn this process. I am using the Digital Pro Theme. Looking forward to seeing your response!
http://Adamdurand.comSeptember 19, 2016 at 1:56 pm #193385emasaiParticipantUnless you are comfortable tinkering with functions.php and style.css I am not sure page builders will fit your bill.
Here is a tutorial on how to add full width fluid divs.
Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.comSeptember 19, 2016 at 2:51 pm #193389DurandyMemberThank you for your response. I don't necessarily need/want to use a page builder I am just unaware of what my options would be for adding content in the way I described. If I add multiple widgets to a "front page 2" tab they have a pre-set way of being placed onto the page. I am fairly comfortable tinkering with style.css as long as I'm walked through it.
September 19, 2016 at 4:04 pm #193390DurandyMemberWithout using a page builder how can I create another widget text area with a different color background? Is there a way to override the automatic way the Digital Pro theme lays out widgets?
September 19, 2016 at 4:16 pm #193392emasaiParticipantDid you see the tutorial link I sent you?
http://wpbeaches.com/creating-full-width-fluid-divs-genesis-theme-saleslanding-page/
Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.comSeptember 19, 2016 at 4:42 pm #193395DurandyMemberI did read your link but sadly I don't seem to be able to figure it out : / I really need someone to ELI5 it to me.
Modifying things like this seem to have no effect.
.site-inner {
background-color: #fff;
clear: both;
margin: 90px auto 0;
padding: 10% 40px;
max-width: 1280px;
I'm trying to 1. Add a new row to a widget, 2. set the background of it to let's say black, 3. make it full width stretched across the screen, 4. add my text or pictures. As of right now the only way I personally know to add rows like this are through a page builder (SiteOrigin). Sorry if I'm frustrating you. -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.