Additional main logo and link

[mlennox10]

Hi there,

We’ve set up an area on our site which is dedicated to our awards part of our business. We’ve utilized Kleo’s great feature of having a unique logo however we also need to add a partner logo and which links to its own site.

As you can see here, we’re restricted to just one logo so have made 1 image which includes our partner logo. Can we make this link to it’s own site please? Or better still can we have two logos?

Here’s the page: http://www.inhouserecruitment.co.uk/awards/

Many thanks

Mark

[Laura]

Hello, you could add the logo at the top of the page using an element with visual composer, and make it link to your partner website, i think is better than messing around with the site logo, let me know 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[mlennox10]

Thanks Laura,

However we need the partner logo alongside the site logo as we’re running the event in association with them. It’s part of their contract unfortunately.

[Laura]

Hmm.. this will require custom code.. can you share ftp credentials, link to logos and websites of partners?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[mlennox10]

This reply has been set as private.

[Laura]

Hello, i will also need partners logos and links so i can add this manually in the code

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[mlennox10]

This reply has been set as private.

[Laura]

Hello, thanks for the info and sorry for the late reply, i’m trying to find another way of doing this so its easier

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[mlennox10]

Ok great, thanks so much for your help.

[Laura]

Hello, thanks for waiting, i’m looking for a way to do this 🙂
Are you planning to change it or its permanent?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[mlennox10]

Sorry for my delayed response Laura, I’ve been away. Thank for your continuing efforts though.

What I’d like is to have the site logo in the top left at all times, then the opportunity to have another logo (one of our sponsors) right along side it but for it to be separate so you can click, open a new page and visit their site.

What is really great, is that we can create event landing pages (such as this one). It’s just this little point we need to overcome.

If we can’t create an additional logo then I suppose we could just use the one that is there and combine the site logo with the sponsor logo image. But is there a way of making the link target=blank?

Thanks again and sorry if any of this was confusing!

[Laura]

Hello, its done, i copied /kleo/page-parts/general-header-section.php to /kleo-child/page-parts/general-header-section.php

Edited it and replaced the full code with

COPY CODE

<?php
/**
 * Header section of our theme
 *
 * Displays all of the <div id="header"> section
 *
 * @package WordPress
 * @subpackage Kleo
 * @since Kleo 1.0
 */

//set logo path
$logo_path = sq_option_url( 'logo' );
$logo_path = apply_filters( 'kleo_logo', $logo_path );
$social_icons = apply_filters( 'kleo_show_social_icons', sq_option( 'show_social_icons', 1 ) );
$top_bar = sq_option( 'show_top_bar', 1 );
$top_bar = apply_filters( 'kleo_show_top_bar', $top_bar );

$top_menu = wp_nav_menu( array(
        'theme_location'    => 'top',
        'depth'             => 2,
        'container'         => 'div',
        'container_class'   => 'top-menu col-sm-12 col-md-7 no-padd',
        'menu_class'        => '',
        'fallback_cb'       => '',
        'walker'            => new kleo_walker_nav_menu(),
        'echo'              => false
    )
);

$primary_menu = wp_nav_menu( array(
        'theme_location'    => 'primary',
        'depth'             => 3,
        'container'         => 'div',
        'container_class'   => 'collapse navbar-collapse nav-collapse',
        'menu_class'        => 'nav navbar-nav',
        //'fallback_cb'       => 'kleo_walker_nav_menu::fallback',
        'fallback_cb'       => '',
        'walker'            => new kleo_walker_nav_menu(),
        'echo'              => false
    )
);

?>

<div id="header" class="header-color">
	
	<div class="navbar" role="navigation">

		<?php if ($top_bar == 1) { //top bar enabled ?>
		
		<!--Attributes-->
		<!--class = social-header inverse-->
        <div class="social-header header-color">
        <div class="container">
            <div class="top-bar">

                <div id="top-social" class="col-sm-12 col-md-5 no-padd">
                    <?php echo kleo_get_social_profiles(); ?>
                </div>

                <?php
                // Top menu
                echo $top_menu;
                ?>
  
            </div><!--end top-bar-->
        </div>
			</div>
		
			<?php } //end top bar condition ?>

            <?php
            $header_style = sq_option( 'header_layout', 'normal' );
            if ( $header_style == 'right_logo' ) {
                $header_class = ' logo-to-right';
            } elseif ( $header_style == 'center_logo' ) {
                $header_class = ' header-centered';
            } elseif ( $header_style == 'left_logo' ) {
                $header_class = ' header-left';
            } else {
                $header_class = ' header-normal';
            }
            ?>
            <div class="kleo-main-header<?php echo $header_class;?>">
