StudioPress

Forum navigation

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

lifestyle pro responsive header with clickable link on

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Community Forums › Forums › Archived Forums › Design Tips and Tricks › lifestyle pro responsive header with clickable link on

This topic is: not resolved

Tagged: ,

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • November 22, 2013 at 9:51 am #75021
    kmmackey
    Member

    Hi,

    I am about to start on a project using the lifestyle pro. The graphic designer wants to have a custom header with a clickable image on the right and it absolutely needs to be responsive. He would like to supply me with 2 images for the header. The first would be the background jpg or png and the second would be a transparent png that would overlay the background. That 2nd image which overlays would need to be a clickable call to action. Can anyone give me some guidance on this? I am wondering if I need to use a "backstretch" on this? I do not have anything up on a url yet as this is in the very early stage.

    Thanks,
    KM

    November 22, 2013 at 10:17 am #75028
    Brad Dalton
    Participant

    You can add the header image using the Custom Header feature in the Appearance tab in your dashboard or use CSS code to add it.

    You can then add the smaller image using the header right widget.

    Here's more on the topic http://wpsites.net/web-design/customize-lifestyle-pro-theme-header-image-area/

    Tutorials for StudioPress Themes.

    December 3, 2013 at 11:29 am #76810
    kmmackey
    Member

    Hi,

    I got the header image files in and both images are the same full width of 1068px. The clickable image has a transparent background. Is there any way these images could be stacked on top of each other and be responsive together? The graphic designer thinks that I can use a javascript backstretch to make this happen. The url of the test site is http://www.kathymackeywebservices.com/PGSPN/

    Help is appreciated!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.