Get Started

Join our new community forum for support & discussion

Join Now

Home › Support › Extensions › Social Links › Website attribute

Website attribute

  • Author
    Posts
  • movedbymark 1 year, 4 months ago

    When a new user creates their listing on the “Add details” page, the website attribute seems to require “http://” in order for the input to be accepted. Fine enough. Unfortunately, it’s not clear to users what’s missing if they type in a website address that doesn’t include the “http://” — the error message just says “type in a URL”…which is not clear or helpful to the not so tech savvy folks. Many will enter something like “movedbymark.com” and understand that to be a proper website address.

    I’ve tried to add a description to the field but it doesn’t display on the front end. I’ve also tried to add “http://” in the placeholder text for the attribute to at least tip people off…but this also doesn’t display on the front end.

    Small issue here but one of many user experience issues I’ve experienced with HivePress and that I feel powerless to fix.

    ihor 1 year, 4 months ago developer

    Yes, this is a browser-side issue (HivePress just declares the URL field type), if the field placeholder and description don’t appear please try disabling third-party plugins – this may be a caching issue. I checked both options locally and they seem to work.

    sowickesited 11 months, 1 week ago

    I am using the theme RentalHive. I have the same issue described above.

    Brand new theme installation with no plugins other than HivePress plugins.

    Using the latest version of Chrome browser. No ad blockers installed.

    1. When submitting a new listing, if I input domain.com instead of https://domain.com in the Website field, I cannot submit the listing form.

    2. There also doesn’t appear to be any error messages to tell the user what is wrong. After clicking “Submit Listing” it scrolls up to the field, but there aren’t popup or error messages. I only knew the error after searching this help forum.

    3. How can I insert a description for the social links text fields? The label says “Website (Optional)” but is there the capability to add a front-end description of the field requirements?

    sowickesited 11 months, 1 week ago

    I found a solution to my 3rd question.

    Thanks to the forum post https://hivepress.io/support/topic/adjust-default-form-fields/#post-24451 for the tip.

    I included a front-end description for the Website field by adding this snippet to my theme’s functions.php file.

    add_filter(
  'hivepress/v1/forms/listing_update',
  function( $form ) {
    if ( isset( $form['fields']['website'] ) ) {
      $form['fields']['website']['description'] = 'Field description text goes here.';
    }
    return $form;
  },
  1000
);

?>

    The same code can be used to add a description to other fields as well. I used it for Title and Tags since there wasn’t another way to add a field description.

    Descriptions for other attributes added to this form can be easily added through the WordPress admin area for listing attributes.

    ihor 11 months, 1 week ago developer

    1. Please check the WordPress URL settings in Settings/General and try refreshing permalinks in Settings/Permalinks. If HTTPS certificate is set correctly there should be no difference in submitting forms.
    2. This depends on the browser, for example Chrome will show the field error if you hover on it.
    3. Thanks for sharing!

    sowickesited 11 months ago

    Thanks @ihor. I’m not sure I worded my question very well.

    If the user inputs a link in the social links fields (such as “website”, “facebook”, “instagram” etc) and the link doesn’t include the http:// or https:// prefix, the form won’t validate and submit successfully.

    I added a custom text description underneath the social link “website” label using the code below.

    add_filter(
  'hivepress/v1/forms/listing_update',
  function( $form ) {
    if ( isset( $form['fields']['website'] ) ) {
      $form['fields']['website']['description'] = 'link should begin with http:// or https://';
    }
    return $form;
  },
  1000
);

    If the user inputs their website link as website.com/something instead of http://website.com/something the form submission won’t validate.

    That would be okay if the user receives an error message, but the user doesn’t see a validation error unless they hover with their mouse over the field after clicking submit. And on mobile, you can’t hover with a mouse. The current tooltip style error messages aren’t a great UX and will leave users confused on why their form won’t submit.

    ihor 11 months ago developer

    In the current version, HivePress relies on the browser-implemented URL fields https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/url so the error message depends on the browser. We’ll try to find a way to display the validation tooltip in any case, maybe by adding a custom JS script for validation. This may be also related to scrolling https://stackoverflow.com/questions/69015407/html5-form-validation-message-doesnt-show-when-scroll-behaviour-is-set-to-smoo

    sowickesited 11 months ago

    Yep. That’s a shame. Looks like Chrome/Edge still don’t support smooth scrolling and HTML5 validation.

    I’d rather not have a JS validation fallback so I changed scroll-behavior to auto for now:

    html {
    scroll-behavior: auto;
}

    Now I see the error messages on the forms.

    It’s not an ideal solution because it just jumps to the field and doesn’t display the label because the label displays above the viewframe, but we’ll have to wait for browsers to support this feature. Thanks for the tip @ihor

    ihor 11 months ago developer

    Thanks for the details, we’ll try to find a solution for this, I wasn’t sure if the smooth scrolling causes this.

    sowickesited 10 months, 3 weeks ago

    @ihor It seems like the solution might already be built into Hivepress.

    The issue with validation described above pertains to the initial listing submission process.

    But if I navigate to My Account (/account/listings/) and try editing a listing, I get a different error/success message that would work great.

    If I leave a checkbox field blank and try to submit the listing, the page scrolls up to the top and displays an error in red that says something like “Type” field is required.

    Or after I successfully make an edit, it scrolls to the top of the page with the green success message “Changes have been saved.”

    Can this same form validation be applied to the initial listing form?

    ihor 10 months, 3 weeks ago developer

    These are custom messages returned by HivePress from the back-end validation, but most of the fields are validated by the browser (standard input fields like URL, email, number…), unfortunately there’s no easy way to add custom messages for all the fields, but we’ll try to improve the UX of the form validation.

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)

New Reply

This forum has been archived and is no longer accepting new posts or replies. Please join our new community forum for support & discussion.