Trước hết, tôi tin rằng mẹo mà tôi đang viết trên bài đăng này là không cần thiết đối với 99. 99% người dùng và thực sự, tôi không khuyên bạn nên sử dụng nó. Tôi đang viết cái này cho 0. 01% của bạn nên có thể bỏ qua nếu không cần thiết
Như bạn đã biết, Biểu mẫu liên hệ 7 chuyển hướng đến cùng một URL với URL của biểu mẫu sau khi gửi biểu mẫu trong cài đặt mặc định. Tuy nhiên, trong một số trường hợp rất hiếm, bạn có thể cần phải thay đổi điều này để làm cho nó chuyển hướng đến một URL khác sau khi gửi. Tôi sẽ viết trong bài đăng này cách bạn có thể thiết lập Biểu mẫu liên hệ 7 để làm điều đó
Nhân tiện, tôi thường được người dùng hỏi rằng làm thế nào họ có thể chuyển hướng đến cái gọi là “Trang cảm ơn”. Trong hầu hết các trường hợp, họ muốn biết điều đó vì họ cho rằng việc chuyển hướng đến “Trang cảm ơn” là cần thiết để theo dõi các lần gửi biểu mẫu bằng Google Analytics. Điều đó không cần thiết chút nào. Trên thực tế, đó là một phong tục lỗi thời và vô nghĩa. Ngày nay, bạn có thể theo dõi nội dung gửi bằng Google Analytics mà không cần bất kỳ chuyển hướng nào
Vì vậy, bạn có lý do khác để chuyển hướng đến một URL khác?
Cách đơn giản nhất là sử dụng sự kiện DOM tùy chỉnh của Contact Form 7 để chạy JavaScript. Sau đây là một ví dụ về tập lệnh chuyển hướng bạn đến một URL khác khi sự kiện wpcf7mailsent xảy ra
document.addEventListener[ 'wpcf7mailsent', function[ event ] {
location = '//example.com/';
}, false ];
Nhúng đoạn mã này vào tệp mẫu của chủ đề của bạn. Rõ ràng, bạn cần thay thế http. //ví dụ. com/ trong mã tới URL bạn muốn chuyển hướng đến
@IsaacTakushi,
Rất cảm ơn vì sự giúp đỡ của bạn. Dựa trên những gì bạn đã cung cấp cho tôi và với sự giúp đỡ từ một người bạn, tôi đã có thể làm cho nó hoạt động bình thường. Đây là định dạng làm việc cuối cùng đã thành công đối với tôi.
Đối với bất kỳ ai khác đang cố gắng thực hiện việc này, đây là "cách thực hiện" nhanh
Chỉ cần thả mã bên dưới vào mã nguồn [RichText/Advanced/Source Code] trên một khối văn bản có định dạng trong COS. Thay đổi portalId và formId để khớp với biểu mẫu của bạn. Bạn có thể tìm thấy cả hai giá trị này bằng cách mở biểu mẫu của mình và xem URL.
Giá trị ngắn sau "biểu mẫu" là ID cổng thông tin của bạn và giá trị dài hơn sau "trình chỉnh sửa" là FormID của bạn.
Từ đó, thay đổi tên đầu vào thành bất kỳ trường nào trong biểu mẫu của bạn mà bạn đang tham chiếu. Bạn sẽ thay đổi "FieldID" thành trường biểu mẫu của mình. Đó sẽ là "email" hoặc "danh mục" hoặc bất kỳ thứ gì khác mà bạn đang hỏi trong biểu mẫu.
Nơi tôi có "http. // trang web. com?email=" chỉ cần thay đổi nó thành bất cứ thứ gì bạn muốn trước biến trường đã truyền của bạn. Khi chuyển hướng, nó sẽ đọc "http. // trang web. com?email=FieldID" và FieldID sẽ được thay thế bằng biến từ biểu mẫu.
Tôi không chắc "emailWeb" làm gì, nhưng điều đó dường như làm cho nó hoạt động, vì vậy cuối cùng tôi sẽ không thay đổi nó. Có lẽ @IsaacTakushi có thể nói nhiều hơn về điều đó.
Có một số cách để chuyển hướng đến một trang web khác bằng JavaScript. Những cái phổ biến nhất là location.href và location.replace
Ví dụ
// Mô phỏng nhấp chuột.
cửa sổ. địa điểm. href = "http. //www. w3schools. com";
// Mô phỏng chuyển hướng HTTP.
cửa sổ. địa điểm. thay thế ["http. //www. w3schools. com"];
Ghi chú. Sự khác biệt giữa href và replace là replace[] xóa URL của tài liệu hiện tại khỏi lịch sử tài liệu, nghĩa là không thể sử dụng nút "quay lại" để điều hướng quay lại tài liệu gốc
Chạy javascript khi gửi biểu mẫu với các ví dụ sau. Những ví dụ này sử dụng trình kích hoạt có trong Formidable Forms
Formidable Forms là plugin Trình tạo biểu mẫu WordPress tốt nhất. Nhận nó miễn phí
Chuyển hướng đến URL trong tab mới
Bạn có thể thực hiện việc này một cách dễ dàng bằng cách thêm Javascript chuyển hướng trong "thông báo xác nhận cập nhật"
window.open['//www.yoururl.com', '_blank'];
Chuyển hướng đến URL trong tab mới Phương pháp 2
Mặt trái của tùy chọn 1 là trình chặn cửa sổ bật lên của trình duyệt có thể ngăn cửa sổ chuyển hướng của bạn mở. Tùy chọn 2 cung cấp một cách khác để mở trang/tab mới khi gửi mà không kích hoạt trình chặn cửa sổ bật lên. Để thực hiện việc này, bạn cần đi tới cài đặt biểu mẫu -> Tùy chỉnh HTML và thêm đoạn mã sau vào mã nút gửi ngay trước mã ngắn [button_action]
title="window.open['//yoururl.com', '_blank'];"
Hiển thị thông báo xác nhận, sau đó chuyển hướng
Thêm mã sau vào hộp thông báo Khi gửi biểu mẫu của bạn. Nó sẽ hiển thị thông báo thành công trong 5 giây, sau đó chuyển hướng
Your submission was successfully saved. setTimeout["location.href = '//www.yoursite.com';",5000];
Ẩn thông báo xác nhận sau 5 giây
Nếu bạn đang hiển thị biểu mẫu của mình với thông báo thành công và muốn ẩn nó sau x giây, bạn có thể sử dụng mã này trong thông báo thành công của mình
Your submission was successfully saved.
jQuery[document].ready[function[$]{
$[".frm_message"].delay[5000].fadeOut[1000]; // change 5000 to number of seconds in milliseconds
}];
Thực hiện hành động sau khi gửi biểu mẫu
Nếu bạn muốn thực hiện một hành động jQuery hoặc JavaScript sau khi biểu mẫu được gửi, bạn có thể sử dụng ba sự kiện khác nhau, tùy thuộc vào hành động "Khi gửi" mà bạn đã chọn trong Cài đặt của biểu mẫu
Thông báo sau khi thành công
Bạn có thể sử dụng sự kiện frmFormComplete cho lệnh gọi lại gửi biểu mẫu javascript hoặc jQuery sau khi thông báo thành công được hiển thị. Một ví dụ cơ bản được hiển thị dưới đây
jQuery[document].ready[function[$]{
$[document].on[ 'frmFormComplete', function[ event, form, response ] {
var formID = $[form].find['input[name="form_id"]'].val[];
}];
}];Đối tượng biểu mẫu bao gồm thành phần biểu mẫu đã được gửi. Đối tượng phản hồi bao gồm nội dung được hiển thị từ một trang khác. Tập lệnh này phải được đưa vào bên ngoài HTML của biểu mẫu để được sử dụng