Header Logo auf Mobil kleiner - Support | Kriesi.at

Viewing 12 posts - 1 through 12 (of 12 total)

Author

Posts
November 18, 2016 at 2:30 pm #714024

faserschmeichler
Participant

Hallo, was muss eingestellt werden damit bei Mobilgeräten das Logo kleiner wird.

November 18, 2016 at 2:59 pm #714047
Andy
Inactive Moderator
Hey Reinhard,

nutze diesen Code:
```
@media only screen and (max-width: 767px) {
#header_main .container .logo a img {
height: 60px !important;
}}
```
Gruß,
Andy
November 18, 2016 at 5:06 pm #714111

faserschmeichler
Participant

Hallo Andi, danke.

Habe ich auch die Möglichkeit ein anderes Logo für die Mobilvariante zu verwenden.

Danke Reinhard

November 18, 2016 at 5:08 pm #714113

Yigit
Keymaster

Hey!

Please refer to this post – http://kriesi.at/documentation/enfold/change-logo-on-mobile/

Regards,
Yigit

November 18, 2016 at 5:30 pm #714118

faserschmeichler
Participant

Hallo gibt es auch die Möglich das es ab einer bestimmten Breite geht. Nicht nur auf Mobil.
Kann ich das irgendwie für Quick CSS lösen. Sonst bei einem Update geht das ja verloren, oder?

November 21, 2016 at 4:53 am #714634
Ismael
Moderator
Hey!

Please replace the code with this.
```
add_action('wp_footer', 'ava_new_custom_script');
function ava_new_custom_script(){
?>
<script type="text/javascript">
(function($) {
	function a() {
		var ww   = $(window).innerWidth();

		if(ww >= 989) return;

		$('#top .logo img').attr('src', 'MOBILE LOGO HERE');
	}

	$(window).load(function() {
		a();
	});
})(jQuery);
</script>
<?php
}
```
It will change the logo on screens smaller than 989px.

Cheers!
Ismael
November 21, 2016 at 7:16 pm #714940

faserschmeichler
Participant

Hallo, Code im Quick CSS integriert. Funktioniert leider nicht.

November 21, 2016 at 7:24 pm #714942
Yigit
Keymaster
Hallo!

Füge folgenden Code in deine functions.php ein (nicht Quick CSS):
```
add_action('wp_footer', 'ava_new_custom_script');
function ava_new_custom_script(){
?>
<script type="text/javascript">
(function($) {
	function a() {
		var ww   = $(window).innerWidth();

		if(ww >= 989) return;

		$('#top .logo img').attr('src', 'LOGO AUF MOBIL HIER');
	}

	$(window).load(function() {
		a();
	});
})(jQuery);
</script>
<?php
}
```
Best regards,
Yigit
November 21, 2016 at 7:25 pm #714943

faserschmeichler
Participant

wird die function.php oder dieser Code bei einem Update überschrieben?

November 21, 2016 at 7:29 pm #714944

Yigit
Keymaster

Hallo!

Ja, die function.php und dieser Code bei einem Update überschrieben. Bitte, zu verwenden child theme – http://kriesi.at/documentation/enfold/updating-your-theme-files/

LG,
Yigit

November 21, 2016 at 7:31 pm #714945

faserschmeichler
Participant

Hallo, gibt es keine andere Möglichkeit über die Quick CSS das zu steuern.

Ab einer bestimmten Browserbreite möchte ich ein anderes Logo.

November 21, 2016 at 7:34 pm #714946
Yigit
Keymaster
Hallo!

Füge folgenden Code ins Quick CSS Feld ein:
```
@media only screen and (max-width: 989px) { 
.logo img, .responsive .logo img { opacity: 0 !important; }
.logo a { background-image: url(https://kriesi.at/wp-content/themes/kriesi/images/logo.png)!important; background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; }
}
```
LG!
Yigit
Author

Posts

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.