Docs

[Olianna P]

Hi,

My site is http://www.ccisusa.com/

I’m trying to add the following image (http://www.ccisusa.com/wp-content/uploads/2016/09/images-1.png) to my TopBar and link it to the following page http://www.ccisusa.com/chinese-home/

Please help, thank you!

[Friech]

Hi There,

Thanks for writing in! Paste this on your Topbar content on Customizer.

<a href="http://www.ccisusa.com/chinese-home/"><img src="http://www.ccisusa.com/wp-content/uploads/2016/09/images-1.png"></a>

Hope it helps, Cheers!

[Olianna P]

It worked but I would like it on the right side of the page instead of the left. How do I do that?

Thanks!

[Jade]

Hi Olianna,

You can add this under Custom > CSS in the Customizer.

.p-info {
    text-align: right;
    width: 100%;
}

Hope this helps.

[Olianna P]

Thanks, it worked! Now, is there a way to make the top bar font bigger?

Also, I had to re-upload a smaller version of the pic and now it looks very fuzzy. Is there a way to upload the bigger picture and then customize it smaller?

Thanks so much!

[Friech]

Hi There,

Yes please, use a bigger image. And please update the code provided above.

<a href="http://www.ccisusa.com/chinese-home/" class="lang"><img src="http://www.ccisusa.com/wp-content/uploads/2016/09/chinese-small.png "> Chinese </a>

Now we can have a custom CSS to adjust the image size.

a.lang img {
    width: 32px;
    height: 32px;
}

And a custom CSS to adjust the text size.

a.lang {
    font-size: 22px;
    font-weight: 600;
}

Feel free to adjust those values.

Hope it helps, Cheers!

[Olianna P]

Great that worked perfectly, thank you!

2 more things:

(1) when I scroll down the homepage- Navbar menu stays but the logo disappears for some reason. I’d like the logo to stay.. How can I fix that?

http://www.ccisusa.com/

(2) On About Us Page (http://www.ccisusa.com/about/) I’m having trouble changing the icons in the “Counter” section right above the Contact Us form. I need to change the icons of “school” and “Colleges”.

Thanks in advance!

[Thai]

Hi There,

Your website requires the account & password to access those pages, please provide us.

Thanks.

[Olianna P]

This reply has been marked as private.

[Jade]

Hi there,

#1 Add this in custom JS:

jQuery(function($){

	$(window).scroll(function() {

		if( $(this).scrollTop() > 0 ) {
			$('.x-logobar').addClass('x-navbar-fixed-top');
      
      height = $('.x-logobar').outerHeight();
      $('.x-navbar.x-navbar-fixed-top').css('margin-top', height);
      
		} else {
      $('.x-logobar').removeClass('x-navbar-fixed-top');
      $('.x-navbar').css('margin-top', '');
    }

	});

});

#2 Kindly let us know to which icons you want to change them to.

#3 Update your toppbar content to:

<a href="/login" class="topbar-login">Login</a><a href="http://www.ccisusa.com/chinese-home/" class="lang"><img src="http://www.ccisusa.com/wp-content/uploads/2016/09/images-1.png"> Chinese </a>

Then add this CSS:

.topbar-login {
    float: left;
    border-bottom: 0 !important;
    font-size: 15px;
}

#4 Add this code in the CSS:

.x-slider-container.below {
    border-bottom: 0;
}

Hope this helps.

[Olianna P]

The first one didn’t work but the rest did!

The logo still dissapears when we scroll down.

[Jade]

Hi there,

I went ahead and fixed the JS code in the customizer.

Kindly check again.

[Olianna P]

Thanks, the logo stays but the Navbar menu disappears. How do I keep the Navbar from disappearing?

Thank you!

[Christopher]

Hi there,

Please change ‘Navbar Position’ to ‘fixed top’ under Customize -> Header.

Thanks.

[Olianna P]

thank u!

[Author]

Posts