• 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

Retina logo AgentPress

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 › Retina logo AgentPress

This topic is: not resolved

Tagged: Agentpress, retina

  • This topic has 4 replies, 2 voices, and was last updated 9 years, 4 months ago by Marcy.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • January 14, 2016 at 5:44 pm #176529
    bkbdesign
    Member

    I've seen a bunch of posts with tricks for overriding the css to get a larger logo image for retina displays, but unfortunately, none of them applies exactly to the AgentPress theme.

    Seems that the code controlling that section is embedded in the body, so anything I'm adding to my stylesheet isn't having any effect.

    Any advice??

    http://www.bkbtesting.com/sheffersells2016
    January 16, 2016 at 3:18 pm #176713
    Marcy
    Participant

    Your logo is 320px x 80px, so your retina image would be 640px x 160px.
    In functions.php find this section and edit it as below:

    //* Add support for custom header
    add_theme_support( 'custom-header', array(
    	'header-selector' => '.site-title a',
    	'header-text'     => false,
    	//'height'          => 80,
    	//'width'           => 320,
             'height'          => 160,
    	'width'           => 640,
    ) );

    This will allow you to upload a larger image.

    If you use a logo with dimensions that are twice the theme recommended size, then everything should just work with AgentPress Pro.

    If you need to change the image size, you can post the dimensions of your retina image here.
    You can also use this post to help you with different logo sizes.

    Add Retina Logo to Genesis or WordPress Themes


    Marcy | Amethyst Website Design | Twitter

    January 16, 2016 at 4:52 pm #176719
    bkbdesign
    Member

    I did exactly that, and uploaded the retina image through the customizer and it doesn't resize when viewed in a browser. The retina logo on mobile devices however does resize as expected. What am I missing?

    January 16, 2016 at 4:57 pm #176720
    bkbdesign
    Member

    Figured it out. Seems that the .header-image .site-title > a was missing background-size: contain. Thanks!

    January 16, 2016 at 6:24 pm #176725
    Marcy
    Participant

    Great! It looks nice!


    Marcy | Amethyst Website Design | Twitter

  • 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

© 2025 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