Adding a "Call Us" button etc. for...

User 2699991 Photo


Registered User
5,305 posts
Online Now

Melissa Rhiannon wrote:
Wayan Jaya wrote:
Melissa Rhiannon wrote:
<a href="tel:XXXXXXXXXX"><img src="PHONE ICON - CALL US!.jpg"></a>

Does it look like it will fit well and work, if I figure what kind of element will work for it?

Thanks!

Melissa


It will work with any of the link elements


Thanks Wayan. But I tried it and it doesn't pick up the jpg image.

Insert a picture link where you want the image to be. Choose "local image" bring the image into your resources when it is in choose select. Then type the call:xxxxxx in the href for the image
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/
User 2699991 Photo


Registered User
5,305 posts
Online Now

Sorry just noticed the link should be
in the href thingy for the image link = "tel:1234567890" (not "call")
in the title thingy for the link image "Call us " (optional )
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/
User 2699991 Photo


Registered User
5,305 posts
Online Now

Melissa Rhiannon wrote:
Wayan Jaya wrote:
And your site looks ok on my mobile devices


It looks ok, because we used RSD, but still needs a "call us" button for mobile users.

I also need to break out much of the text on the first page, so it loads faster in 3G. It now takes 4 seconds, and my goal is 1 second.

Thanks Wayan.

Oh, I just looked and it appears that I can upgrade to V3 for $89. Is it a good stable version, and close enough to the functionality of 1.5, where I could still use it - especially with a little help from my friends here? :)


sdv3 is a completely different way of doing site designs than RSD v1.5 although you can open your project in sdv3 it will take so much effort & know how to adapt it to sdv3, it will probably be quicker to start again from scratch in sdv3.

ps
on my phone, it loads almost instantly (4G), who the bejeebers uses 3G nowadays, (and here we are a developing country with a national phone system that makes the one Alexander Graham Bell developed to look like a digital broadband one )
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/
User 2699991 Photo


Registered User
5,305 posts
Online Now

Now Google is telling me that I need to change the quality of my page, for mobile users

are you sure it is Google telling you this,, or just someone trying to drum up some business to re-do your site ?/

how many visitors to your site are looking at it using mobile phones,, ??/ is what you should be looking at first of all.

You could try replacing the large header image with one a bit smaller in size at the lower end of the viewports, that would help speed up loading (or even optimize your images to reduce the file size.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/
User 122279 Photo


Senior Advisor
14,622 posts
Online Now

Melissa, one thing you have to be aware of if you want to use SD3: Your site is built on the 'coffeegrinder' grid system, which is not supported by SD3. You will be asked if you want to convert it to one of the built-in grid systems, And I would advise you to select Foundation, as there are many people here who then would be able to give you help and assistance, Wayan included. And Wayan also has a good point about using a smaller image for phone-size screens, and also of course about actually rebuilding your site. Converting from coffeegrinder to foundation is a massive operation performed by the software, and you may experience problems.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 404575 Photo


Registered User
887 posts

Wayan Jaya wrote:

sdv3 is a completely different way of doing site designs than RSD v1.5 although you can open your project in sdv3 it will take so much effort & know how to adapt it to sdv3, it will probably be quicker to start again from scratch in sdv3.


Eeek! No way can I do that. I only know basic html - NOT EVEN CSS, and paid someone to design me the basic site before, in RSD 1. Cant afford to do that again, at this time. Business has been slow.


ps
on my phone, it loads almost instantly (4G), who the bejeebers uses 3G nowadays, (and here we are a developing country with a national phone system that makes the one Alexander Graham Bell developed to look like a digital broadband one )


:lol: Well the Google tester uses 3g speed, to give a worst case, I suppose. This is what they use to determine landing page quality ratings, for Adwords use.

They were also telling me that the page was "low quality", according to their standards ( I spoke with their support ) because it didn't have a "Call Us" button for mobile users, and because too much text was on the landing page and needed to be moved onto other menued pages with links. The problem is that I know my business and they don't, and I'd rather not design my page to please their algorithm, instead of my clients. But then they can charge me more for using Adwords ads. :(

To answer your other question, I looked up statistics and found that, by the end of this year, 2/3 of all website visitors will be using mobile devices, so this is why Google is telling me that my site needs to be "mobile friendly", which of course the responsive design helped immensely with! But two of the big items are, that mobile users want a "Call Us" button, so they don't have to memorize our phone number and take it into their phone app. And also that "the fold always matters", which I need some work on, I suppose, AND getting most of that text off the page and into sub menus. ( I doubt most people even read it anyway! )
Melissa Rhiannon
OS Windows 10
User 404575 Photo


Registered User
887 posts

Wayan Jaya wrote:

It will work with any of the link elements

Insert a picture link where you want the image to be. Choose "local image" bring the image into your resources when it is in choose select.


Yay! THAT part works in my test page now, but I took the advice here and made the image tiny, for a cell phone screen, and it's showing up big and blurry.....Wait! My reduced size image is 44 px wide and I found the setting for max image width and it was 200, so I made it 44. Yay! THAT part looks good! Thank you!

Then type the tel:xxxxxx in the href for the image


Yay! Seems to work! Will apply in my site now, and upload and share. :-)

Melissa Rhiannon
OS Windows 10
User 404575 Photo


Registered User
887 posts

One last thing. I cant seem to find how to align the image link at the center of the page. I'm putting it below the Call us text line.
Melissa Rhiannon
OS Windows 10
User 122279 Photo


Senior Advisor
14,622 posts
Online Now

Display: block
Left and right margin: auto

You may also want to add a wee bit of top and bottom margin.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 404575 Photo


Registered User
887 posts

Inger wrote:
Display: block
Left and right margin: auto

You may also want to add a wee bit of top and bottom margin.


RSD 1.5?

I found Display Block under Position, and clicked on it, but see no Left and right margin.
Melissa Rhiannon
OS Windows 10

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.