Search Results for 'banner'

[Ben Ritner]

Ben Ritner

#117254

Couple reasons why this type of layout works so much better in pinnacle. The main is that pinnacle is designed to have two header styles depending on if the header has stuck or not. So you can have a logo for when the it’s over the image and a different one for when the logo stuck to the top of the page while your scrolling. This kind of stuff just can’t be done the same in virtue because the themes were designed with this difference. http://themes.kadencethemes.com/pinnacle-premium/

You can add css like hannah suggests but overall this isn’t going to be as clean.

.headerclass {
    background: transparent;
    position:absolute;
}
#kad-banner-sticky-wrapper {
    height:0 !important;
}

[Jacob]

Jacob

#117247

Hey Hannah,

That’s odd, it all seems to work for me. All my plugins are up to date as well as my theme. However in terms of custom CSS this is what I’ve added…

” .footernav ul li a:hover {
color: white;
}
.containerfooter .menu li a {
background: transparent !important;
}
.product_item.hidetheaction .add_to_cart_button, .product_item.hidetheaction a.button {
display: none;
}
.topbar_social {
float:right;
}
.kad-topbar-left {
width:100%;
}
i.-icon-cart2 {
display: none;
}
.topbar_social a.topbar-icon-cart2 {
padding-right: 0px;
}
.kad-cart-total a.cart-contents {
padding-left: 5px;
}
#containerfooter h4 {
font-size: 21px;
font-family: ‘Amiri’;
}
.footerclass {
font-size: 18px;
font-family: ‘Amiri’;
}
.woocommerce-demo-store #kad-banner {
margin-top: 40px;
} ”

I’ve tried playing around with certain plugins but I didn’t notice anything. I’ll try to give it a go again.

[Kevin]

Kevin

#116732

Hey,

This color is set specifically in Theme Options> Basic Styling> Primary Hover color.

If you would only like to set the image menu hover color to that, you could with this CSS:

.infobanner .home-message:hover {
    background: rgba(40, 78, 56, 0.5);
}

All custom CSS should be placed into Theme Options> Custom CSS.

Let me know if either option works for you!

-Kevin

[Bernat]

Bernat

#116478

I have created a custom page and i use the shortcode for placing a slider on it (kadence slider, rev slider or whatever…)

In the custom page the banner appears just under the tittle of that page. Is there any way to put it at the top? I would like that the slider appears as it appears in the category pages, first the slider and then the tittle.

[Bernat]

Bernat

#116478

I have created a custom page and i use the shortcode for placing a slider on it (kadence slider, rev slider or whatever…)

In the custom page the banner appears just under the tittle of that page. Is there any way to put it at the top? I would like that the slider appears as it appears in the category pages, first the slider and then the tittle.

[Danielle]

Danielle

#116129

Hello,

So, I’m having a weird problem exclusively with mobile phones and tablets. Almost every page has a Kadence Pro banner at the top which looks great, very workable. However, “sometimes” / “often” when using mobile phones and tablets, the banner loads with a massive amount of white space above and below. Sometimes it kicks in and formats correctly, sometimes not. This often happens the first time I view the site on a mobile browser, then afther that it seems to work correctly for awhile.

Any ideas? I have been using alot of CSS, perhaps that’s the issue? I have posted said CSS below.

.home_blog .hometitle {
display:none;
}
.widget-title:after {
display:none;
}
.postid-523 .page-header h1.product_page_title.entry-title {
display: none;
}
.postid-44 .page-header h1.product_page_title.entry-title {
display: none;
}
p{
margin-bottom: 20px;
}
.kad-youtube-shortcode {
margin: 0 auto;
}
.kt-ratio-slider .kad-slider .kad-slide>img.kt-ratio-img {
top: 50% !important;
margin-top: 0 !important;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
}
.connect .postclass.pageclass.clearfix.entry-content {
padding-bottom: 0 !important;
padding-top: 0 !important;
}

Any ideas?

Thank you in advance!

Mark

[Danielle]

Danielle

#116129

Hello,

