Hướng dẫn tạo trang liên hệ chuyên nghiệp cho blogspot

Chi tiết Liên quan Nhận xét Tác giả Hướng dẫn

Xem toàn trang

Bài biết này mình sẻ hướng dẫn các bạn tạo form liên hệ cho admin trên nền tảng blog. Với form này người dùng sẻ điều cách thông tin vào form sau đó nhấn gửi thì blog sẻ gửi cho các Gmail đang là quản trị viên trên blog đó về hộp thư Gmail của mình.

Hướng dẫn tạo trang liên hệ chuyên nghiệp cho blogspot

Ảnh minh họa

Các bước thực hiện:

Bước 1: Các bạn vào blog của mình sau đó tìm đến trang và tạo 1 trang mới

Bước 2: Sau khi các bạn vào phần viết bài của trang thì các bạn chuyển qua tab HTML và dán đoạn code ở Bước 3 vào phần đó sau đó lưu lại.

Bước 3: Dán code này vào tab HTML ở Bước 2

<style type="text/css">
.BsdCntct {
    float: none;
    position: relative;
    margin: 25px 0;
    margin-right: 9px
}
.BsdCntct input,
.BsdCntct textarea {
    font-size: 16px;
    padding: 15px 0;
    display: block;
    width: 100%;
    border: none;
    border-bottom: 1px solid #ddd
}
.BsdCntct input:focus,
.BsdCntct textarea:focus {
    outline: 0
}
.BsdCntct label {
    color: #111;
    font-size: 16px;
    font-weight: 400;
    position: absolute;
    pointer-events: none;
    left: 0;
    top: 9px;
    transition: .2s ease all
}
.barbsd {
    position: relative;
    display: block;
    width: 100%
}
.barbsd:after,
.barbsd:before {
    content: '';
    height: 1px;
    width: 0;
    bottom: 1px;
    position: absolute;
    background: #00a16b;
    transition: .2s ease all
}
.barbsd:before {
    left: 50%
}
.barbsd:after {
    right: 50%
}
.BsdCntct input:focus~.barbsd:after,
.BsdCntct input:focus~.barbsd:before,
.BsdCntct textarea:focus~.barbsd:after,
.BsdCntct textarea:focus~.barbsd:before {
    width: 50%
}
.lightbsd {
    position: absolute;
    height: 50%;
    width: 100px;
    top: 25%;
    left: 0;
    pointer-events: none;
    opacity: .5
}
.BsdCntct input:focus~label,
.BsdCntct input:valid~label,
.BsdCntct textarea:focus~label,
.BsdCntct textarea:valid~label {
    top: -19px;
    font-size: 14px;
    color: #00a16b
}
input#ContactForm1_contact-form-email-message {
    height: 150px
}
input#ContactForm1_contact-form-reset,
input#ContactForm1_contact-form-submit {
    color: #fff !important;
    background: #00a16b;
    padding: 14px 25px;
    border-radius: 4px;
    border: none;
    outline: 0;
    cursor: pointer;
    transition: all .4s ease-in-out;
    text-transform: uppercase;
    float: left;
    font-weight: 700;
    font-size: 16px;
    margin: 10px 5px 0 0
}
input#ContactForm1_contact-form-reset:hover,
input#ContactForm1_contact-form-submit:hover {
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .19)
}
#ContactForm1_contact-form-error-message {
    float: right;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border-radius: 3px;
    padding:0 5px
}
.post-body img{margin:0!important;display:inline;padding-left:10px;border-radius:0}
#ContactForm1_contact-form-success-message {
    float: right;
    background: #357A37;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border-radius: 3px;
    padding:0 5px
}
</style>
<br />
<form name="contact-form">
<div class="BsdCntct">
<input class="validate" id="ContactForm1_contact-form-name" name="name" required="" type="text" value="" />
        <span class="lightbsd"></span>
        <span class="barbsd"></span>
        <label><i class="fa fa-user"></i> Tên của bạn</label>
    </div>
