Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • January 12, 2016 at 2:02 am #563592
    jimsgr0up

    Hello, I would like to add a click to call image on the right-hand side of the header area, just like on this website. http://www.jimsbathresurfacing.com.au/
    (the Call us for a free quote today! 131 546 part on the above page.)
    Could you please let me know how to do this? Thank you.
    – Fei

    January 12, 2016 at 2:17 am #563596
    Elliott

    Hi jimsgr0up!

    Do this, http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/, to add a widget area to your header. You can then drag a text widget to it and insert whatever you want to display in your header.

    Cheers!
    Elliott

    January 12, 2016 at 3:14 am #563637
    jimsgr0up

    Hi Elliott,
    Thanks you. That really helped. Now I can have the phone number to show on the place I wanted.
    But there is another small issue. When I view the page on a mobile device, the phone number overlap with the logo.
    Here is an example of the screenshot I took from my test website. http://www.jimsbathresurfacing.com.au/images/Screenshot_1.png

    Is there any way to fix this? Preferably, I would like the widget to show under the logo on mobile devices.

    Thanks again for your quick response, that was much appreciated.

    Regards,
    Fei

    January 13, 2016 at 4:06 am #564301
    Elliott

    Hey!

    It looks like you disabled the responsive setting. Go ahead and turn that back on so we can check.

    Best regards,
    Elliott

    January 14, 2016 at 1:26 am #565100
    jimsgr0up

    Hi Elliott,

    Sorry I couldn’t find the place to turn on the responsive setting. Could you let me know where it is?
    I haven’t change the default Enfold Child Theme settings except making the General Styling -> Select a predefined color scheme to be “Boxed Orange”.

    Here is a screenshot of my header setting page from the backend.

    Thank you Elliott.

    Kind Regards,
    Fei

    January 15, 2016 at 3:59 am #565885
    Elliott

    Hey!

    Hmm, well I took a closer look and it doesn’t look like your using Enfold now. Are you sure you have Enfold activated?

    Best regards,
    Elliott

    January 19, 2016 at 1:04 am #567494
    jimsgr0up

    Hi Elliott,

    Sorry, I rolled back to the old Joomla website last Wed because the site is not ready.
    I have replaced the old Joomla site with the WordPress site again this morning.
    I still couldn’t find the responsive settings in the Enfold setting page, but I tried to use the following code to hide the phone number on small screen sizes.

    @media only screen and (max-width: 767px) {
    #text-3 {display:none;}
    }

    Ideally I would like to show the phone number under the logo on small screens, but I didn’t manage to do that. So I hide it.
    If you know how to make the phone number to show under the logo on small screens, could you let me know how to do that? Thank you.

    Kind Regards,
    Fei

    • This reply was modified 9 years, 2 months ago by jimsgr0up.
    January 19, 2016 at 8:26 am #567682
    Rikard

    Hi,

    You can probably get it to fit by making the font smaller, something like this:

    @media only screen and (max-width: 767px) {
#text-3 p {
font-size: 14px;
}
}

    The number is an image though, why not just use text? You can target the image using this if you still want to use it:

    @media only screen and (max-width: 767px) {
#text-3 p img {
your code here
}
}

    Regards,
    Rikard

    January 21, 2016 at 3:01 am #569076
    jimsgr0up

    Thanks Rikard,

    I will just hide it on mobile devices. :)

    Thank you and Elliott in answering all my questions. That was much appreciated.

    Kind Regards,
    Fei

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Extra HTML content on the right-hand-side of the header area’ is closed to new replies.