Did you try deleting the widget from the Secondary Widget Area?
If I delete widget it won’t show up at all. I need it to show up on ONE page, but not the others. Seems to be a glitch. Hope someone posts a work-around. Thanks
Well, I don’t think there’s an easy fix because there is just one template, the default one. I’m not sure why the widget didn’t show up on all of the other pages after it was installed, it should have. You can add some CSS to hide the sidebar on all pages except for the one page, that’s fairly easy to do. You will just have to install a Custom CSS plugin like Jetpack or Custom CSS Manager if you already haven’t done so. If you post a link to the page where you want the sidebar to show, I can give you some specific instructions. Otherwise, I can give some general instructions, but it will require you to do some inspection of your site.
Here is link to the ONLY page I want the sidebar widget to show up on: http://doyounu.com/sign-up/ I do not want it on any other pages. Instructions much appreciated. Thanks a mil!
I see you have Jetpack installed, so you want to first turn on the Custom CSS option by going to Jetpack → Settings and clicking the Appearance tab.
Once you turn on Custom CSS, go to Appearance → Edit CSS.
Copy & paste these lines at the end of the CSS Stylesheet Editor:
.site-main .sidebar-container {
display: none;
}
.page-id-297 .site-main .sidebar-container {
display: block;
}
The first rule will hide the sidebar on all pages by default. The second rule will display the sidebar on just the sign-up page, which has an ID of 297.
The snippets work except that the SPACE on the right hand side is still there… as if the sidebar was still there except invisible. Before, the page content was in the middle, not pushed to the left. Is there a way to correct this? Thanks so much for your help.
Yes, add these two additional rules to the end:
.sidebar .entry-header, .sidebar .entry-content,
.sidebar .entry-summary, .sidebar .entry-meta {
padding-right: 60px;
}
.page-id-297.sidebar .entry-header,
.page-id-297.sidebar .entry-content,
.page-id-297.sidebar .entry-summary,
.page-id-297.sidebar .entry-meta {
padding-right: 376px;
}
@media (max-width: 999px) {
.page-id-297.sidebar .entry-header,
.page-id-297.sidebar .entry-content,
.page-id-297.sidebar .entry-summary,
.page-id-297.sidebar .entry-meta {
padding-right: 0;
}
}
The first rule will eliminate the extra space that was there for the sidebar, the second rule will put it back in for the subscription page. The last rule is inside a media query that will remove the extra space for the sidebar on tablet widths. It has to be in there because the second rule will otherwise leave a lot of extra space when the width of the browser window shrinks under 1000px.
Well, again, the snippets work. Do you happen to have one last snippet that will CENTER the page titles? Thanks, again… I didn’t mean to cause you so much work!
I could probably find the way to do it in the main.css code, but seems it would be better to have it in with these snippets.
No worries, that’s why I’m here, to answer questions. And it’s a good idea not to make any changes to any of the theme’s files, like style.css. If you have to update the theme in the future, then those changes will be lost. It’s best to add CSS through a plugin, or by creating a child theme (but a child theme is a bit overkill for just making CSS changes).
.entry-title {
float: none;
display: table;
margin: 0 auto;
}
All fixed! Crouching Bruin… can’t thank you enough!!! btw… I was a UCLA Bruin… back in the day!
Hi Crouching Bruin, I found the below code for centering my Menu. I pasted it in with the other code you provided (above), but it doesn’t work. Can you please maybe take a look and see what’s wrong, or what else I might try? Thanks!
@media screen and (min-width: 981px) {
.menu {
text-align: center;
}
.menu li {
display: inline-block;
float: none;
margin-left: -5px;
}
.menu li li {
display: block;
text-align: left;
}
}
You can’t really take the CSS from another theme and expect it to work with the theme that you are using. Developers often use different class names for different elements. For example, in TwentyThirteen, the class menu isn’t used by any elements.
Use this instead:
@media screen and (min-width: 981px) {
ul.nav-menu {
display: table;
float: none;
margin: 0 auto;
}
}
Ah, didn’t think about different class names… Thanks again for your help!
The page text on this site spreads out too wide, and I can’t seem to change it based on the snippets provided. Could you possibly provide the code that would allow me to increase the size of the left and right margins of the body text so the text is not so wide? Thank you http://www.DoYouNU.com
