We want to change out our logo only on our home page… and do it for normal & retina variants

Thank you very much!

The code has a bug so does not work as written above, but I fixed the bug (correcting the second add_filter statement) and now it works right.

For posterity, here is the corrected code:

<?php
 
function vantage_child_change_logo($value){
if( is_front_page() ) {
	$value = 763;
}

return $value;
}
add_filter('siteorigin_setting_logo_image', 'vantage_child_change_logo');

function vantage_child_change_retina_logo($value){
if( is_front_page() ) {
	$value = 766;
}

return $value;
}
add_filter('siteorigin_setting_logo_image_retina', 'vantage_child_change_retina_logo');

?>

One question, with this solution on retina displays, you can see the logo displaying first the non-retina asset and then later changing to the retina asset. Is this visual glitch avoidable?

Again, thanks a lot!

Sure, you can see it here: http://tinyurl.com/n9wr2cy

(the site is up and down)

The much bigger problem we are having is that the logo does not stay flush with the left column as the browser is resized down.

For instance, look at this page: http://tinyurl.com/ocw9bqo

As you resize the browser down, the logo remains aligned with the body text… but then eventually as the browser gets smaller it keeps moving left until it hit the left edge of the browser. And then it jumps right to a weird point between the edge of the browser and the left edge of the body text.

We are just trying to make it always align with the body text below it, but we are totally stuck.

Thanks for any help! :)

Thanks for that suggestion! I have updated out site, and while that does change the behavior of the logo somewhat, it still has a weird “jump to the right” as you resize the browser downward.

This is easiest to see on a page like this: http://tinyurl.com/ocw9bqo.

Keep downsizing the browser horizontally, and watch the logo. It goes left, left, left, then jumps right, and then goes left again.

It appears that the left-margin of the full-container in the menu decreases below 35px (which is the minimum of the full-container in the body), and then once it hits 0, it jumps to inherit, which sets it back to 35px.

I am mystified.