Footer Siderbar

[Bill Robbins]

Awesome, have a great Saturday.

[ancd]

Hello Bill,

We are back again 🙂

Header & More – We inspected the header area to modify but couldn’t find the css for the height and width. The HTML from firebug shows logo area as 263x 29, and the tagline as 413 x 22. But we like to reverse and have the logo where the tagline is but centered. Also, the logo area to shorter. If we can find where in the HTML or the php file we can adjust to the right size.

Header Height – We also want the header area to be fixed because it expanded when we added a logo image.

Donation Widget – Is it okay to add another donation sidebar widget? We plan on turning on the donation as needed but to add a permanent donation button on the sidebar. We just want to guide against any program conflict.

Donors Logo – Currently only 3 donors logos show on the home page even though we have more. How can we change the “carousel” to show more donors.

Events – How to limit the numbers of event notifications on the home page. We would like just one at a time

Thanks again.

[Bill Robbins]

Let’s see if we can’t help you out a bit.

Header

The height doesn’t have a fixed height so that you can have more flexibility in terms of logo size/shape. The width is inherited from the width of the site wrap which is 960 pixels wide.

You can reverse the logo and tagline. Just place this in the Custom CSS box:

#logo,
#text-logo {
	float: right;
	margin-top: 25px;
	margin-bottom: 25px;
}

#tagline {
	float: left;
}

You can adjust the margin on the top and bottom of the logo to change it’s spacing. If you need to fix the height, I would suggest fixing the height of the logo instead of the header so it doesn’t affect the responsive elements of the site. You could do that with this:

#logo,
#text-logo {
	max-height: 120px;
}

Which would keep your logo from going taller than that. You change the value a different number to make it smaller or taller.

If you do want to actually fix the header in height, you’re more than welcome to do that (though it may interfere with the mobile sizes). You would use this in the Custom CSS box:

#header {
	height: 150px;
}

Just change the 150 to the height you’d like to have there.

---

Donate Widget

You can have as many of those as you’d like to. You’re good to go there. The only widget that you can’t have two of in the same page is the MailChimp one. Outside of that you can have as many as you need.

If I can help, just let me know,
Bill

[ancd]

Thanks Bill. Still remaining are the questions on Events and Donor logos. The Event one is not important in that we can use a navigation instead. But the donor logos displays only 3 out of 5 images posted.

[Bill Robbins]

For your sponsors, do you have all of the sponsors added to the same sponsor group and that group is the one selected in the widget? There’s an option to choose how many sponsors are displayed in the widget. Do you have it set high enough to show all of them?

[ancd]

Coming along. Thank you.

Now it’s how to get the dropdown menus to work on the top navigation. We have the test site unlocked for your inspection: http://wp.me/P36Q2P-4

[Bill Robbins]

There’s a quick video in the video section that shows how the menus work. If you still have trouble with setting up sub-menus after the video let me know. It’s a bit easier to see than describe.

[ancd]

Plus, the site is not responsive to an iphone screen.

[Bill Robbins]

If you make layout changes like the sizing of the slider and widgets, that will affect how it fits on a phone.

[Bill Robbins]

There’s also a Jetpack module that’s a mobile site. You’ll need to turn that off to see your theme on a phone.

[ancd]

The menus are set up properly but when you hover on the main menus, there are no dropdowns.

[Bill Robbins]

Gotcha,

It looks like someone set the #header to overflow: hidden which is keeping the drop-downs from being visible. Change this in the style.css file:

#header {
	margin: 0 auto;
	min-height: 120px;
	overflow: hidden;
	width: 100%;
	padding: 3px;
	background-color: #0EAF14;
	
}

to this:

#header {
	margin: 0 auto;
	min-height: 120px;
	padding: 3px;
	background-color: #0EAF14;
	
}

That that should let you see the drop-downs.

[Author]

Posts