Forum Replies Created
-
AuthorPosts
-
Tony @ AlphaBlossomMember
Hello,
You can set .genesis-nav-menu li to "float: none;" and .genesis-nav-menu.menu-primary to "text-align: center;"
That should do it for you.
Have a good night!
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberI would remove #header .widget-area from that grouping, and add it on it's own:
#header .widget-area {
width: 728px;
}
You can change the width, add any padding, margin etc also. If your site is responsive, you can use % but you'll have to figure something out as things get smaller.
Also, you have to adjust #title-area (around line 471). I would do the same, remove it and add it to it's own line and adjust the width so that they'll both fit.
That should do it!
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberHi there,
You can set:
#nav > .wrap {
width: 960px;
margin: 0 auto;
}
That should take care of it.
Take care,
Tony
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberLol...glad you got it since my code keeps getting stripped out.
Adding the "float: left;" to the middle widget will line them all up.
take care.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberYou're gonna kick yourself 🙂
Should be class="home-middle". You'll also have to float .home-middle left.
Have a great night!
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberHello,
That looks like the right place, as long as it's your child-theme css (NOT the Genesis parent css). I would change the #title a, #title a:hover to:
#title a {
background: url("images/my-image.png") no-repeat center center;
display: block;
height: 100px;
width: 200px;
text-indent: -9999px;
}
#title a:hover {
text-decoration: none;
}
Adding the text-indent will hide the text, and all you will see is the background image/logo.
You might have to play with or remove the #title-area width, but hard to tell without seeing the site.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberI'm sorry I can't help much specifically with the minimum template, but I can say that I've used Woocommerce on many Genesis sites (with various Studiopress child themes and custom child themes) and it has worked great. I haven't had many issues with integrating, and the few that I've had have been easily fixed with some minor css tweaks.
It's not perfect, but I think it's the best ecommerce wordpress solution out there, and it's getting better all the time.
Hopefully someone else can confirm how it's worked with the minimum theme, but I can't imagine there would be any issues.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberMy pleasure, Michael!
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberDid you try my suggestion? The Monarch image is not on it's own line, it just looks like that because the different heights are not allowing the images to flow properly.
If you resize that image (or use css to control the height as Bill Murry suggested, but since it's responsive that will cause other issues if you're concerned about that), you'll see that the Monarch is the first image of three on the second line.
The easy way to test it would be to follow Bill's advice above, setting your images to a consistent height and you'll see they all line up evenly.
If that's not how they should be laid out, I don't understand what you're having issues with...
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberTony @ AlphaBlossomMemberHi,
You can add this to your child-theme functions.php:
[ Sorry, keeps stripping out part of my code.
]
Then in your child-theme style.css, you can add:
#header .my-date-class {
text-align: center;
}
Here you can also style your color, margins, etc.
The time format is controlled in your admin panel under settings.
Have a good night!
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
February 11, 2013 at 6:14 pm in reply to: How to make dropdowns in vertical nav slide out to the right instead? #19733Tony @ AlphaBlossomMemberGlad I could help!
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberI'm happy to help!
I'm not aware of any other way to do that other than a custom header.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberHello,
Add this to your css .button-blue style:
.button-blue {
display: block;
width: xxxpx;
}
Of course, replace xxx with the width you want.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberBecause your images are not the same height, they are not lining up properly. Most images are 230px, but the third one is 220px. If you make sure all pics are the same height, it will fix your issue.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
February 11, 2013 at 1:03 pm in reply to: How to make dropdowns in vertical nav slide out to the right instead? #19657Tony @ AlphaBlossomMemberHello, you can set the margins for your submenu:
#nav .submenu {
margin: -30px 0 0 150px;
}
Also, your #nav wrap styles are not overriding the standard wrap styles, so your #nav .wrap is still very wide. You can add !important (width: xxpx !important;) after your #nav .wrap width and margin settings.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
February 11, 2013 at 11:25 am in reply to: How to modify header to show up better in Agency Responsive mode #19636Tony @ AlphaBlossomMemberI'm sure there are basic instructions, but it's hard to cover everyone's ideas, so this forum (or google) is probably your best way to find help for your specific situation.
@alanaburton looks like you made good progress 🙂I would recommend a few changes to make the responsive layout work better. It's not the only way, but it's the way I usually do it:
I would move the background image away from the #header, and into the #title a. Then you can center it in the header when your resolution reaches a certain size.
#title a {
width: xxxpx; (or xx%)
height: xxxpx;
display: block;
text-indent: -9999px; (or set Genesis options to display logo and this is not needed)
background: your image no-repeat center center; (or top or bottom)
}
You'll also need to adjust #title-area and #title, but doing it this way will allow you to center your background image when you get to smaller resolutions.
For the right half, I would move the price circle to a background image on the widget-area wrapper (.widget-area), then you can have the phone number left aligned, the price on the right, and as it gets smaller the phone number can be centered and the pricing will stay on the right.
Let me know if that doesn't make any sense.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
February 10, 2013 at 7:43 pm in reply to: How to modify header to show up better in Agency Responsive mode #19494Tony @ AlphaBlossomMemberHello,
There's several ways to do what you want, but without changing your image or your setup, the only thing I can think of is to add "background-size" to your #header background image.
So in your child-theme css (or custom css), you'd add the following to your #header css:
background-image: contain; (or background-image: 100%)
Some problems with this method - you might have some issues with browser support (ie8 and below, etc), and at smaller resolutions some of your image text might be unreadable/too small.
Maybe a better way is to use a different background image for different resolutions, so depending on the device/resolutions viewing your website, your viewers would see the background image that is intended for that resolution.
Another idea is to put the phone number and price in a header widget, and when it gets below a certain size, use css to position the widget below the text part of the logo. With this method you'd still have to make some changes to your images for it to work right.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberHi there! Nice looking site, great job.
Just a couple small things I would change on the home page:
The buttons are a little washed out looking when mousing over. I would at least change the color of the text on mouseover so it stands out more...but of course it's subjective.
I can barely read the twitter links...the color is really hard to see against the blue background.
I would add a little padding under the read more button in the footer, under Media
I would find a matching icon for the twitter, so that the three icons are consistent in stlyle.All very minor things.
Take care,
Tony
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
Tony @ AlphaBlossomMemberThanks so much, Susan! I really like the way it turned out, and it was a fun site to make! Have a great day.
Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom
-
AuthorPosts