Search Results for 'banner'

[Ben Ritner]

Ben Ritner

#43523

Hey,
I still do not see all the css I posted. Let me try again… add this to your custom css box:

.home-message {
  background-size: contain !important;
}
.home .infobanner {
  background-size: contain !important;
}

the recent posts widget uses images that are 80×50. That is how it’s designed. You can create a custom widget using a child theme and change the image dimensions if you like.

Ben

[Kenta]

Kenta

#43493

It worked perfectly at the production website, not at the local test website, as you can see at http://puresuiren-test.2-d.jp
The problem is the font-face that I wrote in the css seems not being applied to a Home page at the local test website, which looks like this http://puresuiren-test.2-d.jp/home-dammy/. This is the dummy page to show how is looks at the local test website as I couldn’t attach the image file here. All the other pages works just fine and look the same as the production website. Only the Home page looks different and seems the css code is not applied correctly.
Both the production and local test website should be in the same configuration and environment but their fonts look different.

CSS code that I wrote is as below.

————————————————————————————————————–
@font-face {
font-family: ‘Noto Sans Japanese’ !important;
font-style: normal !important;
font-weight: 100 !important;
src: url(‘../wp-includes/fonts/NotoSansJapaneseThin.eot’); /* IE9 Compat Modes */
src: url(‘../wp-includes/fonts/NotoSansJapaneseThin.eot?#iefix’) format(’embedded-opentype’), /* IE6-IE8 */
url(‘../wp-includes/fonts/NotoSansJapaneseThin.woff’) format(‘woff’), /* Modern Browsers */
url(‘../wp-includes/fonts/NotoSansJapaneseThin.ttf’) format(‘truetype’); /* Safari, Android, iOS */
}

@media (min-width: 1200px){
div.page-header.page-header{
padding-top: 200px !important;
}

div#pageheader.titleclass.kad-parallax{
height:800px ;
}

h1.kad-page-title,
.kadcaptiontitle{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 88px !important;
font-weight: 100 !important;
font-style: normal !important;
font-size: 45px !important;
}

h3,
h2{
font-family: ‘Noto Sans Japanese’!important;
line-height: 40px !important;
font-weight: 300 !important;
font-style: normal !important;
font-size: 30px !important;
}

h5,
p,
a{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 40px !important;
font-weight: 100 !important;
font-style: normal !important;
}

body{
font-family: ‘Noto Sans Japanese’ !important;
font-weight: 100 !important;
font-style: normal !important;
}
h1.kad-page-title,
.kadcaptiontitle{
padding-top:170px;
}
}

@media (min-width: 992px){
h1.kad-page-title.home-page-title,
.kadcaptiontitle {
font-size: 40px !important;
}

div.page-header.page-header{
padding-top: 200px !important;
}

div#pageheader.titleclass.kad-parallax{
height:800px ;
}

p{
line-height: 20px !important;
font-size: 18px !important;
}

h1.kad-page-title,
.kadcaptiontitle{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 88px !important;
font-weight: 100 !important;
font-style: normal !important;
font-size: 45px !important;
}

h3,
h2{
font-family: ‘Noto Sans Japanese’!important;
line-height: 40px !important;
font-weight: 300 !important;
font-style: normal !important;
font-size: 30px !important;
}

h5,
p,
a{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 40px !important;
font-weight: 100 !important;
font-style: normal !important;
}

body{
font-family: ‘Noto Sans Japanese’ !important;
font-weight: 100 !important;
font-style: normal !important;
}
h1.kad-page-title,
.kadcaptiontitle{
padding-top:170px;
}
}

@media (min-width: 768px){
h1.kad-page-title.home-page-title,
.kadcaptiontitle {
font-size: 40px !important;
}

div.page-header.page-header{
padding-top: 200px !important;
}

div#pageheader.titleclass.kad-parallax{
height:800px ;
}

p{
line-height: 20px !important;
font-size: 18px !important;
}
h1.kad-page-title,
.kadcaptiontitle{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 88px !important;
font-weight: 100 !important;
font-style: normal !important;
font-size: 45px !important;
}

h3,
h2{
font-family: ‘Noto Sans Japanese’!important;
line-height: 40px !important;
font-weight: 300 !important;
font-style: normal !important;
font-size: 30px !important;
}

h5,
p,
a{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 40px !important;
font-weight: 100 !important;
font-style: normal !important;
}

