Suporte » Temas » Sticky Menu e logo no tema Avada

Visualizando 7 respostas - 16 até 22 (de um total de 22)
  • Moderador Miriam de Paula

    (@miriamdepaula)

    Pelo o que vejo no código do seu header.php, talvez o trecho de código responsável pelo topo, esteja em outro arquivo…

    Note:

    get_template_part( 'framework/templates/header' );

    Vá no caminho especificado na função que você vai encontrar o arquivo header.php que contem o código que você procura (Assim espero!) … Tem temas que são péssimos! Muito difíceis pra quem quer customizar… Por isso raramente uso temas prontos.

    Abs.

    opa, acho que achei aqui, seguindo o caminho.

    <?php global $smof_data,$woocommerce,$main_menu; ?>
    <?php
    $c_pageID = get_queried_object_id();
    $header_sticky_bg_color_hex = avada_hex2rgb($smof_data['header_sticky_bg_color']);
    $header_normal_bg_color_hex = avada_hex2rgb($smof_data['header_sticky_bg_color']);
    $header_normal_bg_color = $header_sticky_bg_color_hex[0] . ',' . $header_sticky_bg_color_hex[1] . ',' . $header_sticky_bg_color_hex[2] . ',' . $smof_data['header_sticky_opacity'];
    if( ( ($smof_data['header_transparent'] && get_post_meta($c_pageID, 'pyre_transparent_header', true) != 'no') ||
    		  ( ! $smof_data['header_transparent'] && get_post_meta($c_pageID, 'pyre_transparent_header', true) == 'yes') ) && ! is_search() ) {
    	$header_normal_bg_color = 'none';
    }
    ?>
    
    <?php if( $smof_data['header_sticky'] ): ?>
    <header id="header-sticky" class="sticky-header">
    <div class="sticky-shadow">
    	<div class="avada-row">
    		<div class="logo">
    			<a href="<?php bloginfo('url'); ?>">
    				<img src="<?php echo $smof_data['logo']; ?>" alt="<?php bloginfo('name'); ?>" data-max-width="<?php echo $smof_data["header_sticky_logo_max_width"]; ?>" class="normal_logo" />
    				<?php if($smof_data['logo_retina'] && $smof_data['retina_logo_width'] && $smof_data['retina_logo_height']): ?>
    				<?php
    				$pixels ="";
    				if(is_numeric($smof_data['retina_logo_width']) && is_numeric($smof_data['retina_logo_height'])):
    				$pixels ="px";
    				endif; ?>
    				<img src="<?php echo $smof_data["logo_retina"]; ?>" alt="<?php bloginfo('name'); ?>" style="width:<?php echo $smof_data["retina_logo_width"].$pixels; ?>;height:<?php echo $smof_data["retina_logo_height"].$pixels; ?>;" data-max-width="<?php echo $smof_data["header_sticky_logo_max_width"]; ?>" class="retina_logo" />
    				<?php endif; ?>
    			</a>
    		</div>
    		<nav id="sticky-nav" class="nav-holder">
    		<ul class="navigation menu fusion-navbar-nav">
    			<?php
    			if ( has_nav_menu( 'sticky_navigation' ) ) {
    				if(! $smof_data['disable_megamenu']) {
    					wp_nav_menu(array(
    						'theme_location'	=> 'sticky_navigation',
    						'depth'				=> 5,
    						'container' 		=> false,
    						'menu_id' 			=> 'nav',
    						'items_wrap' 		=> '%3$s',
    						'menu_class'        => 'nav fusion-navbar-nav',
    						'fallback_cb'       => 'FusionCoreFrontendWalker::fallback',
    						'walker'            => new FusionCoreFrontendWalker()
    					));
    				} else {
    					wp_nav_menu(array('theme_location' => 'sticky_navigation', 'depth' => 5, 'container' => false, 'menu_id' => 'nav', 'items_wrap' => '%3$s'));
    				}
    			} else {
    				echo $main_menu;
    			} ?>
    			<?php if(class_exists('Woocommerce')): ?>
    			<?php if($smof_data['woocommerce_acc_link_main_nav']): ?>
    			<li class="my-account">
    				<a href="<?php echo get_permalink(get_option('woocommerce_myaccount_page_id')); ?>" class="my-account-link"><?php _e('My Account', 'Avada'); ?></a>
    				<?php if(!is_user_logged_in()): ?>
    				<div class="login-box">
    					<form action="<?php echo wp_login_url(); ?>" name="loginform" method="post">
    						<p>
    							<input type="text" class="input-text" name="log" id="username" value="" placeholder="<?php echo __('Username', 'Avada'); ?>" />
    						</p>
    						<p>
    							<input type="password" class="input-text" name="pwd" id="pasword" value="" placeholder="<?php echo __('Password', 'Avada'); ?>" />
    						</p>
    						<p class="forgetmenot">
    							<label for="rememberme"><input name="rememberme" type="checkbox" id="rememberme" value="forever"> <?php _e('Remember Me', 'Avada'); ?></label>
    						</p>
    							<p class="submit">
    							<input type="submit" name="wp-submit" id="wp-submit" class="button small default comment-submit" value="<?php _e('Log In', 'Avada'); ?>">
    							<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['HTTP_REFERER']; ?>">
    							<input type="hidden" name="testcookie" value="1">
    						</p>
    						<div class="clear"></div>
    					</form>
    				</div>
    				<?php else: ?>
    				<ul class="sub-menu">
    					<li><a href="<?php echo get_permalink(get_option('woocommerce_logout_page_id')); ?>"><?php _e('Logout', 'Avada'); ?></a></li>
    				</ul>
    				<?php endif; ?>
    			</li>
    			<?php endif; ?>
    			<?php if($smof_data['woocommerce_cart_link_main_nav']): ?>
    			<li class="cart">
    				<?php if(!$woocommerce->cart->cart_contents_count): ?>
    				<a class="my-cart-link" href="<?php echo get_permalink(get_option('woocommerce_cart_page_id')); ?>"></a>
    				<?php else: ?>
    				<a class="my-cart-link my-cart-link-active" href="<?php echo get_permalink(get_option('woocommerce_cart_page_id')); ?>"></a>
    				<div class="cart-contents">
    					<?php foreach($woocommerce->cart->cart_contents as $cart_item): //var_dump($cart_item); ?>
    					<div class="cart-content">
    						<a href="<?php echo get_permalink($cart_item['product_id']); ?>">
    						<?php echo get_the_post_thumbnail($cart_item['product_id'], 'recent-works-thumbnail'); ?>
    						<div class="cart-desc">
    							<span class="cart-title"><?php echo $cart_item['data']->post->post_title; ?></span>
    							<span class="product-quantity"><?php echo $cart_item['quantity']; ?> x <?php echo $woocommerce->cart->get_product_subtotal($cart_item['data'], 1); ?></span>
    						</div>
    						</a>
    					</div>
    					<?php endforeach; ?>
    					<div class="cart-checkout">
    						<div class="cart-link"><a href="<?php echo get_permalink(get_option('woocommerce_cart_page_id')); ?>"><?php _e('View Cart', 'Avada'); ?></a></div>
    						<div class="checkout-link"><a href="<?php echo get_permalink(get_option('woocommerce_checkout_page_id')); ?>"><?php _e('Checkout', 'Avada'); ?></a></div>
    					</div>
    				</div>
    				<?php endif; ?>
    			</li>
    			<?php endif; ?>
    			<?php endif; ?>
    			<?php if($smof_data['main_nav_search_icon']): ?>
    			<li class="main-nav-search">
    				<a id="sticky-nav-search-link" class="search-link"></a>
    				<div id="sticky-nav-search-form" class="main-nav-search-form">
    					<form role="search" id="searchform" method="get" action="<?php echo home_url( '/' ); ?>">
    						<div class="search-table">
    							<div class="search-field">
    								<input type="text" value="" name="s" id="s" />
    							</div>
    							<div class="search-button">
    								<input type="submit" id="searchsubmit" value="" />
    							</div>
    						</div>
    					</form>
    				</div>
    			</li>
    			<?php endif; ?>
    		</ul>
    		</nav>
    		<?php if(tf_checkIfMenuIsSetByLocation('main_navigation') || tf_checkIfMenuIsSetByLocation('sticky_navigation')): ?>
    		<div class="mobile-nav-holder"></div>
    		<?php endif; ?>
    	</div>
    	</div>
    </header>
    <?php endif; ?>

    Acho que teria que alterar a parte:

    <div class="avada-row">
    		<div class="logo">
    			<a href="<?php bloginfo('url'); ?>">
    				<img src="<?php echo $smof_data['logo']; ?>" alt="<?php bloginfo('name'); ?>" data-max-width="<?php echo $smof_data["header_sticky_logo_max_width"]; ?>" class="normal_logo" />
    				<?php if($smof_data['logo_retina'] && $smof_data['retina_logo_width'] && $smof_data['retina_logo_height']): ?>
    				<?php
    				$pixels ="";
    				if(is_numeric($smof_data['retina_logo_width']) && is_numeric($smof_data['retina_logo_height'])):
    				$pixels ="px";
    				endif; ?>
    				<img src="<?php echo $smof_data["logo_retina"]; ?>" alt="<?php bloginfo('name'); ?>" style="width:<?php echo $smof_data["retina_logo_width"].$pixels; ?>;height:<?php echo $smof_data["retina_logo_height"].$pixels; ?>;" data-max-width="<?php echo $smof_data["header_sticky_logo_max_width"]; ?>" class="retina_logo" />
    				<?php endif; ?>

    Moderador Miriam de Paula

    (@miriamdepaula)

    O lugar é realmente este. Analisando o código dá pra ver que ele pega a imagem que foi definida pelas configurações do tema.

    O problema é que ele está fazendo a diminuição da mesma imagem, através de JavaScript. O bloco de código é sempre o mesmo, tanto para quando abrimos o site, quanto para quando rolamos a barra e aí ela fica fixa “stick nav”…

    Precisamos encontrar o JS que modifica isso… Aí a coisa vai ficando mais complicada. Não manjo nada de JS, mas to tentando encontrar os arquivos utilizados pelo tema, só olhando aqui o codigo-fonte. Se eu conseguir algo eu te aviso.

    Achei o JS que modifica. ( acho).
    É o main.js
    Dei uma busca nos códigos por sticky header e encontrei isso:

    (function( jQuery ) {
    
    	"use strict";
    
    	// init sticky header
    	jQuery.fn.init_sticky_header = function() {
    
    		var sticky_mobile_menu_padding;
    
    		var sticky_header_height = 65;
    		var sticky_top = jQuery('.sticky-header').css('top');
    		var sticky_start = sticky_top.replace('px','') - 55;
    		var logo = '.sticky-header .logo img.normal_logo';
    		var not_logo = '.sticky-header .logo img.retina_logo';
    		var orig_logo_height, orig_logo_width, logo_max_width, width_ratio, calc_width, calc_height,
    			logo_height, logo_line_height, logo_width, logo_margin_top	= 0;
    
    		var anchor_scrolling = 0;
    		jQuery('.sticky-header').css('top', sticky_start+'px');
    		jQuery('.init-sticky-header').waypoint(function(direction) {
    			if(direction === "down") {
    
    				// one page anchor page load scrolling
    				var adminbar_height = jQuery('#wpadminbar').outerHeight();
    				var anchor = window.location.hash.toString();
    
    				if( anchor.length > 1 && jQuery(anchor).length && ! anchor_scrolling ) {
    					jQuery('html, body').animate({
    						scrollTop: jQuery(anchor).offset().top - adminbar_height - 65 + 1
    					}, 350, 'easeInOutExpo');
    					anchor_scrolling = 1;
    				}
    
    				if(jQuery('#wpadminbar').length >= 1) {
    					sticky_top = jQuery('#wpadminbar').outerHeight()+"px";
    				}
    				jQuery('.sticky-header').show();
    				jQuery('.sticky-header').animate({
    					height: sticky_header_height + 3 + 'px',
    					top: sticky_top
    					}, 500 );
    				jQuery('.sticky-shadow').animate({
    					height: sticky_header_height  + 'px',
    					top: sticky_top
    				}, 500 );
    
    				if( jQuery('#header .retina_logo').is(':visible')) {
    					logo = '.sticky-header .logo img.retina_logo';
    					not_logo ='.sticky-header .logo img.normal_logo';
    				} else {
    					logo = '.sticky-header .logo img.normal_logo';
    					not_logo = '.sticky-header .logo img.retina_logo';
    				}
    
    				orig_logo_height = jQuery(logo).height();
    				orig_logo_width = jQuery(logo).width();
    				logo_max_width = jQuery(logo).data("max-width");
    
    				//IE8 quirks
    				if (jQuery('.no-svg').length >= 1) {
    					orig_logo_height = orig_logo_height + 4;
    					orig_logo_width = orig_logo_width + 4;
    				}
    
    				calc_width = orig_logo_width;
    				calc_height = orig_logo_height;
    				if (logo_max_width > 0) {
    					width_ratio = logo_max_width / orig_logo_width;
    					calc_width = logo_max_width;
    					calc_height = orig_logo_height * width_ratio;
    				}
    
    				if (calc_height > 55) {
    					logo_height = "55px";
    					logo_line_height = "55px";
    					logo_width =  55 / orig_logo_height * orig_logo_width;
    					logo_margin_top = "5px";
    				} else {
    					logo_height = calc_height+"px";
    					logo_line_height = calc_height+"px";
    					logo_width = calc_width;
    					logo_margin_top = (65 - calc_height) / 2;
    				}
    
    				sticky_mobile_menu_padding = logo_width+25;
    
    				jQuery('body #header-sticky.sticky-header .sticky-shadow .mobile-nav-holder').css('padding-left', sticky_mobile_menu_padding+"px");
    				logo_width = logo_width+"px";
    
    				//IE8 quirks
    				if (jQuery('.no-svg').length >= 1) {
    					jQuery(logo).animate({
    						height: logo_height,
    						'line-height': logo_line_height,
    						'max-width': logo_width,
    						'margin-top': logo_margin_top
    					}, 500 );
    					jQuery(not_logo).css('height', logo_height).css('line-height', logo_line_height).css('max-width', logo_width).css('margin-top', logo_margin_top);
    					jQuery(logo).css('display', '');
    				} else {
    					jQuery(logo).animate({
    						height: logo_height,
    						'line-height': logo_line_height,
    						width: logo_width,
    						'margin-top': logo_margin_top
    					}, 500 );
    					jQuery(not_logo).css('height', logo_height).css('line-height', logo_line_height).css('width', logo_width).css('margin-top', logo_margin_top);
    					jQuery(logo).css('display', '');
    				}
    
    				jQuery('.sticky-header #sticky-nav ul.menu > li > a').animate({
    					height: sticky_header_height + 'px',
    					'line-height': sticky_header_height + 'px'
    				}, 500 );
    
    				jQuery('.sticky-header').addClass('sticky');
    				jQuery('#small-nav').css('visibility', 'hidden');
    		 } else if(direction === "up") {
    				jQuery('.sticky-header').css( 'height', '' );
    				jQuery('.sticky-shadow').css( 'height', '' );
    
    				jQuery('#header .retina_logo, #header-sticky .retina_logo').css( 'height', orig_logo_height );
    				jQuery('#header .retina_logo, #header-sticky .retina_logo').css( 'width', orig_logo_width );
    				jQuery('#header-sticky .retina_logo').css( 'margin-top', '' );
    				jQuery('#header .normal_logo, #header-sticky .normal_logo').css( 'height', '' );
    				jQuery('#header .normal_logo, #header-sticky .normal_logo').css( 'width', '' );
    				jQuery('#header-sticky .retina_logo').css( 'margin-top', '' );
    
    				jQuery(logo+','+not_logo).css( 'line-height', '' );
    				jQuery(logo+','+not_logo).css( 'padding-top', '' );
    				jQuery(logo+','+not_logo).css( 'max-width', '' );
    				jQuery(logo+','+not_logo).css( 'margin-top', '' );
    
    				jQuery('.sticky-header #sticky-nav ul.menu > li > a').css( 'height', '' );
    				jQuery('.sticky-header #sticky-nav ul.menu > li > a').css( 'line-height', '' );
    
    				jQuery('.sticky-header').removeClass( 'sticky' );
    				jQuery('.sticky-header').hide();
    				jQuery('#small-nav').css('visibility', 'visible');
    
    				jQuery('.sticky-header .mobile-nav-holder #mobile-nav').css( 'display', 'none' );
    			 }
    		});
    	};
    
    	// animate counter boxes
    	jQuery.fn.fusion_box_counting = function() {
    		var count_value = jQuery( this ).data( 'value' );
    		var count_direction = jQuery( this ).data( 'direction' );
    
    		if( count_direction == 'down' ) {
    			jQuery(this).countTo( { from: count_value, to: 0, refreshInterval: 10, speed: 1000 } );
    		} else {
    			jQuery(this).countTo( { from: 0, to: count_value, refreshInterval: 10, speed: 1000 } );
    		}
    	};

    Acredito que seja ai q devo mudar. Talvez se eu enganar o template na parte de normal logo e alterar para o retina logo, pode ser q eu consiga. Pois o retina logo está em branco.

    Moderador Miriam de Paula

    (@miriamdepaula)

    Bom, legal que encontrou algo… Pena eu não entender nada de JS pra continuar te ajudando mais. Mas vou ficar na torcida pra que outras pessoas vejam o teu problema aqui e possam te ajudar com esse JS… e também, claro, pra que você consiga arrumar, mesmo que sozinho…

    Abração e boa sorte!

    Magina, você mais que ajudou! Muito obrigado mesmo!

    Malkalino, como conseguiu alterar o logo? Vi o seu site de teste, e fiquei interessado na parte que você deixou o sticky header centralizado e também conseguiu trocar a parte do logo.. Obrigado!

Visualizando 7 respostas - 16 até 22 (de um total de 22)
  • O tópico ‘Sticky Menu e logo no tema Avada’ está fechado para novas respostas.