LinkWithin là một plugin tuyệt vời có thể được tích hợp trong cả Wordpress và Blogger để hiển thị những bài viết liên quan bằng cách lấy các bài viết thuộc về cùng thể loại/nhãn hoặc thẻ. Nó nhanh cvà giúp đỡ trong việc gia tăng sự tham gia của người đọc đọc nhiều hơn. Trước đây, chúng tôi giới thiệu một cách mà bạn có thể tùy chỉnh giao diện của plugin này bằng cách ghi đè kiểu mặc định của nó. Bạn chắc chắn có thể ghi đè lên bất kỳ lớp hoặc ID bằng cách đơn giản bằng cách sử dụng CSS.
Xem minh họa: VIew Demo
CSS tùy chỉnh mà namkna cung cấp cho người dùng để thay đổi màu sắc font chữ của tiêu đề văn bản, chỉnh sửa kích thước hình ảnh thu nhỏ, đường viền và nền. Hôm namkna chia sẻ stylesheet cho skin màu đen của widget linkWithin (bài liên quan) được sử dụng trên blogger. VỚi đoạn CSS đơn giản và hiệu quả. Nó thu hút nhiều khách truy cập và cung cấp một số gợi ý gọn gàng và sạch sẽ. Các bước thực hiện rất dễ dàng!
Bước 1: Cài đặt LinkWithin cho blogger
Nếu bạn chưa cài đặt tiện ích bài viết liên quan linkwithin trên blog của bạn thì bước đầu tiên là cài đặt nó:
Bước 2: Tùy chỉnh LinkWithin
☼ Cách tiến hành:1- Đăng nhập (login) vào Blog
2- Vào Mẫu (Template)
3- Chọn Chỉnh sử HTML (Edit HTML) => Tiếp tục (Proceed)
4- Thêm đoạn code bên dưới vào trước thẻ ]]></b:skin>
/*---Related Posts linkwithin---*/ #linkwithin_logolink_0 { display:none!important; } #lws_0 { clear: both!important; margin: 0 0 20px 0!important; } .linkwithin_outer { margin: 1px 0px !important; background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx7wl1EB_jb25reH-ddLTisUXRIMQPEpVVhveBdIhqhID5jCQDmKIZ7JJZWMN6iYmOtncWmj_ChoN23OZ6HLs3uDrB9Nmh83kDPeOeZIFluTZ1lUxTisGPNgpSB1-UnZgB5d7td_ebBgc/s1600/related-posts-namkna.gif") repeat scroll rgb(42, 42, 42); height: 260px; width:590px!important; padding: 0px !important; box-shadow: 0px 4px 4px -4px rgba(0, 0, 0, 0.7) !important; border-radius: 5px 5px 5px 5px; } .linkwithin_inner { width:590px!important; } .linkwithin_text { margin: 0px !important; padding: 10px !important; font-family: "Droid Sans",Helvetica,Arial,sans-serif; font-size: 1.35em; color: rgb(255, 255, 255); font-weight: 700; line-height: 1.35em; text-transform: capitalize; background-color: rgb(18, 18, 18); border-bottom: 1px solid rgb(0, 0, 0); border-top-right-radius: 5px; border-top-left-radius: 5px; background-image: -moz-linear-gradient(center top , rgb(36, 36, 36), rgb(18, 18, 18)); } .linkwithin_posts a { border-right:0px!important; margin: 10px 0px 10px 20px !important; } .linkwithin_posts a:hover { border-right:0px!important; margin: 10px 0px 10px 20px !important; background:none!important; } #linkwithin_logo_0 {display:none;} .linkwithin_img_0 { border: 1px solid #666 !important; padding: 1px !important; width: 100px !important; height: 70px !important; margin-right: 20px !important; overflow: hidden; background:#666!important; } .linkwithin_img_0:hover { border: 1px solid #666!important; opacity:0.8; } .linkwithin_img_0 div { width: 100px !important; height: 70px !important; } .linkwithin_title { color: rgb(255, 255, 255) !important; font-size: 1.1em !important; display: block; padding: 0px 10px 0px 0px !important; font-weight: 700 !important; line-height: 1.45em !important; margin-top: 10px !important; font-family: "Droid Sans",Helvetica,Arial,sans-serif !important; text-decoration:none!important; width:120px!important; } .linkwithin_title:hover { text-decoration:underline!important; }
Khuyến nghị các bạn nên dọc thêm!
Bạn cũng có thể muốn kiểm tra Skin đầu tiên Tuỳ chỉnh namkna giới thiệu trước đây.- Đọc: Tùy chỉnh LinkWithin
Câu hỏi của bạn.
Widget sẽ hiển thị lên đến 4 hình thu nhỏ. Nếu bạn muốn hiển thị hình thu nhỏ lớn hơn bạn chỉ cần tăng kích thước chiều rộng (width:590px) đánh dấu màu xanh.
Mặc dù thiết lập hiển thị 4 hình thu nhỏ. Các widget sẽ hiển thị 3 hình thu nhỏ tốt hơn bởi vì các lỗi như vậy hiếm khi xảy ra với một số website/ID và yêu cầu sửa chữa hướng dẫn sử dụng từ nhóm linkwithin.
Tham khảo: mybloggertricks
Nhận xét
Bạn thân mến. Trong lúc lang thang internet tìm kiếm tài liệu mã hóa suorce mình tình cờ phát hiện trang này [http://namkna.blogspot.com/p/ma-hoa-va-giai-ma-code-web.html] của bạn. Đó đúng là điều mình đang rất cần, mình muốn nhờ bạn làm 1 bài hướng dẫn chi tiết để tạo 1 trang cho blog của mình [để xài riêng mà]. Thanks bạn trước nha!mong bạn hồi âm sớm giúp mình!
Trả lờiXóaBạn chỉ cần dán đoạn code cần mã hóa hặc giải mã vào đó và bấm nút mã hòa hoặc giải mà và dán vào bài viết hoặc widget là được,
XóaBlog của mình cũng đã có bài viết liên quan, nhưng mình không biết xóa nó thể nào? vậy h mình phải làm sao để thay thế bằng cái này?
Trả lờiXóaPhần đó nó nằm trong phần mỏ rộng tiện cíh do vậy mình không wiew source trên trình duyêt. bạn hãy gửi tempate vào mail tavannam01@gmail.com mình bỏ hộ cho.
Xóathủ thuật này cũng có thể áp dụng cho file word hoặc excel ... đấy. Có lẽ NGỌC ANH đang rất cần. Mình tiếc là ko rành về mấy vụ này, chứ nếu biết mình đã giúp NGỌC ANH lâu rồi.
Trả lờiXóaCó lẽ NGỌC ANH sợ một ngày "mưa dầm" hay "nắng xanh xao" mà NAM "nhẹ nhàng" cho trang blog đó "nghỉ hưu" thì coi như là chấm hết. Lấy gì để cô ấy giải mã cái đống code loằng ngoằng lỡ mã hóa rồi kia chứ bạn cũng hiểu như vậy mà đúng ko Nam [mà công việc thì ko đơn giản đâu bạn aạa]
Trả lờiXóaThực r với dạng mã hóa này không phụ thuộc vào mình nó khác với mã hóa dạng bacode hoặc eval
XóaTrang mày load nhanh VL thế. Chú share quyền quản trị blog lớp lại cho gmail lớp a với. DM blog lớp mà mỗi mày với cái hjến quản tri là thế đéo nào hả. Sợ tụi tao ngich hỏng ak.
Trả lờiXóaChú muốn chết hả?
XóaBạn ơi sao mình làm như hướng dẫn . Nhưng khi mình làm xong thì nó chỉ hiện 1 khung như hình demo nhưng không có hình bài viết của mình. Mong bạn giúp đở
Trả lờiXóaĐây chỉ là mã CSS để hiển thị bài trong đó bạn xem bài này nha: http://namkna.blogspot.com/2011/05/tao-muc-cac-bai-cung-chu-e-cho-blogger.html
XóaMình cũng đã làm đúng như bài này http://namkna.blogspot.com/2011/05/tao-muc-cac-bai-cung-chu-e-cho-blogger.html . Nhưng không được nó chỉ hiện một khoảng màu trắng chứ không hiện bài viết hix
Trả lờiXóaSau khi làm theo bài đó thì bạn chèn đoạn code bài này vào. Nhãn chứa bài viết đó phải có bài khác nữa nha.
XóaMấy anh cho mình hỏi. lúc đầu blog em có 5 bài viết LinkWithin hiện đầy đủ 5 bài viết, ngày hôm sao em tăng số bài viết lên thành 8 bài nhưng LinkWithin vẫn chỉ hiện có 5 bài là sao vậy. Hình như là nó không tự cập nhật vậy có cách nào để sửa không. Thanks mấy anh trước.
Trả lờiXóaEm lưu ý là nó chỉ hiển đủ chiều ngang thôi em. Chiều ngang blog em không đủ.
XóaThanks Anh nhiều
Trả lờiXóaBạn hãy Upload hình đó lên thẳng blog và đặt trươc dấu ngắt nha.
Trả lờiXóa- Những hình ảnh từ web khac sẽ không hiển thị :)