-
Search Results
-
I'm just getting my head wrapped around customizing child themes using hooks and actions, so please forgive me if there is an obvious solution for this problem. I tried searching but couldn't find anything in the forum or online.
I'm trying to add a responsive slider and featured page widgets as a custom home page to the Generate child theme. So far I have been able to get the slider on the page, but it is spreading across the entire browser width instead of just the 870x400 dimensions I have in the slider settings.
Two questions:
1.) How do I control the width of the slider? I'm assuming I need to adjust the width of the custom sidebar are (titled slider) somewhere, but I'm not sure where/how.2.) How do I repeat this process to create three featured page widgets beneath the slider?
Hi group... wondering about the easiest and cleanest way to remove the sidebar from POSTS only? I want to keep the sidebar on all pages, but need to remove it from all posts.
I suppose I can change my default page layout to full-width and go into each page and manually adjust it to show a right sidebar. But is there a way to universally make the change (in css) without having to manually update all pages this way?
Hi. I just built a Genesis site using Woo Commerce. I found that the 'Select options' buttons on the products are not responsive and break the layout when viewed on a mobile device. I have now decided to go with a min-width 960px and a max width 1152px design. I have managed to adjust the css to make this happen.
I then went to look at the site on a mobile phone. My iPhone does not scale to the view port. I can remember that there is a code or a bit of js that you add to the head of the site - but I don't recall how to do it. This bit of code then makes the whole website fit on the screen. At the moment it just shows me the top left hand corner of the site and I have to zoom out on every page to see the whole page on my phone.
Can anyone help? http://thestationeryline.xl-websites.com/
Thanks - Seb
[Resolved]Topic: Post Area Width Issue – Outreach
Hello,
I'm having a CSS issue which I'm sure is probably staring me in the face... 🙁
My site is located here - http://intunegp.com/
I want reduce the width of the 'image rotation / page post area' so it's stops level with the right hand edge of the search box.
The body class in the source code says
<body class="page page-id-25 page-template-default logged-in admin-bar no-customize-support custom-header header-image full-width-content outreach-red">I went into the CSS and I adjusted the following to 97%. It changed the rotator width on the landing page, but when I click on any of the other pages in the menu, the white area is still as wide as it was before. It only fixed it on the landing page.
How can I make the landing page rotator and all the other page post areas the same width?
/* Content ------------------------------------------------------------ */ .full-width-content #content, .full-width-content.outreach-landing #content { box-sizing: border-box; width: 97%; } .full-width-content.outreach #content { padding: 10px;Thanks in advance for any help... Jack 🙂
Look at line 649 of your style sheet. This code is overriding the padding on your home page:
.page-template-home-demo-php.full-width-content #inner, .archive.full-width-content #inner, .home.full-width-content #inner { padding: 0; width: 990px; }Either adjust the padding here, remove the .home.full-width-content #inner selector or delete this bit entirely.
In reply to: Corporate Homepage Slider
You could drag in the Genesis Responsive slider into the featured widget and remove the featured post widget.
Adjust the slider settings to the height and width you want.
Oh yeah sorry my mistake, the Responsive design is your page titles, to change this you have to edit page-title.php if i remember correctly.
Currently at the office at the moment will confirm this evening when I get home from work.
Stewart
WordPress Developer – Need help upgrading to Genesis 2.0? – My Blog
Follow me on TwitterHi
If you want just the content to be 700 pixels like the example you gave, open your style.css file and add the following to it:
#inner .wrap { margin: 0 auto; width: 700px }If you want the entire page including menus etc to be 700 pixels go to line 172 of your style.css and adjust the width of the .wrap
Hope this helps
WordPress Developer – Need help upgrading to Genesis 2.0? – My Blog
Follow me on TwitterIn reply to: Executive Theme widgets not appearing on home page
Hi Brad,
Forgive me - I am new to WordPress and unfamilar with hook positions. I am also a bit unfamilar with editing of the functions.php file. I have editted CSS files before and am somewhat familar with that language...
I am on a MAC, can you suggest a good code editor? Would I simply then post the above code in the functions.php file? And then when I place something in the Home Top Widget area it will span the entire width of the web frame? How can I adjust the padding to make the text margins line up with the rest of the page?
Sorry for all the questions - as I said I am learning as I go hear. Any help you can provide is much appreciated.
Thanks!
In reply to: Education theme– sidebar wider?
Hello,
You sidebar and content are limited to a width of 1140px by this css rule;
/* line ~539 */ #inner .wrap { margin: 0 auto; width: 1140px; }Your sidebar and content must share this 1140px. If you are going to increase your sidebar, you must take from your content (to keep the styling of the page). Lets say we make a 100px adjustment to the content and sidebar;
/* line ~757 */ #content-sidebar-wrap { -moz-border-radius: 5px; -moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15); -webkit-border-radius: 5px; -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15); background: #fff; border-radius: 5px; box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15); float: left; position: relative; width: 880px; /* subtracted 100px. Was 980px, now 880px */ z-index: 999; } /* line ~1384 */ #sidebar-alt { -webkit-border-radius: 5px; -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15); -moz-border-radius: 5px; -moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15); background: #254c67 url(images/bg-sidebar.jpg); border-radius: 5px; box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15); color: #aec6d7; float: left; font-size: 12px; margin: 15px -5px 15px 0; position: relative; text-shadow: none; text-shadow: #0d1a23 -1px -1px; width: 265px; /* added 100px. Was 165px, now 265px */ z-index: 0; }If you do make a change like this, please check your site thoroughly to make sure it did not affect anything else.
Here is a preview: https://www.diigo.com/item/image/40chg/imga
I hope this gives you a start.
In reply to: How to exclude iPads from mobile viewport code
Starting with the #content element. here is the css rule while the screen width is above 960px;
/* line ~946 */ .home.news.content-sidebar #content { padding: 0; width: 650px; }And the css rule after the screen width gets at or below 960px;
/* line ~2549 */ .archive-page, .content-sidebar #content, .content-sidebar #content-sidebar-wrap, .content-sidebar-sidebar #content, .content-sidebar-sidebar #content-sidebar-wrap, .footer-widgets-1, .footer-widgets-2, .footer-widgets-3, .full-width-content.news-landing #content, .full-width-content #content, .full-width-content #content-sidebar-wrap, .home-middle-left, .home-middle-right, .home.news.content-sidebar #content, .news-landing .wrap, .sidebar, .sidebar-content #content, .sidebar-content #content-sidebar-wrap, .sidebar-sidebar-content #content-sidebar-wrap, .sidebar-content-sidebar #content, .sidebar-sidebar-content #content, #content-sidebar-wrap, #footer, #header, #home-bottom, #home-middle, #home-top, #sidebar-alt { box-sizing: border-box; width: 100%; }After the 960px rule. the #content element will become full width, forcing the sidebar below it. Removing the width: 100% for the #content element will prevent the mobile layout, but now the site overlaps the screen. This is due to the #content and #sidebar elements having a specific pixel width.
If you already understand this, then I apologize for explaining something you already may know. It will take some adjusting to get this to look clean within this range. Using percentage widths would help.
In reply to: Associate theme homepage misaligned
Are you talking about the header area where the title is, or the slider? In the header area, since there are two words in your site title, it's making the title spill over onto two lines. You could adjust the width of that with CSS and it would fix that issue.
For the slider, it looks like you have the wrong slider installed. The Genesis Slider is different from the Genesis *Responsive* Slider, which is what you need. If you log in to your member area, you should find some theme documents for how to set up your site like the demo. Give a shout if these changes don't solve your problem!
Warmly,
Jeni
Blogging growth strategist & revenue coach at The Blog Maven, fearless leader of 3 preschoolers…tweeting it up @theblogmaven
I know I am missing something obvious, but I can't see to get this to work.
I am using the Corporate Theme. There are 3 "Home-Middle" Widgets after the Top Featured Widget. I'd like to add another 3 widgets below the 3 "Home-Middle" Widgets for a total of 6.
1. I've copied (and pasted) the code in the functions.php changing the 1,2,3 for 4,5,6 so that there are 6 registered widgets.
{Home Middle 1 through 6}2. I've added code to the home.php (again copy/paste/change - see above).
3. I've adjusted the style sheet for the additional widgets.
Then I add the featured pages and it goes all crazy.
I'm thinking it is my CSS?
Here's what I have
/* Home Middle
------------------------------------------------------------ */#home-middle {
background-color: #fff;
margin: 0 auto;
overflow: hidden;
padding: 0;
width: 960px;
}#home-middle .wrap {
overflow: hidden;
padding: 20px 25px 5px;
}#home-middle p {
padding: 0 0 15px;
}.home-middle-1 {
float: left;
padding: 0 27px 0 0;
width: 285px;
}.home-middle-2 {
float: left;
width: 285px;
}.home-middle-3 {
float: right;
width: 285px;
}.home-middle-4 {
float: left;
padding: 0 27px 0 0;
width: 285px;
}.home-middle-5 {
float: left;width: 285px;
}.home-middle-6 {
float: right;
width: 285px;}
Hmm, any help would be appreciated. I'm trying to line Home Middle 4 Under Home Middle1. Home Middle 5 Under Home Middle 2, and Home Middle 6 under Home Middle 3.
Hello. I'm not finding info on how to make adjustments to the sidebars - the width specifically
Most pages layout with one right sidebar. Now I want to have a second right sidebar on the home and blog page. When I change the layout (on my experiment page), I see that the primary sidebar moves to the left and the second sidebar comes in on the far right. It is also more narrow. This looks quite odd!
How do I:
a) make both sidebars the same width?
AND
b) switch the position of the primary and secondary sidebar?
Thanks,
Melanie
Congrats on your progress, and you're welcome.
Here are some general tips on fitting on 1 line: 1) check the width of your form, the width of your text input area, and the width of your button. If the text input area + the button width are greater than the width of your form, one line isn't going to work until you change something. 2) Once you get the widths right, an easy solution is often to use floats (such as float the text input left and float the button right). With respect to your guess on inline-block, it's always a good idea to hover over an element (and sometimes that can mean its parent) using Firebug to see its width. If it's too wide, your simple change won't work.
With that in mind, you need to make these CSS changes:
/* given the way the form is already set up, this is the easiest method for 1 line */
#af-form-574040688 .af-standards .af-element {
float: left;
padding-top: 0;
padding-bottom: 0;
}/* this change is to adjust the height of the text input so it matches the height of the button */
.af-body input.text {
padding: 5px !important;
}Note that Aweber is already outputting an important declaration for .af-body input.text, so I can't say for sure that will work, but it's a good guess.
Good luck.
Web: https://wpperform.com or Twitter: @wpperform
We do managed WordPress hosting.
In reply to: Adjusting the width of a post / page?
OK, this newbie figured it out, instead of cutting and pasting, I went thru and swapped out the numbers inside the CSS. All negative side effects removed and working as desired.
A walk in the park for you seasoned pros, but for a guy who never saw code before a few weeks ago, I feel like a just climbed Mount Everest 🙂
My main post and pages are set at a default of 575 pixels and I would like to resize them to 675 pixels.
I used this code:
.content-sidebar #content, .sidebar-content #content {
width: 675px;.pin_it-landing #content-sidebar-wrap, .content-sidebar #content-sidebar-wrap, .full-width-content #content-sidebar-wrap, .page-template-page_archive-php #content-sidebar-wrap, .sidebar-content #content-sidebar-wrap {
width: 950px;
}The problem is that it also fixed my grid view to that size as well AND it no longer allows my post to resize if I shrink the browser window which also affects how the post is viewed on mobile devices.
Any Thoughts?
In reply to: Adjusting margin on images on a page
You can do it by changing the content padding to something like this
#content {float: left;
padding: 30px 0 0;
width: 800px;But then your text will also run out to the edges which I don't think you want.
Someone else more technical than I may have a better suggestion.
If you aren’t having fun you are doing it wrong
In reply to: Outreach in Firefox – Slider picture
Hi,
A nice little brain-teaser that was hard to find. But I believe it's this. Firefox seems to be looking at the setting below, and including the padding. Apparently the other browsers don't..full-width-content #content, .full-width-content.outreach-landing #content { width: 100%; }Of course, this can be found in style.css, via Appearance.... Editor.
I found that 2 width settings instead of "100%" worked: "auto" or "98%". Try those, and adjust to taste. Both seem good in Chrome, too. Definitely test the other browsers. Also set up a full-width regular page and see if that's still good. If not, you'll want to make a separate statement for full-width content, as opposed to full-width landing page.
Cheers, Dave
Dave Chu · Custom WordPress Developer – likes collaborating with Designers
Welcome!
These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.