Pretty PIctures: Header/Footer

Community Forums Forums Design Tips and Tricks Pretty PIctures: Header/Footer

This topic is: not resolved

This topic contains 12 replies, has 4 voices, and was last updated by  Annaedv 1 year, 7 months ago.

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #14042

    sarahsmiley
    Participant
    Post count: 18

    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.

    #14053

    braddalton
    Participant
    Post count: 10667

    Link to your site please.

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

    [php]
    /** 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
    ) );
    [/php]


    #14056

    braddalton
    Participant
    Post count: 10667

    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.


    #14057

    sarahsmiley
    Participant
    Post count: 18

    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/

     

     

    #14071

    braddalton
    Participant
    Post count: 10667

    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.


    #14109

    sarahsmiley
    Participant
    Post count: 18

    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.

    #14133

    braddalton
    Participant
    Post count: 10667

    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.


    #14176

    sarahsmiley
    Participant
    Post count: 18

    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?

    #14183

    braddalton
    Participant
    Post count: 10667

    [css]#header .widget-area {
    line-height: 1.6875;
    }[/css]

    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!


    #14191

    braddalton
    Participant
    Post count: 10667

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

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

    1 rem = 16px

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


    #14207

    sarahsmiley
    Participant
    Post count: 18

    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;

    #14797

    FrankSP
    Participant
    Post count: 3

    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

    #37548

    Annaedv
    Participant
    Post count: 51

    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?

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.