Forum Replies Created
-
Posts
-
You can use the home class to specify the menu width change for the home page:
.home .nav-primary { width: 780px; margin: 0 auto; }I've added the margin CSS in case you want the nav centered inside the container. There are other CSS adjustments you'll need to make so that the nav items don't fall to a second line.
But, Jeff, 780px is not the width of the slideshows. As I see them, there are 3 columns, with a site container width of 1140px.
Anne S. Katzeff
Designer | Artist | TeacherAt the bottom of the screen for each post, there is an block called "Excerpt". You can insert text and code into that area.
View the post code via the "Text" tab (vs. the "Visual" tab). Copy whatever portion you want, then past it into the excerpt area.
Return back to the widget area, where it sounds like you're using the Featured Posts widget. Adjust the settings like this:
Content Type: Show Excerpt Limit content to 300 characters More Text (if applicable): [Read More}You can change the content limit and "More Text" to whatever you like best.
Anne S. Katzeff
Designer | Artist | TeacherIt starts to get cut off below 480px browser width.
One solution is to make a duplicate logo that is scaled smaller to fit the smaller browser widths. Give it an identifying name, like "logo-small.png". Then, use use media queries to make the adjustments. You might also need to adjust the min-height. I've left it at 150px here:
/* --- iPhones (portrait) --- */ @media only screen and (max-width: 320px) { .header-image .site-title > a { background: url("images/logo-small.png") no-repeat scroll left center rgba(0, 0, 0, 0); float: left; min-height: 150px; width: 100%; } }
Anne S. Katzeff
Designer | Artist | TeacherHi Josephine,
I see the full width image. It looks like you figured it out?
Anne S. Katzeff
Designer | Artist | TeacherSorry, but your primary nav disappears when viewed on mobile devices. The responsive menu appears, but doesn't reveal the nav. Both of your sidebars disappear, too.
Anne S. Katzeff
Designer | Artist | TeacherYes, there are probably further adjustments you'd want to make; add them to the media section of the stylesheet.
Anne S. Katzeff
Designer | Artist | TeacherHi,
I use it on a client site:
http://www.americancenturymusic.org/
Anne S. Katzeff
Designer | Artist | TeacherHi,
Your left sidebar is actually the header in this theme. So, simply remove the white background color from it, like this:.site-header { background-color: transparent; }If you only want the white background removed from the home page header, adjust the CSS like this:
.home .site-header { background-color: transparent; }(Be sure there's a space between .home and .site-header)
I'm not sure how you got the custom background on the site. I would adjust the CSS to include ".home" in front of the background declaration. That would force the image to appear only on the home page.
Anne S. Katzeff
Designer | Artist | TeacherHi,
Add a maximum width rule to the appropriate media query CSS, like this:.header-image .site-title a {
width: 400px;
max-width: 280px;
}Hope this helps!
Anne S. Katzeff
Designer | Artist | TeacherHi again,
Everything looks ok on the iPhone. So, I'm guessing you figured out the CSS modifications?
Anne S. Katzeff
Designer | Artist | TeacherHi,
It all looks good to me when viewed on an iPad and iPhone. Did you figure out the CSS modifications?
Anne S. Katzeff
Designer | Artist | TeacherHi,
You can upload the background in 2 ways:
(1) In the Admin. left sidebar, go to APPEARANCE > BACKGROUND
or
(2) Upload the background image to your media library. Then, change the CSS accordingly. Something like:body {
background: url("http://http://www.foodtervention.com//wp-content/uploads/YOURFILENAMEbody-bg.png") repeat-x scroll 0 0 #99cc99;
}Hope this helps.
Anne S. Katzeff
Designer | Artist | TeacherHi,
I'm not sure I understand what you are intending to do style-wise. Right now, the active page primary menu item background is red. When you hover over the menu, the submenu items also have a red background. So, if you want everything to appear on a white background, how do you want to style the active and hover states?
Anne S. Katzeff
Designer | Artist | TeacherHi,
The default width is 1200px. So, you need to reduce the width by 200px. Here are some CSS changes you need to make:.before-header {
max-width: 1000px;
}.site-container {
max-width: 1000px;
padding-left: 10px;
padding-right: 10px;
}.sidebar-primary {
width: 220px;
}Bye for now!
Anne S. Katzeff
Designer | Artist | TeacherHi,
A few things you need to do that will get you started in the right direction:
(1) Your header image can be a JPG, rather than a PNG. The JPG will be a bit smaller. You only need PNGs when the image has transparency.(2) The header image size often needs to be changed in the functions.php file. This size will become the baseline that the responsive media queries resize from.
(3) Be sure that the header image does NOT repeat. This can be done on the custom header page and/or in the CSS.
In the CSS, you need to change the background to NOT repeat and perhaps adjust the height declarations:.site-header .wrap {
background: url("http://www.thepeacetribe.com/wp-content/uploads/2014/11/The-peace-tribe-web-banner.png") no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0) !important;
height: auto;
min-height: 174px;
}(4) Check the media queries padding for the Site header:
.site-header {
padding: 0;
}Beyond this, you might need to change some margins and paddings. Good luck!
Anne S. Katzeff
Designer | Artist | TeacherIt looks like there are some plug-ins that may be interfering with the correct rendering. Have you tried disabling all plug-ins to see if things get back to normal? Then, try activating them one by one to see which is the problem.
Another thing is that I don't see the theme structure on the live site like I do on the test site! All I see is a bunch of scripts. So, maybe you need to re-install WordPress after cleaning out the files via ftp.
See what other folks might think... Good luck!
Anne S. Katzeff
Designer | Artist | Teacher
