Pretty PIctures: Header/Footer

[sarahsmiley]

I have two questions...

1. I used the code (to Theme and CSS) to install widgets into the Pretty Pictures footer, but they aren't appearing on the website. I used the code on this page: http://www.briangardner.com/code/add-footer-widgets/ I posted the top code to Theme and the bottom to CSS. Was that not correct?

2. The header on pretty pictures seems to fluctuate with the text in the header widget. I'd like to make the header thinner (height-wise). Is there any way to adjust the padding around this? No matter what I do, the header seems to only get as thin as 550 pixels. I tried adjusting the height in the code, but it still bounces around according to the text.

[Brad Dalton]

Link to your site please.

I know you can change the header height by editing the code in your child themes functions.php file

/** Add support for custom header */
add_theme_support( 'custom-header', array(
	'default-image'		=> get_stylesheet_directory_uri() . '/images/header.jpg',
	'flex-height'		=> true,
	'flex-width'		=> true,
	'header-text'		=> false,
	'height'			=> 550,
	'width'				=> 1600
) );

---

Tutorials for StudioPress Themes.

[Brad Dalton]

The single line of php code goes into your child themes functions.php file, at the end

The large block of CSS code goes in your child themes style.css file, at the end.

I tested this code on your theme locally and it works fine.

You could edit the CSS to make your footer widgets wider if needed.

Best to backup the files you are editing before doing so.

---

Tutorials for StudioPress Themes.

[sarahsmiley]

Thank you so much! Trying to figure out how to share my site with you even though it's not "live" yet? Here is the link I look at while editing: http://70.40.220.101/~sarahsm1/

 

 

[Brad Dalton]

Everything looks ok but i don't see the footer widgets.

Can you drag in 3 calender widgets so at least something displays there.

You can reduce the height of your header but you might also want to resize the image so its the same height as your new header area.

---

Tutorials for StudioPress Themes.

[sarahsmiley]

Well, that's the thing.... I do have some widgets in the footer area, but they aren't showing up.

For the header/photo: It seems like it's set to automatically adjust to a certain size. Is this possible? Because no matter how I make the photo or crop the header before posting, it stretches everything back to this size.

[Brad Dalton]

I tested the code with your theme and it works fine so you musthave missed something when creating the footer widgets.

Did you change this?

'height' => 550,

I tested this and it works.

---

Tutorials for StudioPress Themes.

[sarahsmiley]

Well, what I'm figuring out is that there is padding or margins around the widget that creates the text or the title in the header. Because more lines of text create a taller header. Where in the code would I adjust this?

[Brad Dalton]

#header .widget-area {
    line-height: 1.6875;
}

You can change the line-height value and add other properties to style your header widget.

http://www.htmldog.com/reference/cssproperties/

Not sure what the problem is with your footer because its a very simple process to add 3 widgets there.

Great theme. Wouldn't mind changing to this at some stage!

---

Tutorials for StudioPress Themes.

[Brad Dalton]

Use this code to change the font size in the header right widget:

#header .widget-area {
	line-height: 1.6875;
	font-size: 14px;
	font-size: 0.875rem;
}

1 rem = 16px

This theme uses both rem with a pixel fallback for browsers which don't support rem values.

---

Tutorials for StudioPress Themes.

[sarahsmiley]

Thank you so much for all of your help. Really insightful. I'm learning!

When I look at my css, I see this (below), and I'm wondering, if I'm reading it right. According to this, is there a 26px margin at the bottom of the header widget area?

 

#header .widget-area {
line-height: 1.6875;
}

.entry-content p {
margin-bottom: 27px;
margin-bottom: 1.6875rem;
}

.format-quote .entry-content p{
margin: 0;

[FrankSP]

Hi guys and girls!

I have a problem with the Pretty Pictures header image. It says recommended size 1600*550, yet it displays just the middle part of it!

Has any of you had teh same issue?

Cheers,

Frank

[Annaedv]

Hello.

I have the same problem. I want to change the hight of my header in Pretty Pictures.

I change the code in functions.php

I change the header.jpg

I change the #header .widget-area {
line-height: 1.6875;
}

NOTHING HAPPENS!

What to do?

[Author]

Posts