Contact number active for mobile

How to add hyperlink for this phone number so that on mobile version the viewer can click on number and make a call? I was trying to add


I added <h3 class="themecolor" style="font-size:40px" href="tel:+37129360960">+371 2 936 09 60</h3>

How to integrate <a> element correctly?

Comments

  • Hello,

    Please, try the following instead:

    <a href="tel:+37129360960"><h3 class="themecolor" style="font-size:40px">+371 2 936 09 60</h3></a>
    

    Thanks

  • yes, this worked, thank you. Another issue with the same area I have is on mobile it collapses like in the picture attached. How to fix this issue?


  • This number has a font-size set with inline CSS.

    You can add a class to this h3 tag, decrease its font size and increase line height for mobile display with the following CSS code:

    @media only screen and (max-width: 767px){
       .yourClass{
          font-size: 30px;
          line-height: 30px;
       }
    }
    

    Thanks

  • thank you. How to make text on the red button smaller? on mobile vers

    ion they are huge now compared to phone number

  • Ok, I know how to do that, but please precise how to change size for button text and to which size for this text?

    [button title="SŪTĪT ZIŅU" link="https://new.agma.lv/produkti/#sazinies" color="#C81624" font_color="#fff" size="1" size="2" class=".numurs"]


    Here I see size 1 and size 2. Not sure what it means and how to make it smaller. In setting there are no tab/field for text size.

  • Sizes for buttons are 1-4, where 1 stands for the smallest one, and 4 stands for the largest one.

    However, if you want to change the font size only, without changing the button size, you can add a class for your shortcode and write CSS for it.

    Remember that only classes in the Custom CSS field have dots at the beginning.


    Thanks

  • I tried as you recommended (duplicated contact us section and made one visible for mobile only and the other - for tablet and desktor) however text font site is not changing for mobile version after creating a class and adding custom css. I also just discovered that when I add Custom CSS to this page as you suggested and when I close it and reopen again - CSS code disappears. It again shows blanc field even though I saved changes I made


  • I had noticed a similar issue when I was adding your website content to the WP editor.

    Some resources have to be blocked by your server because I have copied your entire home page to my environment, and I did not have the problems you mentioned.

    It is also not a plugin-related issue because you are using only supported ones, and I had the same package.

    Please, contact your hosting provider and ask about this problem, and say that this problem makes your website not fully functional.


    Thanks

  • ok, I will. Thank you detailed info.

  • Hi! I created 2 identical sections of Contacts info (one for mobile only and one for other formats) as you suggested, added to the mobile only section a css class "numurs" and added CSS:

    numurs{

    font-size: 40px!important;

    }

    But still I am not able to minimize the font size of text "SŪTĪT ZIŅU" on red button.


    Could you please help?

  • You forgot about the dot at the beginning of the class name.

    When you add it, all should be fine. It should look like that:

    .numurs{
    font-size: 40px!important;
    }
    

    Thanks

  • Hi, still unfortunately no changes for the font size in the button.

  • Maybe you do not see the changes because the value you choose is close to the original one.

    Please, see the following screenshot:

    Your custom class and CSS for it are visible in the website source, and when I changed the value, the font decreased as well.


    Thanks

  • all clear now, thank you.

Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.