• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

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

Changing "live area" of header-image link?

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.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Changing "live area" of header-image link?

This topic is: not resolved

Tagged: css, header image, monochrome pro

  • This topic has 4 replies, 3 voices, and was last updated 5 years, 8 months ago by snallygaster.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • September 21, 2017 at 12:02 pm #211713
    snallygaster
    Member

    Hi Community!

    I'd like to set the active linked area of my header image to be only a the top 80px or so of the image. I've been fiddling around with the CSS for way longer than it <<should>> be taking - lol - so wanted to ask for some suggestions.

    You'll see why when you look at the site: http://143.95.235.86/~hvastaging

    I'm using Monochrome Pro as a base child theme, but I'm pretty sure the solution (if there is one) would apply to any StudioPress Genesis child.

    Everything I've tried has changed the image size as well... I can't figure out how to uncouple the image itself from the area.

    Many thanks for any suggestions!

    http://143.95.235.86/~hvastaging
    September 21, 2017 at 12:10 pm #211715
    Brad Dalton
    Participant

    Try setting the values for the title-area width and height.


    Tutorials for StudioPress Themes & WooCommerce.

    September 21, 2017 at 12:18 pm #211716
    snallygaster
    Member

    Thanks, Brad. Still not getting it...

    I tried the basic title area CSS, adding height and width, but no apparent change:

    .title-area {
    float: left;
    padding-bottom: 20px;
    padding-top: 20px;
    height: 80px;
    width: 340px;

    }

    Also, my .header-image .title-area CSS already has height/width params that don't seem to affect the active area:

    .header-image .title-area {
    height: 50px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    padding: 0;
    width: 340px;
    }

    September 21, 2017 at 4:10 pm #211731
    Victor Font
    Moderator

    Header images are added through inline CSS and applied as background images to the site header link itself. You cannot decouple these unless you want unless you write your own function to replace the built-in Genesis genesis_seo_site_title function.


    Regards,

    Victor
    https://victorfont.com/
    Call us toll free: 844-VIC-FONT (842-3668)
    Have you requested your free website audit yet?

    September 22, 2017 at 9:45 am #211752
    snallygaster
    Member

    Thanks, Victor. That's what I was suspecting but hoping there was a CSS workaround.

    Best,
    Rob

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

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble