[catwingz]

Hi,
I have a second site using this theme and a new set of questions. The url is here

— How can I make it so that the image in the Header Highlight is kept to no larger than the width of the content?

— I have a text widget in Header Right and can’t seem to change the font. My latest attenpt was

section#text-15 .widget_.widget_text .text-widget p {
font-family: 'Oswald', sans-serif;
}

— My client has the blog posting to the home page. He wants to know if it is possible to make it so that the featured image shows on the home page but not in the post.

— What do I need to do to make it so that the button for the promotion headline can be a ‘click to call’ for a phone number?

Thank you

[Pratik]

@catwingz:
1. Please add in the Header Highlight Content and then maybe we adjust it with CSS.

2. Try following code:

.sidebar-header-right p {
    font-family: 'Oswald', sans-serif;
}

— My client has the blog posting to the home page. He wants to know if it is possible to make it so that the featured image shows on the home page but not in the post.
To show Featured Images on Homepage but not on posts, it is possible. Since you have already added images on homepage, only issue would be removing it from single page right? For that, goto Appearance- Customize- Theme Options- Layout Options- Single Page/Post Image Layout , then select on Disable Option

— What do I need to do to make it so that the button for the promotion headline can be a ‘click to call’ for a phone number?
In Promotion Headline Link add following: tel:8773595319

Let me know if you have any issues.

[catwingz]

Hi Pratik,

1. The image is already there. I have tried it in several sizes, but since it automatically adjusts to the width of the screen I feel like I might be chasing it. Isn’t there some CSS that can place some limits on it?

2. I tried the code but the font remains the same.

4. This is a case of the solution to one problem causing another. Is there a way to set this up so it’s only for mobile? Otherwise it looks like I will need to stick with something a desktop browser will know what to do with.

Thank you

[Pratik]

@catwingz:

1. Ok got it. Add in following code:

@media screen and (min-width: 1280px){
   #header-highlights-content #large-featured-image img {
      width: 1280px;
   }
}

2. There is some error when adding CSS. This has been added:

.sidebar-header-right p {
    font-family: 'Oswald', sans-serif;
}

You need to add 'Oswald', sans-serif; instead of the given code.

4. If you want different for mobile and different for desktop, then you will need to go via different solution. Add two buttons and show one on desktop and one on mobile. You will need to do quite a bit of modification via child theme. If you are comfortable with using child theme, please let me know and maybe I can help you further.

Regards,
Pratik

[catwingz]

Hi Pratik,

The font changed and he is really happy with the banner now.

He says he definitely wants the phone number in the button, so I will set up a child theme. Please tell me what I need to do to get it so that it is different for mobile and desktop.

Thank you!

[Pratik]

Hi @catwingz,

It seems you do not need a child theme. Just do following:
1. Add a text widget in Promotion Headline Right Widget Area

2. Add following code in that Text Widget in ‘Text’ tab:

<a class="promotion-button mobile" href="tel:123456789">123456789</a>
<a class="promotion-button desktop" href="http://distresseddebt1.com/">123456789</a>

Here, you can make 123456789 to your number in tel:123456789. The 123456789 between and is text, whatever you write here, will be displayed as text. The desktop link http://distresseddebt1.com/ can be changed to anything you like as well.

2. Add following code in Appearance- Customize- Additional CSS box:

@media only screen and (max-width:768px) {
    #promotion-message .promotion-button.desktop{
        display: none;
    }
}

@media only screen and (min-width:768px) {
    #promotion-message .promotion-button.mobile{
        display: none;
    }
}

This should work. Let me know if you have trouble.

Regards,
Pratik

[Author]

Posts