body{
font-family: ‘Noto Sans Japanese’ !important;
font-weight: 100 !important;
font-style: normal !important;
}
h1.kad-page-title,
.kadcaptiontitle{
padding-top:170px;
}
}

@media (max-width: 767px){
div.page-header.page-header,
div.page-header{
padding-top: 0px !important;
}

div#pageheader.titleclass.kad-parallax{
height:400px ;
}

p{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 30px !important;
font-size: 13px !important;
}
h1.kad-page-title,
.kadcaptiontitle{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 40px !important;
font-weight: 100 !important;
font-style: normal !important;
font-size: 28px !important;
}

h3,
h2{
font-family: ‘Noto Sans Japanese’!important;
line-height: 40px !important;
font-weight: 300 !important;
font-style: normal !important;
font-size: 20px !important;
}

h5,
a{
font-family: ‘Noto Sans Japanese’ !important;
line-height: 40px !important;
font-weight: 100 !important;
font-style: normal !important;
font-size:17px !important;
}

body{
font-family: ‘Noto Sans Japanese’ !important;
font-weight: 100 !important;
font-style: normal !important;
}
h1.kad-page-title,
.kadcaptiontitle{
padding-top:80px;
}

#pg-3373-1 div.siteorigin-panels-stretch.kt-panel-row-full-stretch.panel-row-style{
height: 400px !important;
background-position: center center !important;
}
#thelogo div.kad-standard-logo.kad-lg,
#thelogo div.kad-lg.kad-standard-logo-tranbg{
width:120px !important;
}
div.kad-navbtn.mobileclass.clearfix{
padding-top:15px !important;
color:white !important;
font-size:large !important;
}
}

.testimonialbottom p{
font-size:13px !important;
color:white;
}

.testimonialbox p.p1{
font-size:14px !important;
}

.widget-title:after {
width: 80px;
margin: 10px auto;
background-color: #FFF;
}

.boxi1 {
background:#f9f9f9;
padding:15px 0 1px;
text-align:center;
border-radius:5px;
margin-bottom:20px;
}

.boxi1 div {
font-size:28px;
}

.kad-header-style-basic .kad-primary-nav ul.sf-menu ul li a {
font-size: 14px !important;
}

.boxi1 p {
margin:5px 0 0;
min-height:40px;
}

div.postclass.pageclass.clearfix {
background-color: #ffffff;
}

#topbar .top-menu-search-btn.collapsed,
#topbar .top-menu-cart-btn.collapsed,
#topbar .top-menu-search-btn,
#topbar .top-menu-cart-btn {
font-size:18px;
}

aside.col-lg-3.col-md-4 {
border-style: ridge;
border-color: #c1c1c1;
border-width: 1px;
margin-top: 29px;
}

#pg-2863-0,
#pg-2863-3,
#pg-2863-5,
#pg-2863-7,
#pg-2863-9,
#pg-2863-11,
#pl-2863 .panel-grid-cell .so-panel {
margin-bottom: 5px;
}

div#pg-2863-3.panel-grid{
margin-bottom:0px;
}

h1.product_title.entry-title,
p.price {
color:#bd83cb;
}

div.summary.entry-summary.postclass{
background-color: ghostwhite;
}

#HeaderBelow.cf
{
text-align:center;
}

#HeaderBelow h4
{
color:#800080;
}

div#pg-3167-4.panel-grid #panel-3167-4-0-0 div.panel-widget-style h3.widget-title{
color:white !important;
}

.infobanner{
border-radius:10px !important;
box-shadow:3px 3px 3px rgba(0,0,0,0.5)!important;
}

#pg-3373-5 div.kad_img_upload_widget img{
border-radius:10px;
box-shadow:3px 3px 3px rgba(0,0,0,0.5)!important;
}

#pg-3373-15 div.testimonialbottom p{
color:white !important;
font-size:13px !important;
margin-right:31px !important;
}

#pg-3373-15 div.testimonialbox {
background:#FFFBB6;
}

#pg-3373-15 div.lipbg.kad-arrow-down {
border-left: 16px solid transparent;
border-right: 16px solid transparent;
border-top: 16px solid #FFFBB6;
}

#pg-3373-18 div.kad_img_upload_widget img,
#pg-3373-19 div.kad_img_upload_widget img,
#pg-3373-20 div.kad_img_upload_widget img,
#pg-3373-21 div.kad_img_upload_widget img{
border-radius:20px;
}

