I’ve got the pb image widget in the header widget area and it usually looks great and is aligned mostly in the center of the header area but occasionally, for some unknown reason, it moves down to touch the menu region. Usually reloading works to reset it and it’s fine until the next time. It tends to be when I transition back from editing to the home page (visit site) or when I use the home button in the main navigation. I’m using chrome on a mac. Bizarre.
Header Widget
This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.
I have screenshots of both states.
Hi
Please can you try adding the image using the Visual Editor widget. If you’re not already using this widget you can get access to it by installing:
http://wordpress.org/plugins/black-studio-tinymce-widget/
Hi Andrew,
Ok, yes I already use Visual Editor widget although I’ve had trouble using it in that header widget region before so I was using the image widget that comes with pagebuilder. I unfortunately can’t remember what the trouble was so….
Anyway, I tried it and the first time I refreshed the page it looked bad and, as usual, upon refresh it looked fine. If I hit refresh again and again, it switches back and forth pretty regularly. Does this in Chrome (mac) and Safari (even worse) but In firefox it doesn’t seem to happen although every once in a while on reload the logo jumps a little but settles immediately into the right place. http://wp-dev.ucsc.edu/lesliegm/hellokitty/
Les
when I say “i tried it,” I meant using the Visual Editor widget.
Please give this a try for me under Appearance > Custom CSS:
/* Vantage Header Sidebar Fix */ header#masthead hgroup #header-sidebar { padding: 0 !important; }Well, yep it seems to have worked on Chrome and Safari but now FF shows it aligned with the top of the header area – looks wonky. Doesn’t move around though – just stays up there touching the top of the box.
Try changing it to:
/* Vantage Header Sidebar Fix */ header#masthead hgroup #header-sidebar { padding: 15px 0 !important; }You can adjust 15px as required.
Thank you! works great. Do you think this will go into a future release or will I just need to keep the css. I can always make a child theme so client doesn’t muck up.
I will log this issue but for now it’ll be best to leave it under Custom CSS. Appearance > Custom CSS is upgrade safe so it you don’t need to create a child theme if there is nothing else you need to handle with it.
ok, thanks!
For sure! Thanks for your understanding. All the best.
Hello – this problem is happening again. You can go to http://sites.ucsc.edu/ If you reload multiple times, you’ll see that our university seal in the header widget area bounces around from time to time. Sometimes it is aligned nicely between the top and main navigation and other times, it is bumped right up against the nav bar. Help?
In a recent update we unfortunately had to change hgroup from a tag to a div class. Please add a period in front of the word hgroup in your Custom CSS. So it should now look like this:
/* Vantage Header Sidebar Fix */ header#masthead .hgroup #header-sidebar { padding: 15px 0 !important; }Apologies for the hassle. Hope that helps.
Not a problem. But I’m still getting the behavior. I copied the change you gave me into the vantage custom CSS.
I don’t have access to the child theme and the old CSS is in it. I would think, though, that the vantage custom CSS would override the child theme css.
Please can you confirm a url where we can see this live. Thanks.
Sure, http://sites.ucsc.edu
You haven’t upgraded Vantage so please remove the CSS I just sent, that’s not applicable yet.
Please try the following under Appearance > Custom CSS:
/* Vantage Header Sidebar Fix */ header#masthead hgroup #header-sidebar { padding-top: 0 !important; padding-bottom: 0 !important; }Both top and bottom must be set to a px value.
Thanks
ok, cool. It still scoots around a little but not badly – sometimes just adds a little more room underneath or something. Strange. Anyway, I can live with that.
Uh oh. I created a child theme for Vantage because of the small CSS change from before and also a change to the functions.php file that formats the blog post titles (removes the word “category” or something).
Anyway, I was curious that you said we hadn’t upgraded. In fact, we keep everything upgraded. But when I look, I see that our child theme is 1.0.0 but Vantage Premium is 2.1.12. I goofed, huh?
Vantage is currently on 2.2.3. Head down to Settings > General and check the SiteOrigin Order Number number field. To enable auto upgrades your order number should be inserted there. Hopefully it is.
The child theme is required for the functions change. The child theme version number doesn’t matter for parent theme upgrades. You can put Custom CSS where it suits you most.
Please remove all your Custom CSS, save it in a text file as a backup and insert the below in its place:
header#masthead { background: none; }header#masthead hgroup { padding-top: 25px !important; padding-bottom: 15px !important; position: relative;}#main { background: none;}.entry-content h2 { color: #063f66; font-size: 2.0em; } h3.widget-title { color: #063f66; font-size: 1.6em;} .entry-content h3 { color: #063f66; font-size: 1.6em;} header#masthead hgroup h1 { color: #063f66; font-size: 44px; font-style: italic;}Let us know if that helps.
Yep that looks good. thank you.
Can I ask why you thought we hadn’t upgraded? Our premium vantage entry shows up to date except for the latest release and when I look at the source for the sites.ucsc.edu, it shows the latest release. I didn’t have the order number in the settings > general area….so I added it. Maybe that changed everything.
Glad that helped.
When I looked at your source code I noted that you were on a version prior to 2.2.3 which is the current version. Without your order number inserted under Settings > General > SiteOrigin Order Number, premium updates won’t be active. Inserting that should get updates running. Just note the change to hgroup that I discuss above.
Hi Andrew – well we upgraded our stage environment to the latest version. I’m not sure whether the firewall allows external visitors but the URL is sites-stage.ucsc.edu. I’ve also taken screenshots in case you can’t see it at http://vantageaccessibilty.sites.ucsc.edu/issues-vantage/
Over http://, all is well. (I haven’t tested yet with the CSS change because this other issue with the header widget cropped up and is a bigger problem.)
But over https://, the site title suddenly gets very little and the header image scoots over to the left. This is not problematic normally when people view the site because pages are delivered over http:// However, when logged in and the user clicks the site title to switch to view the site or views the site in the customizer, the problem crops up. It will be really confusing and irritating for our users.
BTW: I have removed all custom CSS from child theme and the custom css editor within vantage.
Actually, I just realized I didn’t have the new widgets bundle activated on my stage system. When I activated it, this appears to have fixed the problem. Now to test the new css you gave me above for most recent version.
CSS for new version appears to have fixed the problem with header widget jumping around – thanks. Right now, I think we’re good to go.
Super, really glad to hear you made progress there.