<style>
strong.logo {
  display: none;
}
div .logo {
  float: left;
  margin-top: -1%;
}
.logo a {
float:left;
}
img#logo2 {
  margin-left: 13%;
  margin-top: -6%;
}
img#logo1 {
  margin-top: 1%;
}
ul#menu-awards-menu {
  margin-top: -1.3%;
}
.kleo-main-header.header-normal.header-scrolled {
  height: 10%;
}
</style>
<div class="logo">
 <a href="http://www.inhouserecruitment.co.uk/awards"> <img src="http://www.inhouserecruitment.co.uk/IHRA.jpg" /></a>
 <a href="http://www.firstchoice.org.uk/"> <img src="http://www.inhouserecruitment.co.uk/first-choice.jpg" /></a>
 </div>
				<div class="container">   
					<!-- Brand and toggle get grouped for better mobile display -->
					<div class="navbar-header">
						<div class="kleo-mobile-switch">

                            <?php
                            $mobile_menu_atts = 'class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse"';
                            /* open the Side menu instead of the normal menu */
                            if ( sq_option( 'side_menu_mobile', 0 ) == 1 ) {
                                $mobile_menu_atts = 'class="navbar-toggle open-sidebar"';
                            }
                            ?>
                            <button type="button" <?php echo $mobile_menu_atts;?>>
                                <span class="sr-only"><?php _e("Toggle navigation",'kleo_framework');?></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>

						</div>
						
						<div class="kleo-mobile-icons">
							
							<?php 
							/** kleo_mobile_header_icons - action
							 * You can put here various icons using this action
							 *
                             * @hooked kleo_bp_mobile_notify - 9
							 * @hooked kleo_woo_mobile_icon - 10
							 */
							do_action( 'kleo_mobile_header_icons' );
							?>
							
						</div>
						
						<strong class="logo">
							<a>">
								
								<?php if ($logo_path != '') { ?>
								
									<img />" src="<?php echo $logo_path; ?>" alt="<?php bloginfo('name'); ?>">
									
								<?php } else { ?>
									
									<?php bloginfo('name'); ?>
									
								<?php } ?>
									
							</a>
						</strong>
					</div>

                    <?php if ($header_style == 'left_logo') : ?>
                    <div class="header-banner">
                        <?php echo do_shortcode( sq_option( 'header_banner', '' ) );?>
                    </div>
                    <?php endif; ?>

					<!-- Collect the nav links, forms, and other content for toggling -->
					<?php
					// Main menu
					echo $primary_menu;
					?>
				</div><!--end container-->
			</div>
			
	</div>

</div><!--end header-->

Changed the image url and link to each logo

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[mlennox10]

Hi Laura,

Thanks for your help however this has changed it for all pages of the site. Also it throws out the mobile responsive experience.

For now, would you be kind enough to put it back to where it was please? I’ll then run some experiments with your code on my test site.

Thank once again for your efforts.

Mark

[mlennox10]

Hi Laura,

I couldn’t wait as I had a client going mad at me with the sitewide change.

Anyway, I tried to put it back by copying the parent ‘general-header-section’ back over the child equivalent but now I have no logo at all.

How can I get my old logo back please?

[Laura]

Hello,i just deleted the change 🙂
As this didnt work as you wanted, i suggest to hire a developer to do this for you as it may require more time 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[mlennox10]

Hi Laura

The main issue was that the changes completely throughout the mobile experience, plus there was some spacing issues. It’s not to say I’m not grateful for your help though however I should have give you access to the test site so we could tweak what was probably just a couple of small issues.

Thanks again though,

Mark

[Author]

Posts