Bạn đang xem bài viết Hướng Dẫn Cách Tạo Form Liên Hệ Ở Trang Tĩnh Blogspot được cập nhật mới nhất trên website Rafs.edu.vn. Hy vọng những thông tin mà chúng tôi đã chia sẻ là hữu ích với bạn. Nếu nội dung hay, ý nghĩa bạn hãy chia sẻ với bạn bè của mình và luôn theo dõi, ủng hộ chúng tôi để cập nhật những thông tin mới nhất.
Hướng dẫn cách tạo form liên hệ ở trang tĩnh blogspot
phần cần thiết trong website và năm vừa rồi google hỗ trợ thêm tính năng add widget contact form vào template nhưng khó tùy biến thêm vào trang tĩnh nên bài viết này sẻ giúp bạn thêm form liên hệ ở trang tĩnh của blogspot.
Thêm form liên hệ ở trang tĩnh blogger
Thực ra thì vài hôm trước có một bạn hỏi về cách thêm form liên hệ ở trang tĩnh như thế nào nên mình post bài này để nhiều người có thể áp dụng cách này cho blog của họ.
Bạn có thể xem demo trực tiếp
.contact-form-box{width:50%;margin:20px auto;padding:0;} #ContactForm1_contact-form-name, #ContactForm1_contact-form-email{width: 70%;height:auto;margin: 5px auto 15px;padding: 10px;background: #ebebeb;border: 1px solid #ccc;color:#777;border-radius:3px;box-shadow: 0px 4px 0px 0px #c7c5c7;} #ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-email-message:focus{background: #fffff7;outline:none} #ContactForm1_contact-form-email-message{width: 95%;height: 100px;margin: 5px auto;padding: 10px;background: #ebebeb;border: 1px solid #ccc;color:#777;font-family:Arial, sans-serif;border-radius:3px;box-shadow: 0px 4px 0px 0px #c7c5c7;} #ContactForm1_contact-form-submit {display:block;height: 35px;float: left;color: #FFF;padding: 0 20px;margin: 10px 0 5px 0;cursor: pointer;background-color:#f4836a;box-shadow: 0px 4px 0px 0px #c75b45;border:1px solid #eb7d67;border-radius:3px;text-shadow:0px 1px 0px #de5135;} #ContactForm1_contact-form-submit:hover {background-color:#f5785f;} #ContactForm1_contact-form-submit:active {position:relative;top:2px;box-shadow: 0px 2px 0px 0px #c75b45;} #ContactForm1_contact-form-submit:focus{outline:none} #ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message{width: 100%;margin-top:35px;text-align:left} @media screen and (max-width: 768px){ .contact-form-box{width:100%;} #ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-email-message{width: 96%;} } @media screen and (max-width: 480px){ #ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-email-message{width: 94%;} }
<input id=”ContactForm1_contact-form-name” name=”name” placeholder=”Name” size=”30″ <input id=”ContactForm1_contact-form-email” name=”email” placeholder=”Email” size=”30″ <textarea cols=”25″ id=”ContactForm1_contact-form-email-message” name=”email-message” if (window.jstiming) window.jstiming.load.tick(‘widgetJsBefore’); if (typeof(BLOG_attachCsiOnload) != ‘undefined’ && BLOG_attachCsiOnload != null) { window[‘blogger_templates_experiment_id’] = “templatesV1”;window[‘blogger_blog_id’] = ‘
4764656151717031237
‘;BLOG_attachCsiOnload(”); }_WidgetManager._Init(‘//www.blogger.com/rearrange?blogIDx3d
4764656151717031237
‘,’//www.tips24h.net/’,’
4764656151717031237
‘); _WidgetManager._RegisterWidget(‘_ContactFormView’, new _WidgetInfo(‘ContactForm1’, ‘footer1’, null, document.getElementById(‘ContactForm1’), {‘contactFormMessageSendingMsg’: ‘Sending…’, ‘contactFormMessageSentMsg’: ‘Your message has been sent.’, ‘contactFormMessageNotSentMsg’: ‘Message could not be sent. Please try again later.’, ‘contactFormInvalidEmailMsg’: ‘A valid email address is required.’, ‘contactFormEmptyMessageMsg’: ‘Message field cannot be empty.’, ‘title’: ‘Contact Form’, ‘blogId’: ‘
4764656151717031237
‘, ‘contactFormNameMsg’: ‘Name’, ‘contactFormEmailMsg’: ‘Email’, ‘contactFormMessageMsg’: ‘Message’, ‘contactFormSendMsg’: ‘Send’, ‘submitUrl’: ‘https://www.blogger.com/contact-form.do’}, ‘displayModeFull’));
Chú ý đặc biệt: Bạn cần thay đổi ID
4764656151717031237
cho phù hợp với blog của bạn.
Cách xác định ID blogspot
Chỉ cần bạn đăng nhập vào trang bảng điều khiển
Hy vọng tut nhỏ tạo form liên hệ ở trang tĩnh blogspot này sẻ giúp ích cho các bạn.
Share
Share
Tweet
Share
Share
Share
Love
Donate MoMo: 035.45.48.599
Bài đăng mới hơn
Bài đăng mới hơn
Bài đăng cũ hơn
Bài đăng cũ hơn
Hướng Dẫn Tạo Form Liên Hệ Trong WordPress Với Contact Form 7
Tạo form liên hệ trong WordPress là một việc mà gần blogger nào cũng cần phải làm ngay sau khi cài đặt thành công blog/website. Form liên hệ sẽ giúp người đọc, khách hàng dễ dàng liên gửi thông tin liên hệ với bạn bất cứ lúc nào ngay trên website.
Bài viết này Ngọc sẽ hướng dẫn bạn cách tạo form liên hệ chuyên nghiệp bằng plugin contact form 7. Đây là một plugin phổ biến và được rất nhiều người sử dụng, hiện lượt tải về đã lên đến hơn 1 triệu.
Việc đầu tiên bạn cần là cài đặt plugin contact form 7, tham khảo cách cài đặt một plugin chi tiết.
Hướng dẫn tạo form liên hệ trong WordPress
Trong tab Form bạn sẽ thấy tất cả cá field được liệt kê. Một số field thường dùng đã được chèn sẵn.
Text: Trường dùng để bạn nhập text thông thường, thích hợp tạo field nhập tên, tiêu đề liên hệ,…..
Email: Trường đặc biệt dùng để khách hàng nhập email của họ vào, lúc đó các hệ thống email sẽ hiểu rằng đây là email của người liên hệ để bạn có thể reply nhanh chóng.
URL: Trường dùng để nhập liên kết.
Tel: Một trường đặc biệt để nhập số điện thoại.
Number: Trường nhập số có thêm tính năng tạo nút tăng/giảm số.
Date: Trường riêng biệt để chọn ngày tháng, có tích hợp thêm tính năng chọn theo lịch.
Text area: Trường để nhập text, nhưng khung text to hơn. Thích hợp để làm form nhập nội dung liên hệ.
Dropdown menu: Trường chọn giá trị được định sẵn thông qua menu đổ xuống.
Checkboxes: Trường chọn giá trị định sẵn thông qua việc đánh dấu. (tick chọn)
Radio buttons: Cũng là trường đánh dấu giá trị có sẵn nhưng chỉ được chọn 1 giá trị
Quiz: Trường nhập nội dung theo kiểu quiz.
CAPTCHA: Trường nhập mã captcha kiểm tra, nếu nhập đúng thì mới có thể gửi form.
File upload: Trường cho phép upload tập tin khi gửi liên hệ qua form này.
Submit button: Chèn nút gửi form.
Nhấp Insert Tag để chèn field vào form liên hệ
Lưu ý: Khung TO bạn cần nhập địa chỉ email muốn các form sẽ gửi về.
Bây giờ tiếp tục chuyển qua tab Messages. Tại đây bạn cần dịch các thông tin tiếng Anh sang tiếng Việt. Các thông điệp này sẽ hiện ra khi khách hàng thao tác gửi form.
Vấn đề không gửi được form liên hệ
Có thể bạn cần: Tạo email tên miền riêng trên hosting sử dụng cPanel
Hướng Dẫn Chi Tiết Cách Tạo Form Liên Hệ Với Khách Hàng Dễ Dàng
Form liên hệ rất cần thiết cho bất kỳ chủ website nào vì nó là một trong những công cụ giúp khách hàng giao tiếp với chủ website. Do đó trong một website luôn cần ít nhất một form liên hệ. Trong bài viết này mình sẽ hướng dẫn cách tạo form mẫu để khách hàng liên hệ mình thường dùng.
Trong wordpress muốn tạo form liên hệ rất đơn giản vì trong kho plugin (gói mở rộng) của wordpress được rất nhiều coder đã code sẵn bạn chỉ cần vào kho tìm những plugin mình muốn và cài để sử dụng. Trường hợp tạo form mẫu liên hệ mình thường dùng plugin Contact Form 7
Sau khi hoàn tất việc cài plugin tạo mẫu liên hệ bạn chuyển sang bước tạo form mẫu để cho khách hàng liên hệ.
Bước 2: Cấu hình emailHướng dẫn cấu hình email, bạn điền đầy đủ thông tin vào các trường như bên dưới như mail nhận là của ai, mail gửi là lây mail bạn đã cấu hình ở mục cấu hình mail stmp cho website wordpress. Nếu bạn chưa có thì xem bài
Bước 3: Thông Báo và chú ý trong phần này bạn dịch qua tiếng viết hoặc chỉnh sửa các thông báo theo ý mình
Đặc biệt, những ai đặt form ở nhiều trang mà không biết làm sao để theo dõi thông tin đến từ nguồn nào thì bạn có thể tham khảo bằng cách chèn đoạn mã vào trong chúng tôi cách làm này mình đã biết thông qua chỉ sẽ của bạn hungnguyenplus
// Tracking info to the emailfunction wpshore_wpcf7_before_send_mail($array) {
global $wpdb;
if (isset ($_SESSION[‘OriginalRef’]) )$trackingInfo .= ‘Nguồn giới thiệu: ‘ . $_SESSION[‘OriginalRef’] . $lineBreak;
if (isset ($_SESSION[‘LandingPage’]) )$trackingInfo .= ‘Trang xem đầu tiên: ‘ . $_SESSION[‘LandingPage’] . $lineBreak;
if ( isset ($_SERVER[“REMOTE_ADDR”]) )$trackingInfo .= ‘Địa chỉ IP: ‘ . $_SERVER[“REMOTE_ADDR”] . $lineBreak;
if ( isset ($_SERVER[“HTTP_X_FORWARDED_FOR”]))$trackingInfo .= ‘User’s Proxy Server IP: ‘ . $_SERVER[“HTTP_X_FORWARDED_FOR”] . $lineBreak . $lineBreak;
if ( isset ($_SERVER[“HTTP_USER_AGENT”]) )$trackingInfo .= ‘Thông tin trình duyệt: ‘ . $_SERVER[“HTTP_USER_AGENT”] . $lineBreak;
$array[‘body’] = str_replace(‘[tracking-info]’, $trackingInfo, $array[‘body’]);
return $array;
}add_filter(‘wpcf7_mail_components’, ‘wpshore_wpcf7_before_send_mail’);// Original Referrer function wpshore_set_session_values() {if (!session_id()) {session_start();}
if (!isset($_SESSION[‘OriginalRef’])) {$_SESSION[‘OriginalRef’] = $_SERVER[‘HTTP_REFERER’]; }
if (!isset($_SESSION[‘LandingPage’])) {$_SESSION[‘LandingPage’] = “http://” . $_SERVER[“SERVER_NAME”] . $_SERVER[“REQUEST_URI”]; }
}add_action(‘init’, ‘wpshore_set_session_values’);
[tracking-info]
Khi khách hàng đặt hàng hay liên hệ qua form bạn sẽ có thông tin đầy đủ của khách hàng. Mình hoạ kết quả khi khách liên hệ qua form.
Hướng Dẫn Tạo Mới 1 Trang Blogspot
Là một sản phẩm miễn phí của Google, bạn có thể dễ dàng tạo blogspot để kiếm tiền, bán hàng, viết nhật ký hay rất nhiều mục đích khác nữa.
Thư ngỏ Series này là sự tổng hợp của tất cả những chia sẻ, kinh nghiệm và tâm huyết của mình về nền tảng blogger – blogspot. Hy vọng chúng sẽ có ích cho anh em ! Xem đầy đủ.
Blogspot là gì ?
Blog hiện nay khác nhiều, không đơn thuần chỉ là 1 trang cá nhân nữa mà blog còn được sử dụng cho rất nhiều mục đích khác nhau như bán hàng online, website tin tức, thủ thuật … Bất cứ thứ gì bạn muốn thì đều có thể đưa lên blogspot.
Ưu điểm – Là 1 sản phẩm được cung cấp bởi Google nên anh em yên tâm về chất lượng. – Hoàn toàn miễn phí, được hỗ trợ 15Gb tha hồ upload ảnh. – Giao diện thân thiện. – Dễ sao lưu phục hồi dữ liệu.
Cách tạo mới blogspot nhanh chóng
Bước 3 : Thiết lập thông tin cơ bản cho blogspot – Tiêu đề : thường là lĩnh vực nào đó mà nội dung blog hướng tới, ví dụ : thủ thuật , review xe, … – Địa chỉ : đây chính là đường dẫn URL của blogspot. – Chủ đề : một số template mặc định của blogspot, cứ chọn tạm 1 cái đã. Sau này chúng ta sẽ sử dụng template khác đẹp và chuyên nghiệp hơn nhiều (bài tiếp theo trong series về blogspot). Nhấn Tạo blog để hoàn tất.
Lúc này, bạn có thể nhìn thấy toàn bộ giao diện cũng như các tính năng của nền tảng Blogger. Hãy dành một chút thời gian để khám phá và làm quen nhá :)) Việc tạo mới một trang blogspot chỉ đơn giản vậy thôi, bạn cũng có thể tạo thêm nhiều trang khác cho tới khi đạt số lượng tối đa mà Google cho phép – 50 blogspot / 1 tài khoản thì phải.
Bài tiếp theo
⇒ Gán tên miền riêng cho blogspot : biến trang blog trở nên chuyên nghiệp hơn với tên miền do bạn sở hữu.
Từ khóa tìm kiếm :
Cập nhật thông tin chi tiết về Hướng Dẫn Cách Tạo Form Liên Hệ Ở Trang Tĩnh Blogspot trên website Rafs.edu.vn. Hy vọng nội dung bài viết sẽ đáp ứng được nhu cầu của bạn, chúng tôi sẽ thường xuyên cập nhật mới nội dung để bạn nhận được thông tin nhanh chóng và chính xác nhất. Chúc bạn một ngày tốt lành!