Search Results for 'banner'

[Omar Lawson]

Omar Lawson

#165288

Hello Ben and company. I am having some issues with the Amazon Pay/Login button. Even though I set the button to medium or large in the Woocommerce settings under Checkout Settings – Amazon Pay the button stays the same size. Also when I use the button option versus the banner option, the button is not aligned properly on the Cart page along with the other checkout buttons like Paypal or Checkout with Credit Card button. If the banner option is chosen the size still doesn’t change. Not sure if its the Amazon Pay plugin is the issue or the Theme. Let me know if you can help me.
Thank you.

[Omar Lawson]

Omar Lawson

#165288

Hello Ben and company. I am having some issues with the Amazon Pay/Login button. Even though I set the button to medium or large in the Woocommerce settings under Checkout Settings – Amazon Pay the button stays the same size. Also when I use the button option versus the banner option, the button is not aligned properly on the Cart page along with the other checkout buttons like Paypal or Checkout with Credit Card button. If the banner option is chosen the size still doesn’t change. Not sure if its the Amazon Pay plugin is the issue or the Theme. Let me know if you can help me.
Thank you.

[Kevin]

Kevin

#164392

Hello,

No need to apologize! We’re happy to answer any questions you may have.

You can remove the header area from your home page by using this CSS:

.home header#kad-banner {
    display: none;
}

Place into Theme Options> Advanced Settings and let me know if that works for you.

-Kevin

[Hannah]

Hannah

#164153

Hey,
You could use the following css, but it’s not advised as it will look stretched on larger screens:

header#kad-banner .container, footer#containerfooter .container, div#content {
    width: 100%;
}

I would suggest setting your page template to full width. You could also use page builder and set the row layout to full width stretched.

Hannah

[Frank]

Frank

#164090

I have added a header image to the blog page using the following Custom CSS:

.blog .page-header {
background-image: url( ‘/wp-content/uploads/2016/05/banner-news.jpg’);
display: block;
height: 450px;
width: 100%;
margin-top: -15px;
background-position: 50% 25%;
background-size: cover;
text-indent: 2000px;
}

@media (max-width: 768px) {
.blog .page-header {
height: 100px;
background-size: cover;
}
}

Here is how the blog page displays the header:
*Login to see link

I need to match the fullwidth headers as shown on the other pages in this site. Here is a sample page:
*Login to see link

Could you please provide the code to achieve this?

Thanks!

[Frank]

Frank

#164090

I have added a header image to the blog page using the following Custom CSS:

.blog .page-header {
background-image: url( ‘/wp-content/uploads/2016/05/banner-news.jpg’);
display: block;
height: 450px;
width: 100%;
margin-top: -15px;
background-position: 50% 25%;
background-size: cover;
text-indent: 2000px;
}

@media (max-width: 768px) {
.blog .page-header {
height: 100px;
background-size: cover;
}
}

Here is how the blog page displays the header:
*Login to see link

I need to match the fullwidth headers as shown on the other pages in this site. Here is a sample page:
*Login to see link

Could you please provide the code to achieve this?

Thanks!

[Rainer]

Rainer

#163931

Hi, please help.

I have a big space between the primary menu and the first row of the site builder, although, I think, the secondary menu is not enabled.

How can I reduce that space?

Please let me know

Thanks

p.s. The space could be allocated for a banner too, but not sure that one is enabled either

[Rainer]

Rainer

#163931

Hi, please help.

I have a big space between the primary menu and the first row of the site builder, although, I think, the secondary menu is not enabled.

How can I reduce that space?

Please let me know

Thanks

p.s. The space could be allocated for a banner too, but not sure that one is enabled either

[Ben Ritner]

Ben Ritner

#163824

You can add css like this:

body:not(.home) .kad-header-left {
    width: 100%;
    float: none;
}
body:not(.home) #logo {
    text-align: center;
}
body:not(.home) #kad-banner #logo .kad-retina-logo {
    margin: 0 auto;
}
body:not(.home) .kad-header-widget {
    display: none;
}

Ben

[Hannah]

Hannah

#163677

This css should work for you:

.infobanner .home-message {
    vertical-align: top;
}

You can paste it into your custom css box in Theme Options > Custom CSS.

Hannah

[Rainer]

Rainer

#163388

Thanks Hannah,

Onother question: Can I use as text also JavaScript?

Something like:

<scrip(t) charset=”utf-8″ src=”//www.xxyy.com/widgets/123456.js?v=1111″ async></scrip(t)>

The script above would display a special search box provided by another site

I need to have that script to be working on top of the banner

So is that possible? If not, is there than another solution?

Regards/Rainer

[Rainer]

Rainer

#163361

Hi,

I have a few question. Please be kindly to help:

