Thêm một hình ảnh biểu tượng bên cạnh một liên kết

Đăng bởi Admin | 17/11/13 | 0 nhận xét

Bài viết hôm nay sẽ cho phép bạn thêm một biểu tượng bên cạnh bất kỳ liên kết nào bạn muốn. Hầu hết các bạn yêu cầu làm thế nào bạn có thể thêm một biểu tượng bên cạnh chỉ là một URL đơn giản không có phần mở rộng tập tin, vì vậy bài viết này sẽ trả lời tất cả các câu hỏi của bạn.

Thêm biểu tượng Next To siêu liên kết trong Blogger

1. Tới Blogger Bảng điều khiển> Mẫu

2 Sao lưu mẫu của bạn 

3. Nhấp chuột vào Chỉnh sửa HTML 

4. Tìm  ]]> </ b: skin>  và thêm mã dưới đây ngay trên nó:   

.mbt-hyperlink-1 {
background: url(ADD ICON LINK HERE) no-repeat 0px 0px;
padding:7px 0 0 25px;
}


• Thay thế ADD ICON LINK HERE với URL của biểu tượng của bạn. Bạn có thể sử dụng bất kỳ biểu tượng bên dưới hoặc tất cả chúng. Kích chuột phải vào bất kỳ biểu tượng và chọn " Sao chép hình ảnh từ "hoặc" Sao chép URL hình ảnh "

Bạn cũng có thể sử dụng biểu tượng của sở thích của bạn và lưu các hình ảnh trên blogger .

Nếu bạn muốn sử dụng ba hoặc bốn biểu tượng chỉ đơn giản là tiếp tục bổ sung thêm các mã CSS tương tự như ở trên bằng cách thay đổi số lượng chữ số tức là 1, 2, 3, 4 như thế này:


.mbt-hyperlink-1 {
background: url(ADD ICON LINK HERE) no-repeat 0px 0px;
padding:7px 0 0 25px;
}
.mbt-hyperlink-2 {
background: url(ADD ICON LINK HERE) no-repeat 0px 0px;
padding:7px 0 0 25px;
}
.mbt-hyperlink-3 {
background: url(ADD ICON LINK HERE) no-repeat 0px 0px;
padding:7px 0 0 25px;
}
.mbt-hyperlink-4 {
background: url(ADD ICON LINK HERE) no-repeat 0px 0px;
padding:7px 0 0 25px;
}
and so on..........


5. Lưu mẫu của bạn và chuyển đến các phần tiếp theo của hướng dẫn

Làm thế nào nó hoạt động?

Bây giờ ví dụ nếu bạn muốn cung cấp một liên kết để người dùng của bạn để tải về một Ebook, bạn chỉ cần thêm các lớp CSS để liên kết tức là class = "mbt-hyperlink-1"   như hình dưới đây:


<a class="mbt-hyperlink-1" href="http://xyz.com">Download SEO Guide Tips</a>


Sau khi bạn dán liên kết ở trên trong chế độ HTML của trình biên tập blogger của bạn và xuất bản các bài viết, bạn sẽ thấy biểu tượng xuất hiện bên cạnh liên kết của bạn như hình dưới đây,

Hy vọng bài viết này có ích cho bạn. 

Chúc bạn thành công !...

                                                                                         Tham khảo: mybloggertricks.com