<div class="BsdCntct">
<input class="validate" id="ContactForm1_contact-form-email" name="email" required="" type="email" value="" />
        <span class="lightbsd"></span>
        <span class="barbsd"></span>
        <label><i class="fa fa-envelope"></i> Email của bạn</label>
    </div>
<div class="BsdCntct">
<textarea class="validate" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" required="" rows="5"></textarea>
        <span class="lightbsd"></span>
        <span class="barbsd"></span>
        <label><i class="fa fa-comment"></i> Tin nhắn</label>
    </div>
<input id="ContactForm1_contact-form-submit" type="button" value="Gửi" />
    <input id="ContactForm1_contact-form-reset" type="reset" value="Xóa" />
    <br />
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</form>
<script src="https://www.blogger.com/static/v1/widgets/199156504-widgets.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) {
    window['blogger_templates_experiment_id'] = "templatesV1";
    window['blogger_blog_id'] = '2389191237839036521';
    BLOG_attachCsiOnload('');
}
_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d2389191237839036521', document.location.origin , '2389191237839036521');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {
    'contactFormMessageSendingMsg': 'Đang gửi...',
    'contactFormMessageSentMsg': 'Tin nhắn của bạn đã được gửi.',
    'contactFormMessageNotSentMsg': 'Không thể gửi tin nhắn. Vui lòng thử lại sau.',
    'contactFormInvalidEmailMsg': 'Nhập địa chỉ email hợp lệ.',
    'contactFormEmptyMessageMsg': 'Trường thông báo không được để trống.',
    'title': 'Contact Form',
    'blogId': '2389191237839036521',
    'contactFormNameMsg': 'Tên của bạn',
    'contactFormEmailMsg': 'Email của bạn',
    'contactFormMessageMsg': 'Tin nhắn',
    'contactFormSendMsg': 'Gửi',
    'submitUrl': 'https://www.blogger.com/contact-form.do'
}, 'displayModeFull'));
//]]>
</script>

Bước 4: Các bạn thay hết các IDBlog 2389191237839036521 thành IDBlog của các bạn
Nếu không thấy mail thì các bạn xem trong thư mục spam nhé, và đánh dấu thư đó không spam thì lần sau sẻ không xuất hiện trong thư mục spam nữa.
Lưu ý: Để Form liên hệ hoạt động thì các bạn vui lòng không tắt JS mặc định của blog nhé!
Chúc các bạn thành công!

Code by: Hung1001

Mục Lục Nội Dung

Minh Tiến IT

Pass giải nén mặc định: truongblogger

Chắc bạn cũng đã nhiều lần gặp những link của 123link dạng 123link.co tại những trang web chia sẻ nội dung số. Nhưng bạn không biết cách nào để truy cập vào đúng link gốc của nội dung mà mình muốn truy cập. Bài viết này sẽ giúp bạn làm điều đó.
Đầu tiên bạn truy cập vào một link 123link. Khi bạn truy cập xong thì nội dung bạn thấy sẽ tựa như hình ở dưới.

Trang 123link

Đánh dấu check vào vô “I’m not a robot”. Sau đó sẽ có một bảng captcha hiện ra. Bạn trả lời theo câu hỏi của captcha rồi bấm Verify để xác nhận.

I’m not a robot

Verify

Sau khi xác nhận captcha thành công thì bấm chọn nút “Click here to continue” để sang bước tiếp theo.

Click here to continue

Ở trang tiếp theo, bạn sẽ thấy một đồng hồ đếm ngược, thường thì nhiều nhất sẽ là 7 giây. Bạn đợi cho thời gian đếm ngược chạy hết.

Bạn đợi cho thời gian đếm ngược chạy hết

Khi thời gian đếm ngược chạy hết, bạn sẽ thấy nút Get Link hiện ra. Bạn bấm vào nút đó để truy cập đến đường link đã được rút gọn bởi 123link.

Get Link

Bạn cứ yên tâm là link từ 123link sẽ không có ẩn chứa những mối nguy hiểm như virus, các pop-up quảng cáo không lành mạnh và phiền toái khi bạn đang thao tác các bước để tới link đích.

THAM GIA KIẾM TIỀN CÙNG MINH TIẾN IT