1. How can I put an element (say button) or search box on top of a banner – centered vertically and horizontal of the banner image?
Or do something which has a similar effect. Do I need the page builder to do so?
2. How can I keep the banner enabled on the home page while disabled on each other page (or make it selectable?)
3. Can I have different banners per different pagse (or just need adding an image to the top of each contents)?

Thanks/Rainer

p.s. I use Virtue Premium 4.3.4

[Rainer]

Rainer

#163361

Hi,

I have a few question. Please be kindly to help:

1. How can I put an element (say button) or search box on top of a banner – centered vertically and horizontal of the banner image?
Or do something which has a similar effect. Do I need the page builder to do so?
2. How can I keep the banner enabled on the home page while disabled on each other page (or make it selectable?)
3. Can I have different banners per different pagse (or just need adding an image to the top of each contents)?

Thanks/Rainer

p.s. I use Virtue Premium 4.3.4

[Kevin]

Kevin

#162402

By default, the theme doesn’t go from edge to edge of the screen. You would have to add the CSS Hannah shared for the content to stretch across all screens.

Try this:

header#kad-banner .container, footer#containerfooter .container, div#content {
    width: 100%;
}

This is not optimal though. On a large screen your content will stretch very far and will be difficult to read.

Let me know if that works for you.

-Kevin

[Hannah]

Hannah

#162396

Try also adding this:

header#kad-banner .container {
    width: 100%;
}

Hannah

[Ben Ritner]

Ben Ritner

#161015

I think this is what you are wanting, let me know:

@media (max-width: 1700px){
#kad-header-menu {
    display:none;
    height:0;
}
#kad-mobile-banner {
    display: block;
    height: auto;
}
}

Ben

[Park]

Park

#160284

Hi Kevin,

One thing I’m seeing is that the logo and menu scroll down with the page and cover elements below the slider when I scroll to them. Does this have to do with the #kad-banner-sticky-wrapper line of css?

I see that I’ve indicated I wanted it to layout like that page I linked, which keeps the logo and menu at the top when scrolling (sticky?), but ideally I would like my logo and topmenu to be locked in position floating over the slider.

I haven’t tried removing or modifiying that line of coding yet but I think that may be the solution, yes?

Thanks again.

[Kevin]

Kevin

#160125

Hey Park,

Try this CSS that I found from another thread:

#kad-banner {
    position: fixed;
    width: 100%;
    z-index:1000;
    background: transparent;
}
#kad-banner-sticky-wrapper {
    height: 0 !important;
}

Let me know how that works for you.

-Kevin

[Hans-Peter]

Hans-Peter

#160021

Hello …

how can i remove or deactivate the following css code?

<style type="text/css" id="kt-custom-css">#kad-banner #topbar .... </style>

<style type="text/css" title="dynamic-css" class="options-output">.kad-primary-nav ... </style>

Background: I will take it to a separate css-file manually, because the header-output ist too heavy / large.

Thank you …
Hans-Peter

[Hans-Peter]

Hans-Peter

#160021

Hello …

how can i remove or deactivate the following css code?

<style type="text/css" id="kt-custom-css">#kad-banner #topbar .... </style>

<style type="text/css" title="dynamic-css" class="options-output">.kad-primary-nav ... </style>

Background: I will take it to a separate css-file manually, because the header-output ist too heavy / large.

Thank you …
Hans-Peter

[RandomNickname]

RandomNickname

#159909

*EDIT* – Resolved

I had #kad-mobile-banner in most of my slider settings from a previous fix we had done on something unrelated. Removing these did the trick.

Thanks for your help!

[Ben Ritner]

Ben Ritner

#159875

ok, so you need to add a javascript in your footer scripts to be able to listen to the click event and add a class:

<script type="text/javascript">
jQuery(document).ready(function ($) {
     $('.mh-nav-trigger-case').on( "click", function(){
$('#kad-mobile-banner').toggleClass('kt-menu-open');
});
});
</script>

Then this css:

#kad-mobile-banner.kt-menu-open {
background:black;
}

In terms of the header moving up. Are there any other pages besides the home page that have a slider? if not use this:

@media (max-width: 992px) {
.home .wrap {
    margin-top: -60px;
    }
}

Ben

[Kevin]

Kevin

#159780

Try this CSS in Theme Options> Advanced Settings:

.kad-animation {
    border: 4px solid black;
}
.infobanner {
    margin: 20px;
}

If that doesn’t work, please link to the image menu so I can test.

[Ben Ritner]

Ben Ritner

#159089

Hey,
I think this is what you are asking for:

body.trans-header #kad-mobile-banner {
    margin-top: 30px;
}

Ben

[Jesse]

Jesse

#159080

This reply has been marked as private.