So, I’m having a weird problem exclusively with mobile phones and tablets. Almost every page has a Kadence Pro banner at the top which looks great, very workable. However, “sometimes” / “often” when using mobile phones and tablets, the banner loads with a massive amount of white space above and below. Sometimes it kicks in and formats correctly, sometimes not. This often happens the first time I view the site on a mobile browser, then afther that it seems to work correctly for awhile.

Any ideas? I have been using alot of CSS, perhaps that’s the issue? I have posted said CSS below.

.home_blog .hometitle {
display:none;
}
.widget-title:after {
display:none;
}
.postid-523 .page-header h1.product_page_title.entry-title {
display: none;
}
.postid-44 .page-header h1.product_page_title.entry-title {
display: none;
}
p{
margin-bottom: 20px;
}
.kad-youtube-shortcode {
margin: 0 auto;
}
.kt-ratio-slider .kad-slider .kad-slide>img.kt-ratio-img {
top: 50% !important;
margin-top: 0 !important;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
}
.connect .postclass.pageclass.clearfix.entry-content {
padding-bottom: 0 !important;
padding-top: 0 !important;
}

Any ideas?

Thank you in advance!

Mark

[Ben Ritner]

Ben Ritner

#116077

Hey,
You would just add this css:

.infobanner {
    background-size: cover !important;
}

Ben

[webpublication ES]

webpublication ES

#116043

Hello,
I have created a Home Image Menu and would like the background images of the menu elements to cover the element.
The problem is when I write in the custom css:
.infobanner{
background-size:cover
}

it is canceled because the element has an inline style of
<strong>background</strong>: url(image_url) center center no-repeat;

the background css property overriding the background-size property.

Is there a solution where I do not need to hack the theme?
If I need to hack the theme (well I would do a child theme first) which file do I have to change to get the job done?

Thank you

[webpublication ES]

webpublication ES

#116043

Hello,
I have created a Home Image Menu and would like the background images of the menu elements to cover the element.
The problem is when I write in the custom css:
.infobanner{
background-size:cover
}

it is canceled because the element has an inline style of
<strong>background</strong>: url(image_url) center center no-repeat;

the background css property overriding the background-size property.

Is there a solution where I do not need to hack the theme?
If I need to hack the theme (well I would do a child theme first) which file do I have to change to get the job done?

Thank you

[Ben Ritner]

Ben Ritner

#116035

Hey, Thanks for posting. I have an update coming out today for issue 1.

If you need something immediate add this css in your theme options > advanced settings:

.admin-bar #kad-banner {
    transform: none;
    position: static;
} 

For issue 2 I keep refreshing the page and not seeing what you have posted in the image. How can I reproduce?

Ben

[Nicolae]

Nicolae

#115994

Hello,

I had the following script

<?php if(function_exists('ditty_news_ticker')){ditty_news_ticker(534);} ?>

included in header.php like this

<?php endif; ?>
<?php if (!empty($virtue_premium['virtue_banner_upload']['url'])) { ?>
<div class="container virtue_sitewide_banner"><div class="virtue_banner">
<?php if (!empty($virtue_premium['virtue_banner_link'])) { ?> <a href="<?php echo esc_url($virtue_premium['virtue_banner_link']);?>"> <?php }?>
<?php $alt_text = get_post_meta($virtue_premium['virtue_banner_upload']['id'], '_wp_attachment_image_alt', true); ?>
<img src="<?php echo esc_url($virtue_premium['virtue_banner_upload']['url']); ?>" width="<?php echo esc_attr($virtue_premium['virtue_banner_upload']['width']); ?>" height="<?php echo esc_attr($virtue_premium['virtue_banner_upload']['height']); ?>" alt="<?php echo esc_attr($alt_text);?>" /></div>
<?php if (!empty($virtue_premium['virtue_banner_link'])) { ?> </a> <?php }?>
</div> <?php } ?>
<?php do_action('kt_after_header_content'); ?>

<?php if(function_exists('ditty_news_ticker')){ditty_news_ticker(534);} ?>

</header>

Now that the header.php is empty, how to add this ticker script in same position as before?

Thank you,

Nicolae

[Nicolae]

Nicolae

#115994

Hello,

I had the following script

<?php if(function_exists('ditty_news_ticker')){ditty_news_ticker(534);} ?>

included in header.php like this