————————————————————————————————————–

[Greg]

Greg

#43347

Hi all,has your footer copyright display disappeared. The issue is the Google Badge I placed on my homepage.
Not only does it affect the Hompage but it also crashed the Contact Form7 Plugin as well as affecting the slide banner.
Customers where unable to see my slide banner but as I was logged in as admin I did not see this.

I found a solution by making the Google Plus Badge just a picture simply by- print screen-paste into Paint-crop Google Badge logo,save as picture JPEG.
I then loaded the picture on the homepage as an Image using Image Widget and then linked the Image back to my Google Plus Page.
Now when customers click the Google badge picture it just links back to my google.
Hopefully this can be fixed with an update from Kadence Themes.
The Google Website Badge certainly has the ability to create Havoc and break plugins. I am sure there where more crashes caused by the Google Badge such as my shipping Plugin.

[Greg]

Greg

#43347

Hi all,has your footer copyright display disappeared. The issue is the Google Badge I placed on my homepage.
Not only does it affect the Hompage but it also crashed the Contact Form7 Plugin as well as affecting the slide banner.
Customers where unable to see my slide banner but as I was logged in as admin I did not see this.

I found a solution by making the Google Plus Badge just a picture simply by- print screen-paste into Paint-crop Google Badge logo,save as picture JPEG.
I then loaded the picture on the homepage as an Image using Image Widget and then linked the Image back to my Google Plus Page.
Now when customers click the Google badge picture it just links back to my google.
Hopefully this can be fixed with an update from Kadence Themes.
The Google Website Badge certainly has the ability to create Havoc and break plugins. I am sure there where more crashes caused by the Google Badge such as my shipping Plugin.

[Greg]

Greg

#43346

Hi Ben,Yes you are correct,the issue is the Google Badge I placed on my homepage.
Not only does it affect the Hompage but it also crashed the Contact Form7 Plugin as well as affecting the slide banner.
Customers where unable to see my slide banner but as I was logged in as admin I did not see this.

I found a solution by making the Google Plus Badge just a picture simply by- print screen-paste into Paint-crop Google Badge logo,save as picture JPEG.
I then loaded the picture on the homepage as an Image using Image Widget and then linked the Image back to my Google Plus Page.
Now when customers click the Google badge picture it just links back to my google.
Hopefully this can be fixed with an update from Kadence Themes.
The Google Website Badge certainly has the ability to create Havoc and break plugins. I am sure there where more crashes caused by the Google Badge such as my shipping Plugin.

[Henry]

Henry

#43207

Ben,

Once again thank you for such quick responses! I pasted it on my home page in the body of page, but it’s showing up between my site wide banner and my home icon menu. Is there a way to have it at the bottom of my page?

[Ben Ritner]

Ben Ritner

#43133

You can, can’t really recommend this but you can try, the spacing will be really hard since your using the virtue: image menu item which has a set height and isn’t design for this:

div#pg-188-4 .panel-grid-cell {
    width: 25% !important;
    float: left !important;
    padding-left: 15px !important;   
    padding-right: 15px !important;
}
div#pg-188-4 .panel-grid-cell .infobanner {
    background-size:contain !important;
}

Ben

[Ben Ritner]

Ben Ritner

#42890

The menus aren’t supposed to work like an image. They were designed to have text over the image. You can force the whole image to stay visible with this css:

.home .infobanner {
  background-size: contain !important;
}

Or you can hide on mobile with this:

@media (max-width: 768px){
.home .homecontent {display:none;}
}

Ben

[Jane]

Jane

#42618

Ben or Hannah,

I just did this and it removed the excerpt from the homepage as well. Is there a short code for it to remove the excerpt from the Category pages only? And can I please have the short code to align them nicely?

Also, I just added some banner ads on the sidebar and footer and it seems to affect the mobile view. My blogs and ads aren’t showing up on mobiles. Please advise a solution.

http://www.twopeasinthepantry.com

[Jane]

Jane

#42127

I used Ad Inserter and a few others but they all have the same problem. I definitely want this site to be mobile friendly so won’t change the sidebar size. I emailed the publishing agency who provided the banner and asked if I could resize it …no response yet. I’ll ask the plugin author as well.

New questions:

