Front-end hyperlinks

This topic has 3 replies, 2 voices, and was last updated 3 years, 2 months ago by Long Nguyen.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
September 8, 2021 at 4:19 PM #30666
Benchmark Graphics
Participant
Hello,

How do I make custom fields appear as live hyperlinks on the front-end?

I have created a directory Custom Post Type and I would like the contact details such as email, telephone and URL clickable on the front end.

Here is a link to the web page: https://www.warminghamvillagehall.org/directory/

I have used the following custom fields to create this:
- HTML5 email
- HTML5 phone number
- Basic URL
Thanks,
Mark

Add New Note to this Reply
September 8, 2021 at 9:07 PM #30668
Long Nguyen
Moderator
Hi Mark,

To show the URL, email, phone field value in a button, you need to assign it to the attribute href of the <a> tag to make it clickable. Just like
```
<a href="<?php echo rwmb_meta( 'field_url_id' ) ?>">Button Link</a>
<a href="tel:<?php echo rwmb_meta( 'field_phone_id' ) ?>">Call me</a>
<a href="mailto:<?php echo rwmb_meta( 'field_email_id' ) ?>">Email me</a>
```
Add New Note to this Reply
September 8, 2021 at 9:17 PM #30669

Benchmark Graphics
Participant

Hi Long,

Thanks for coming back to me. Sorry the link to view the website currently doesn't work – my client has activated the 'Coming Soon' page.

Is there anyway to add it as a function, as the code you have suggested would be confusing to my client.

I have created the email, telephone and URL custom fields to the 'Directory' custom post type, so it's easy for my client to create directory listings on their website, like in this screenshot:

https://puu.sh/I9Sew/60c1714dfc.png

They just need to add the email, phone or URL to the field and that would automatically become a clickable link in the front-end, if that is possible.

Thanks,

Mark

Add New Note to this Reply

September 9, 2021 at 8:48 AM #30674

Long Nguyen
Moderator

Hi,

The helper function will return a raw value so you need to wrap it in a <a> tag to make it clickable. To get the field value, please read more here https://docs.metabox.io/displaying-fields/

Add New Note to this Reply
Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.