Thông báo: Chúng tôi luôn cần có thêm những thành viên sáng tạo, chuyên nghiệp và sẵn sàng cháy hết mình với công việc! Tham gia

Cách thêm Tiện ích ứng dụng Mô tả trong Trang web Blogger

Xin chào tất cả nhân dịp này tôi sẽ chia sẻ một widget mô tả ứng dụng bằng html và css.

Đối với những người bạn muốn điều chỉnh hướng dẫn, bạn có thể bình luận trên một trong những bài viết hoặc diễn đàn của tôi hoặc bạn cũng có thể tham gia nhóm whatsapp, nếu nó thú vị, tôi sẽ thực hiện nó trong tương lai. 

Bạn cũng có thể tùy chỉnh thiết kế bằng cách gửi bản phác thảo dưới dạng hình ảnh như Spidey đã làm vì nó khá hữu ích nên tôi không nghĩ quá nhiều về thiết kế. 

Tiện ích mô tả ứng dụng này hoàn hảo cho những người bạn có các trang web tải xuống như chia sẻ ứng dụng hoặc mẫu, v.v.

Cách thêm Tiện ích ứng dụng Mô tả trong Trang web Blogger

vui lòng truy cập blogger> chủ đề > chỉnh sửa html, sao chép css bên dưới và đặt nó phía trên mã]]> </ b: skin> nếu nó được thực hiện, đừng quên bấm vào lưu.

css
/* widget deskripsi aplikasi by wendy code*/ .wc-app-wrap{position:relative;color:#48525c;background-color:transparent;font-size:14px;} .wc-app-wrap img{width:100px;border-radius:10px;background-color:#fefefe;box-shadow:0 10px 8px -8px rgb(0 0 0 / 12%);padding:10px;border:1px solid #eceff1} .wc-apknm{position:absolute;top:5px;left:120px;font-size:24px;font-weight:bold} .wc-apkvs,.wc-apkpb{position:absolute;left:120px;top:40px}.wc-apkpb{top:70px} .wc-apkvb,.wcapkdtl,.wc-apkvl{margin-top:20px;font-size:17px;font-weight:bold;border-bottom:1px solid #eceff1;padding-bottom:10px}.wc-apkvl{border:0} .wcapkdtl{font-size:14px;font-weight:normal}.wcapkdtl b{margin-right:50px} .wc-apk-btn{position:relative;display:flex;justify-content:center;align-items:center;text-align:center;margin:30px auto;padding:10px 25px;border-radius:30px;line-height:20px;color:#fefefe;background-color:#f89000;font-size:14px;font-weight:bold;width:calc(100% - 40px)}.wc-apk-btn:hover{opacity:.8} ul.wc-appv-str{list-style:none;margin:15px 0 5px -40px} ul.wc-appv-str li{width:50%;float:left;padding-left:5px;padding-right:5px;margin-bottom:10px} ul.wc-appv-str li .wc-app-dtl{padding:5px 10px;border:1px solid #eceff1;border-radius:10px} ul.wc-appv-str li a .wc-app-dtl>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:10px} .wc-typstr span{background:#f89000;text-align:center;display:inline-block;font-size:10px;color:#fff;border-radius:2px;min-width:32px;padding:0 5px} .wc-typstr span.blue-clr{background-color:#018dbc}ul.wc-appv-str .wc-apkdte{color:#48525c} /* CSS darkmode ubah classnya jika berbeda atau hapus bagian ini*/ .darkMode .wc-app-wrap{background-color:#1e1e1e;color:#fefefe} .darkMode .wc-apk-btn{color:#fefefe} .darkMode ul.wc-appv-str li .wc-app-dtl,.darkMode .wc-apkvb,.darkMode .wcapkdtl{border-color:rgba(255,255,255,.1)}

Phương pháp sử dụng

bạn vui lòng copy đoạn html bên dưới và đưa lên trang post với chế độ HTML, phần mình đánh dấu # vui lòng thay đổi bằng link tải của bạn và phần còn lại bạn hãy tự điều chỉnh.

html
<div class='wc-app-wrap'> <!--[icon aplikasi]--> <img src='https://play-lh.googleusercontent.com/0x-5LpQbEzhHXMMrWyynSl-w_DjVYIrniUhPlCHcwGTLKGJexm6wr9lpNPuFslNL7w=s180-rw' alt='wendy code' title='wendy code'/> <!--[icon aplikasi and]--> <div class='wc-apknm'>Wendy Code</div> <div class='wc-apkvs'>Versi 1.0.5</div> <div class='wc-apkpb'>Oleh Wendy Code Grup</div> <div class='wc-apkvb'>Versi Terbaru</div> <div class='wcapkdtl'><b>Pembaruan</b> 22 september 2021</div> <div class='wcapkdtl'><b>Kategori</b>Blog</div> <!--[tombol dwonload]--> <a class='wc-apk-btn' href='#' target='_blank' rel='noopener noreferrer'>Dwonload Apk 9.5M</a> <!--[tombol dwonload and]--> <!--[versi lama start]--> <div class='wc-apkvl'>Versi Lama</div> <ul class="wc-appv-str"> <!--[versi lama 1]--> <li> <a class="wc-appdw-link" href="#" rel="noopener noreferrer"> <div class="wc-app-dtl"> <span class="wc-appvs">1.0</span> <span class="wc-typstr"> <span>Apk</span></span> <span class="wc-apkdte">12 July 2021</span> </div> </a> </li> <!--[versi lama 1 and]--> <!--[versi lama 2]--> <li> <a class="wc-appdw-link" href="#" rel="noopener noreferrer"> <div class="wc-app-dtl"> <span class="wc-appvs">1.0.3</span> <span class="wc-typstr"> <span>Apk</span> <span class="blue-clr">Obb</span> </span> <span class="wc-apkdte">18 Agustus 2021</span> </div> </a> </li> <!--[versi lama 2 and]--> </ul> <!--[versi lama and]--> </div>

ok vậy đó là mà tôi có thể chia sẻ lần này, hy vọng nó hữu ích và cảm ơn bạn đã ghé thăm.

Đọc thêm :
Đánh Giá Bài Viết:
Khi tôi là chính bản thân mình, tôi hạnh phúc và có kết quả tốt !

Đăng nhận xét