<?php endif; ?>
<?php if (!empty($virtue_premium['virtue_banner_upload']['url'])) { ?>
<div class="container virtue_sitewide_banner"><div class="virtue_banner">
<?php if (!empty($virtue_premium['virtue_banner_link'])) { ?> <a href="<?php echo esc_url($virtue_premium['virtue_banner_link']);?>"> <?php }?>
<?php $alt_text = get_post_meta($virtue_premium['virtue_banner_upload']['id'], '_wp_attachment_image_alt', true); ?>
<img src="<?php echo esc_url($virtue_premium['virtue_banner_upload']['url']); ?>" width="<?php echo esc_attr($virtue_premium['virtue_banner_upload']['width']); ?>" height="<?php echo esc_attr($virtue_premium['virtue_banner_upload']['height']); ?>" alt="<?php echo esc_attr($alt_text);?>" /></div>
<?php if (!empty($virtue_premium['virtue_banner_link'])) { ?> </a> <?php }?>
</div> <?php } ?>
<?php do_action('kt_after_header_content'); ?>

<?php if(function_exists('ditty_news_ticker')){ditty_news_ticker(534);} ?>

</header>

Now that the header.php is empty, how to add this ticker script in same position as before?

Thank you,

Nicolae

[Ben Ritner]

Ben Ritner

#115904

Just so you are aware the pinnacle theme was build for this kind of style.

You can add css like this through. might be a little more what your thinking:

.home #kad-banner {
    position: absolute;
    width: 100%;
    background: rgba(255, 255, 255, 0.5);
}

[Ben Ritner]

Ben Ritner

#115870

add this css:

#kad-banner {
    transform: none;
}

Ben

[Ben Ritner]

Ben Ritner

#115804

Hey Dan,

I feel i’m missing some things but I’ll see if I can help.

1. On your FFF Catering you are adding this css in your custom css box:

@media (min-width: 992px) {.boxed header.banner.headerclass {
    position: absolute; top: 1; left: 0; width: 100%; margin: 0;
}
.boxed .contentclass {
padding-top: 249px;
}
}

Adding a padding-top: 249px; is what is causing your large gap. That would have caused a large gap on any version of the theme so I must be missing something? Why are you adding that?

You also asked about full-screen-width… But you have set the main style to “boxed” in your theme options > main settings. First option. With that on the slider wouldn’t be fullwidth? Unless you did a forced fullwidth inside your slider settings.

Your Dave Romeo site. I see videos playing fine in safari…

But I do see that your getting this error from google: XMLHttpRequest cannot load https://googleads.g.doubleclick.net/pagead/id. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://www.youtube-nocookie.com&#8217; is therefore not allowed access.

It doesn’t look like your using a theme method to embed videos? So I think you need to talk with whatever plugin your using as nothing on the theme has changed in terms of how videos work but regardless your not even using videos that are embedded through the themes methods.

So to progress from here can you tell me the point of you adding this css: padding-top: 249px; because I’m sure I can get you something that would work better?

Ben

[Hugo]

Hugo

#115248

Hi Ben, thanks for your help. Please, could you validate my updated snippet, considering the following:

1/ The category id is different for each language.
2/ The banner is required for tags archive pages also.

Here is my update:

// BEGIN Add a banner for each blog post category (on single posts, category and tags archive pages)
function kt_custom_category_slider() {
	if(is_category('37') || (is_singular('post') && in_category('37') )  || (is_tag() && in_category('37') ) ) {
		if(pll_current_language() == 'en') {
			echo do_shortcode('[kadence_slider_pro id="15"]');
		}
	} else if(is_category('43') || (is_singular('post') && in_category('43') )  || (is_tag() && in_category('43') ) ) {
		if(pll_current_language() == 'fr') {
			echo do_shortcode('[kadence_slider_pro id="6"]');
		}
	} else if(is_category('41') || (is_singular('post') && in_category('41') )  || (is_tag() && in_category('41') ) ) {
			echo do_shortcode('[kadence_slider_pro id="16"]');
	}
}
add_action('kt_header_after', 'kt_custom_category_slider');
// END Add a banner for each blog post category (on single posts, category and tags archive pages)

[Hugo]