1. The pagination on my homepage is not showing up. At one point, we were doing something and it got removed. I checked the custom CSS section and there is no code to remove this. How can I get it back without messing up what I have now? http://www.twopeasinthepantry.com

2. How do I extend the length of the dividing line between the homepage slider and the Recent Posts to align with the Recent Posts section? The line appears shorter.

[paul]

paul

#42122

Hi Hannah.
Could you please do the same for me with my home page. I want the tabs very close to the banner as well. Here is a link.
https://www.frontlinecanvasart.com/
Thanks
Kind regards, Paul

[paul]

paul

#42116

Hi Hannah.
No, this is nor working. Its the large Image at the top of the page. With the smaller image next to it. I would like them much closer to the black banner.
Kind regards, Paul

[paul]

paul

#42110

Hello guys.
I have a table in my product description on my woo product pages. Could you please help me move it up so that it is just under my banner. I want virtually no gap between the images and the banner. Here is a link to a page. *Login to see link Thanks
Kind regards, paul

[paul]

paul

#42110

Hello guys.
I have a table in my product description on my woo product pages. Could you please help me move it up so that it is just under my banner. I want virtually no gap between the images and the banner. Here is a link to a page. *Login to see link Thanks
Kind regards, paul

[Jane]

Jane

#42003

Thanks Hannah but looks like I have some new issues:

1. The banner ads are sizes 160×600 skyscraper and 300×250 medium rectangle…both don’t fit into the sidebar. How can I solve this?

2. On the sidebar under the Related Recipes widget: http://www.twopeasinthepantry.com/recipe/chicken-lettuce-wraps/ …why is there a 3rd line behind the image? The other widgets don’t have this issue. How can I remove it?

[Jane]

Jane

#41915

Hi Ben/Hannah,

1. I am trying to add a banner ad script into the sidebar by pasting it onto the visual editor and text widget but it doesn’t work. Not sure if they are even the right place to go. Can you please help?

2. My primary navigation is not showing up on mobile phones or iPads. Where can I enable this?

http://www.twopeasinthepantry.com

Jane

[Jane]

Jane

#41915

Hi Ben/Hannah,

1. I am trying to add a banner ad script into the sidebar by pasting it onto the visual editor and text widget but it doesn’t work. Not sure if they are even the right place to go. Can you please help?

2. My primary navigation is not showing up on mobile phones or iPads. Where can I enable this?

http://www.twopeasinthepantry.com

Jane

[Hannah]

Hannah

#41829

Hey lee,
I’m seeing this in your css:

@media (max-width: 992px) {
.stickyheader #kad-banner {
  width: 100%;
  z-index: 1120;
  left: 0;
  position: fixed !important;
}
}

Did you add that? If so, just needs to be removed.

Hannah

[Hannah]

Hannah

#41758

Hey Sabrina, Ben added an extra bracket. Try this:

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .homeitemcount1 .infobanner {
        background: url('http://www.coconut-couture.com/wp-content/uploads/2015/05/imagemenuoutfits.jpg') !important;
        background-size: cover !important;
    }
    .homeitemcount2 .infobanner {
        background: url('http://www.coconut-couture.com/wp-content/uploads/2015/05/imagemenutravel.jpg') !important;
        background-size: cover !important;
    }
}

Hannah

[Hannah]

Hannah

#41701

Hey Tasha,
I think you’re better off using Bens CSS then adding this as well:

.infobanner {
  margin-top: 20px;
}

Hannah

[Ben Ritner]

Ben Ritner

#41647

So actually just use this css:

.infobanner {
  margin: 0;
}

Ben

[Ben Ritner]

Ben Ritner

#41643

What mobile device are you testing on?

Try adding this css:

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { {
    .homeitemcount1 .infobanner {
        background: url('http://www.coconut-couture.com/wp-content/uploads/2015/05/imagemenuoutfits.jpg') !important;
        background-size: cover !important;
    }
    .homeitemcount2 .infobanner {
        background: url('http://www.coconut-couture.com/wp-content/uploads/2015/05/imagemenutravel.jpg') !important;
        background-size: cover !important;
    }
}

Ben

[Hannah]

Hannah

#41232

Hi,
There’s not really a set size. It really depends on your image and the look you want. Try scaling down to something like 2000×1200. You could probably go smaller than that if you wanted.
You can add a banner in Theme Options > Main Settings > Site Wide Banner

Hannah