Tagged: logo
-
AuthorPosts
-
December 7, 2016 at 3:26 pm #721518
Hey guys,
Loving the theme! Is it possible to make some small changes to my page so that the logo scrolls up when people scroll down. Currently the logo disappears when people scroll down, but I would prefer it if the logo would stay ‘fixed’ on it’s position and just moves up (instead of shrinking). I added a picture below to show you what I mean.
Thanks!
Bart
December 8, 2016 at 6:43 am #721827Hey BartWit,
You have this in your enfold.css file:
.header-scrolled .logo { display: none; }
Please remove it or change it to this:
.header-scrolled .logo { display: block; }
Best regards,
RikardDecember 8, 2016 at 12:11 pm #721900Hello Rikard,
Thanks for your quick response. Unfortunately, this doesn’t solve our ‘problem’. We would like a sticky and shrinking header, but not a shrinking logo. We would like the logo to move upwards and not shrink, if possible… that would be great.
Thanks again,
BartDecember 11, 2016 at 7:35 am #722789Hi,
You can use Rikard’s css code to hide the logo on scroll.
.header-scrolled .logo { display: none !important; }
Unfortunately, it’s not possible to move it up on scroll.
Best regards,
IsmaelDecember 11, 2016 at 12:01 pm #722814i think he likes to have a logo scrolling away with the rest shrinking. – but i believe, that this is with the logo inside header container impossible.
see here http://webers-testseite.de/ikom/ – for a different question i changed shrinking amount of the header to 1/3. The Logo (centered above the menu) shrinks to 1/3rdYou see that little button on the left (news) – this can be placed on the same place as the logo is – instead of your logo (setting up than the logo to display:none). It scrolls out as you like and is non-shrinking but header is shrinking. I think it will be possible to shrink it to nearly zero.
_________________
tell me if this might a solution for you.
What you need is a modified copy of header.php in child-theme functions and some cssDecember 11, 2016 at 12:10 pm #722815PS i changed it to 1/100 amount) to see what i mean. And placed the News Button ( the “Logo” outside header) in the center
- This reply was modified 8 years ago by Guenni007.
December 12, 2016 at 2:21 pm #723120Hey Guenni, yes exactly! I’d like to have the logo scrolling away and the rest shrinking. I like the way the ‘news’ button scrolls up on your site! How exactly did you do this? Removed the logo from the logo area (display:none), but where (and how) did you place the ‘news’ image/ logo? Thanks!
December 13, 2016 at 2:31 am #723492ok here we go:
i hope you work with child-theme because changeings are safe when updating the parent theme.
you need a copy of footer.php in Child-Theme folder of your installation.On bottom of that footer.php copy find
wp_footer()
and insert just beforedo_action('avia_after_wrap_all');
so than it looks like:do_action('avia_after_wrap_all'); wp_footer();
This gives us the oportunity to insert code here via child-theme functions.php, and to insert it not over all pages/posts but with some if clauses only there you need it.
Yes we could insert here directly the code we need but if we like to change it or do some other things on that position it is i think : best to do it this way.
_______________this goes to functions.php of your child theme (and you see here that this will only inserted on front-page – if you want to insert it globaly insert the code (
<a class="customclass" href="#"><img class="aligncenter" src="path to your logo"/>
) directly to footer php and forget functions.php just in front of thewp_footer();
)add_action('avia_after_wrap_all', function() { if (is_front_page() ) { ?> <a class="customclass" href="#"><img class="aligncenter" src="path to your logo"/> <?php } });
on quick css you setup :
.logo, .responsive .logo { display: none; } .customclass { position: absolute; top: 0; left: 50%; transform: translate(-50%); transition: all 1s linear 0s; z-index: 501; width: 15vw }
you have to play a bit with width and top value – maybe you have to set up some rules for responsive case .
December 13, 2016 at 12:05 pm #723665Thanks Guenni! I’ll get to work next weekend. Awesome :)
December 14, 2016 at 7:32 am #724148Hi,
Great, let us know how you get on with it :-)
Thanks @guenni007 for helping out!
Best regards,
Rikard -
AuthorPosts
- You must be logged in to reply to this topic.