Hugo

#115217

This reply has been marked as private.

[Hugo]

Hugo

#115195

Hi Kadence, I’m trying to find the better way to set an After Header Banner for a category of posts only. This banner may be shown for all the single posts and the archives page templates for this category only. I made a banner for each language with Kadence Slider Pro, so I have a shortcode for each language.

I successfully did it but with a lot of CSS. I really would like to heard from the Kadence Team what could be a cleanest way. I’m considering to code it in php in the child theme templates, but I’m not sure how to do it, as I need to keep it user-friendly for the webmaster.

What I did for now (with a lot of css):

I added all the 3 shortcodes* (for the 3 languages) to the Sitewide after Header Shortcode (in Theme Options > Main Settings)
And I hid each banner using css for the other blog categories and the pages where I don’t want this banner.

*Note: I currently have the Virtue Premium version 3.7.4 installed (I will update soon) and the Sitewide after Header Shortcode string isn’t available for translation in the Polylang table. I didn’t find into the theme changelog or into the version 3.8.6 wpml-config.xml if that string was recently added for translation. If not, please could you tell what I need to add to wpml-config.xml into my child theme?

Thanks in advance

[Hugo]

Hugo

#115195

Hi Kadence, I’m trying to find the better way to set an After Header Banner for a category of posts only. This banner may be shown for all the single posts and the archives page templates for this category only. I made a banner for each language with Kadence Slider Pro, so I have a shortcode for each language.

I successfully did it but with a lot of CSS. I really would like to heard from the Kadence Team what could be a cleanest way. I’m considering to code it in php in the child theme templates, but I’m not sure how to do it, as I need to keep it user-friendly for the webmaster.

What I did for now (with a lot of css):

I added all the 3 shortcodes* (for the 3 languages) to the Sitewide after Header Shortcode (in Theme Options > Main Settings)
And I hid each banner using css for the other blog categories and the pages where I don’t want this banner.

*Note: I currently have the Virtue Premium version 3.7.4 installed (I will update soon) and the Sitewide after Header Shortcode string isn’t available for translation in the Polylang table. I didn’t find into the theme changelog or into the version 3.8.6 wpml-config.xml if that string was recently added for translation. If not, please could you tell what I need to add to wpml-config.xml into my child theme?

Thanks in advance

[Ben Ritner]

Ben Ritner

#114774

Hey,
with the basic shrinking header this is how it’s set up to work.

For the look your asking about you would want to use the standard header.

But you can also use this css work around. First thing though is you need to turn off the mobile header. That will not have the word menu.

Next you need to remove this css:

.kad-header-left {
    width: 40%;
}

Then add all this custom css:

.icon-menu:before {
    content: "e2ac";
    font-family: virtue_icons !important;
}
@media (max-width: 991px){
.stickyheader #kad-banner #logo a, .stickyheader #kad-banner #logo a #thelogo, .stickyheader #kad-banner #kad-shrinkheader {
    height:auto !important;
    line-height:inherit !important;
}
.kad-header-right {
    float: none;
    width: 100%;
}
.kad-header-left {
    width: 100%;
    float: none;
}
header.mobile-stickyheader .nav-trigger .nav-trigger-case {
    position: static;
    width: 100%;
}
.mobile-stickyheader .nav-trigger-case .kad-menu-name {
    display: block;
}
}

Ben

[Ben Ritner]

Ben Ritner

#114554

Those are not what we would call “banners” so thats where there is confusion.

You need a plugin to do that.

Ben

[IOANA]

IOANA

#114550

http://fittvolt.com/

yes like a siderbar….

see as example https://www.ledhut.co.uk/

those 2 small banners in the right side: IN THE TRADE? Need help

[Hannah]

Hannah

#114547

Hey,
There isn’t an option for this. You can use a sidebar and set a background for your sidebar with css. Would that work for you? Otherwise there’s the sitewide banner option in Theme Options > Main Settings.

Hannah

[IOANA]

IOANA

#114545

dear all

how can i put Sitewide Banner on sides of homepage and on each product page

thanks

claude

[IOANA]

IOANA

#114545

dear all

how can i put Sitewide Banner on sides of homepage and on each product page

thanks

claude