top of page

Velo by WixでLINE IDの入力欄を作成

更新日:11月25日

こんにちは!

Wix専門のWeb制作会社 合同会社アクトワン代表 和田英也です!


弊社ではWixクリエイター同士が繋がれる有料オンラインサロン(月額330円)、Wix Tech Salonを運営しています。

サロン内では弊社が日々、Wix制作で気づいた情報などをシェアしております。


今回は非公開にしているFacebookグループにて、有料会員様のみに配信している投稿から、好評だったものをこちらのブログで公開致します。


LINE IDの入力欄

Wixのデータベース送信フォームなどで、LINE IDの入力欄を作れます。

LINE IDの形でテキストを入力していないと、エラーメッセージが出る仕組みを構築できます。


LINE IDにはいくつかの制限があります。以下が主な制限事項です。

Veloで正規表現にこのルールを入れ、当てはまってないとエラーメッセージが表示されます。


【 LINE IDの文字制限 】

  1. 文字数: 4文字以上、20文字以内。

  2. 使用可能な文字: 半角英数字(a-z、A-Z、0-9)および一部の記号(ハイフン「-」とアンダースコア「_」)。

  3. 先頭文字: 数字で始めることはできません。


  • 入力欄:#lineid

  • エラーメッセージ(テキスト):#errorMessage


Veloコード

$w.onReady(function () {
$w("#lineid").onBlur(() => {
validateLineId();
});
});
function validateLineId() {
const lineId = $w("#lineid").value;
const lineIdPattern = /^(?!\d)[a-zA-Z0-9_-]{4,20}$/;
if (!lineIdPattern.test(lineId)) {
$w("#errorMessage").text = "有効なLINE IDを入力してください。";
$w("#errorMessage").show();
} else {
$w("#errorMessage").hide();
}
}

Wix Tech Salon

Wixのオンラインサロン Wix Tech Salonのバナー

アクトワンではWixクリエイターを中心としたオンラインサロンを運営しております!

Wixの知識のシェアや、ビジネスの課題解決、メンバー同士の交流を目的にしています。 ご興味がある方はぜひ覗いてみてください!


閲覧数:41回

関連記事

すべて表示

Comments


bottom of page