Template Thủ thuật

Hiển thị các bài đăng có nhãn Thủ thuật. Hiển thị tất cả bài đăng

Thủ thuật

Hướng dẫn Tạo VPS Windows 11 1h ( 6GB Ram - 4 Core ) | How to create VPS Windows 11

B1 : các bạn truy cập vào link này nhé : Link

B2 : kéo xuống chọn START cho nó cài đặt môi trường Linux

B3 : chờ nó chạy rồi gõ đoạn code này vào

sudo su - wget -O Katacoda_Windows11SuperLite.sh https://bit.ly/2URPD7y chmod +x Katacoda_Windows11SuperLite.sh ./Katacoda_Windows11SuperLite.sh

B4 : TRuy cập vào link sau để lấy token Ngrok rồi dán lại vào web Linux

B5 : chờ nó chạy từ 2 - 4p sẽ thành công cho ra địa chỉ

B6 : vào Remote Desktop rồi ghi địa chỉ là chạy được VPS rồi

Credit : Đ

Hướng dẫn sao lưu và khôi phục Blogger

Sao lưu định kỳ là một nhu cầu thiết yếu để đề phòng trường hợp có sự cố xảy ra. Sau khi tạo một website miễn phí với Blogger, ở bài này mình sẽ hướng các bạn các bước sao lưu và khôi phục toàn bộ nội dung: bài viết, trang, bình luận và giao diện của Blogger về máy tính. Khi có sự cố xảy ra, chúng ra dễ dàng khôi phục lại dữ liệu trước đó.

Xem nhanh

Giao diện (Theme)

Sao lưu giao diện blogger

Để tiến hành sao lưu (backup) giao diện. Các từ menu bên trái, các bạn truy cập vào mục Theme. Sau đó tại menu ... bạn chọn Backup. Một cửa sổ thông báo hiện lên, bạn nhấn tiếp vào DOWNLOAD để tiến hành tải về bản sao lưu giao diện .xml.

Khôi phục giao diện blogger

Tương tự, để khôi phục lại giao diện blogger từ tệp .xml. Tại menu ... các bạn chọn Restore, sau đó nhấn chọn UPLOAD và up tệp .xml đã sao lưu ở bước trên.

Nội dung: bài viết, trang và bình luận

Để tiến hành sao lưu toàn hoặc khôi phục bộ nội dung của Blogger gồm: bài viết, trang và bình luận. Các bạn vào menu Settings > Other.

Sao lưu nội dung blogger

Tại mục Import & back up. Các bạn click vào nút Back up Content, trong hộp thoại hiện lên, chọn Save to your computer để tiến hành tải về toàn bộ nội dung của Blog.

Tệp .xml tải về sẽ được đặt tên theo ngày sao lưu.

Khôi phục nội dung blogger

Để tiến hành nhập nội dung cho blogger, cũng tại mục Import & back up, các bạn nhấn chọn Import Content. Sau khi xác minh reCAPTCHA. Các bạn nhấn tiếp vào Import from computer, chọn và tải lên tệp dữ liệu .xml đã sao lưu.

Lưu ý, nếu tích vào ô Automatically publish all imported posts and pages, toàn bộ nội dung nhập vào sẽ tự động được xuất bản. Ngược lại, các bài viết nhập vào sẽ ở chế độ Nháp.

Nếu các bạn chỉ muốn nhập một vài bài viết hoặc trang thì bỏ tích ở ô này. Sau đó bạn vào danh sách bài viết/trang, lọc và xuất bản các bài viết cần thiết.

Hướng dẫn thay Favicon cho Blogger

Google lần đầu giới thiệu giao diện trang admin mới cho Blogger vào ngày 20/05/2020. Để anh em thuận tiện làm quen thì Blogger team vẫn cho phép mọi người chuyển đổi trở về phiên bản cũ. Tuy vậy, Tính năng “Revert to legacy Blogger” đã bị loại bỏ vào ngày 19/09/2020. Trong đó, có nhiều anh em vẫn chưa quen với giao diện mới này và gặp nhiều khó khăn trong khi sử dụng.

Giao diện trang quản trị mới được Blogger team thiết kế lại ra mắt ngày 20/05/2020.

Xem nhanh

Favicon là gì

Favicon – (Favorite Icon) là biểu tượng của website. Đó là một icon thu nhỏ ở góc trên cùng của tab trình duyệt, hiển thị trước tên trang web. Favicon thông thường sẽ được thiết kế trùng với logo website như 1 phần của nhận dạng thương hiệu. Định dạng của favicon thường ở dạng hình ảnh với kích nhỏ: .ico, .png, .svg,…

Favicon của VIETRICK

Hiện nay hầu hết các trình duyệt sẽ tự động sử dụng favicon mặc định ở đường dẫn /favicon.ico nếu bạn không khai báo favicon cho trang web ở phần thẻ <head>. Blogger cũng có sử dụng favicon tại địa đường dẫn gốc của domain.

Hướng dẫn thay Favicon cho Blogger

Trước đây, Google cho phép chúng ta thay đổi favicon trong phần Bố cục (Layout). Tuy nhiên, kể từ khi cập nhật lại giao diện trang admin, Blogger đã thay đổi mục này. Nội dung bên dưới sẽ hướng dẫn các bạn thay đổi favicon trong giao diện quản trị mới của Blogger.

Tạo favicon

Để tạo hoặc thiết kế Favicon, các bạn có thể sử dụng các trình chỉnh sửa ảnh chuyển nghiệp như Photoshop, sau đó xuất file ra định dạng .ico.

Một cách khác để nhanh tạo Favicon nhanh gọn, chúng ta có thể tìm kiếm các icon dưới dạng .svg tại https://www.iconfinder.com hoặc các nguồn trên Internet. Sau đó tiến hành chỉnh sửa lại.

Sau đó, bạn truy cập vào https://realfavicongenerator.net, upload file SVG lên để công cụ này tạo favicon.

Hướng dẫn thay favicon cho Blogger

Bên dưới là hướng dẫn cụ thể các bước thay favicon cho Blogger

Cài đặt
Sau khi đăng nhập vào trang quản trị Blogger, ở menu bên trái, các bạn di chuyển đến mục Cài đặt. Sau đó bên dưới nội dung Mã theo dõi Google Analytics, các bạn nhấn chọn Biểu tượng trang web.
Upload Favicon
Trong trang popup nổi lên, các bạn chọn tệp và upload lên tệp favicon.ico đã chuẩn bị sẵn ở phần trên.
Lưu ý là dung lượng tệp không quá 100KB và kích thước là 32×32.
Lưu và kiểm tra
Cuối cùng, sau khi upload thành công các bạn nhấn Lưu để tắt popup và kiểm tra lại kết quả. Để kiểm tra kết quả, các bạn truy cập vào đường dẫn /favicon.ico.

Thắc mắc

Bên dưới là tổng hợp một số thắc mắc thường gặp của các bạn khi thay favicon cho Blogger.

Favicon không thay đổi trên trang

Sau khi cập nhật, thông thường phải mất một khoảng thời gian để các công cụ tìm kiếm cập nhật Favicon mới của bạn.
Ngoài ra thì nếu bạn kiểm tại đường dẫn /favicon.ico đã thấy cập nhật Icon mới nhưng trên trang chủ thì không. Hiện tượng này xảy ra có thể nguyên do template bạn đang sử dụng đã hardcode Favicon trong template.
Để khắc phục, các bạn hãy vào chỉnh sửa template để đổi. Thêm hoặc dùng đoạn code sau trong thẻ <head>:
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>

Favicon của mình bị nhòe

Mặc định Blogger chỉ hỗ trợ Favicon kích thước 16×16. Các Favicon sau khi upload lên đều bị chuyển đổi về kích thước này.
Để khắc phục hiện tượng này, chúng ta hãy thêm Favicon ở định dạng .png với kích thước lớn hơn trong phần thẻ <head>. Các bạn tham khảo đoạn mã bên dưới.
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='.../apple-touch-icon.png' rel='apple-touch-icon'/>
<link href='.../favicon-32x32.png' rel='icon' sizes='32x32' type='image/png'/>
<link href='.../favicon-16x16.png' rel='icon' sizes='16x16' type='image/png'/>

Hy vọng bài viết này hữu ích với các bạn. Xem thêm cách tạo và sử dụng darkmode Favicon cho Blogger.

Tổng hợp các thẻ điều kiện Blogger 2021

Bài viết này mình xin tổng hợp các thẻ điều kiện Blogger hay dùng trong thiết kế giao diện Blogspot.

Trong quá trình thiết kế và sử dụng Blogger, mình có hay sử dụng một số thẻ để lập trình. Nay xin phép tổng hợp lại trong bài viết này để anh em tham khảo khi cần thiết.

Xem nhanh

Các loại thẻ Blogger cơ bản

Thẻ IF / ELSE

Thẻ <b:if> / <b:else/> là thẻ điều kiện cơ bản hay gặp nhất trong thiết kế giao diện của Bloger. Thẻ này dùng để đặt điều kiện thực thi.

Ví dụ về cấu trúc của thẻ IF/ELSE bên dưới:

<!-- Ví dụ về cú pháp thẻ IF/ELSE -->
<b:if cond='data:view.isPost'>

<b:elseif cond='data:view.isPage'/>

<b:else/>

</b:if>

Thẻ Loop

Thẻ <b:loop> trong Blogger dùng để thực hiện vòng lặp. Thẻ này thường được sử dùng để trích xuất dữ liệu trong một mảng.

<!-- Ví dụ về cú pháp vòng lặp LOOP -->
<b:loop index='i' values='data:links' var='link'>
<a expr:title='data:link.name'/>
<data:link.target/>
</a>
</b:loop>

Trong ví dụ ở trên thì hàm <b:loop> dùng để trích xuất dữ liệu trong mảng data:links, biến phần tử được khai báo var='link'.

Để trích xuất giá trị trong hàm <b:loop> ở trên, chúng ta sử dụng cấu trúc: data:"phần tử"."thuộc tính". Ở trong ví dụ trên, phàn tử link có 2 thuộc tính target và name.

Thẻ Tag

Thẻ <b:tag> được dùng để khai báo 1 phần tử HTML trong Blogger. Loại phần tử HTML được quy định bởi thuộc tính name.

<!-- Ví dụ về cú pháp thẻ <b:tag/> -->
<b:tag expr:href="data:blog.homepageUrl.canonical" name="a">
   SAMPLE TEXT
</b:tag>

Trong ví dụ ở trên, chúng ta sử dụng thẻ <b:tag> để khai báo 1 phần tử <a>. Kết quả bên dưới:

<!-- Ví dụ về cú pháp thẻ <b:tag/> -->
<a href="https://omegakd.blogspot.com">
   SAMPLE TEXT
</a>

Thẻ Class

Thẻ <b:class> được sử dụng để thêm class name vào phần tử cha chứa thẻ này. Class name đươc quy định bởi thuộc tính name.

<!-- Ví dụ về cú pháp thẻ <b:class/> -->
<div class="class1">
<b:class cond='data:view.isMultipleItems' name='index-post'/>
SAMPLE TEXT
</div>

Trong ví dụ ở trên, sẽ cho kết quả như bên dưới nếu khớp điều kiện cond='data:view.isMultipleItems' trả về true.

<!-- Ví dụ về cú pháp thẻ <b:class/> -->
<div class="class1 index-post">
SAMPLE TEXT
</div>

Thẻ Includable

Thẻ <b:includable> dùng để gọi một hàm đã khai báo sẵn trước đó. Hàm được gọi quy định bởi thuộc tính name, và khai báo bởi thuộc tính id.

<!-- Ví dụ về cú pháp thẻ <b:includable/> -->

<!-- Khai báo nội dung cho thẻ <b:includable/> -->
<b:includable id='postMeta' var='post'>
   SAMPLE CONTENT
</b:includable>
<!-- Ví dụ về cách sử dụng thẻ <b:includable/>-->
<b:include data='post' name='postMeta'/>

Các loại thẻ điều kiện Blogger

Phần này sẽ trình bày về các loại thẻ điều kiện có thể dùng trong thuộc tính cond. Thuộc tính điều kiện này được sử dụng bởi các thẻ: <b:if>, <b:tag>, <b:class>, <b:loop>, <b:includable>,…

Bên dưới tổng hợp các điều kiện thường dùng trong thuộc tính cond:

Cấu trúc dữ liệu data:view

data:view.isError: true nếu không tìm thấy trang. Dùng để thiết kế trang Error 404.
data:view.isHomepage: true nếu là trang chủ.
data:view.isLabelSearch: true nếu đang xem trang Label.
data:view.isMobile: true nếu đang xem ở chế độ di động.
data:view.isPage: true nếu đang xem Trang.
data:view.isPost: true nếu đang xem Bài viết.
data:view.isSearch: true nếu đang xem kết quả tìm kiếm.
data:view.isSingleItem: true nếu đang xem trang đơn: Page/Post
data:view.isMultipleItems: true nếu đang xem trang đa: HomePage/Search/Archive
data:view.isLayoutMode: true nếu đang xem ở setting Layout trong dashboard của Blogger.

Xem thêm bản đầy đủ về Blogger Template Cheat Sheet.

Một số ví dụ về các thẻ điều kiện

Trích xuất dữ liệu từ liên kết đính kèm (enclosure link)

Chúng ta có thể lấy dữ liệu từ liên kết đính kèm với bằng cách dùng thẻ <b:loop> như ví dụ sau:

<!-- Ví dụ về trích xuất dữ liệu từ liên kết đính kèm -->
<b:loop index='i' values='data:post.enclosures' var='enclosure'>
   <data:enclosure.url/>
   <data:enclosure.mimeType/>
</b:loop>

Ngoài ra, chúng ta còn có thể kết hợp thẻ điều kiện <b:if> để kiểm tra trước nội dung của liên kết đính kèm. Trong ví dụ bên dưới, sử dụng thẻ <b:if> để kiểm tra đính kèm có tồn tại type audio trước khi tạo liên kết tải.

<!-- Ví dụ về trích xuất dữ liệu từ liên kết đính kèm -->
<b:if cond="data:post.enclosures any (l => l.mimeType in {"audio"})”>
   <b:loop index="i" values="data:post.enclosures" var="enclosure">
      <b:if cond="data:enclosure.mimeType == "audio"">
         <a expr:href="data:enclosure.url">Download</a>
      </b:if>
   </b:loop>
</b:if>

Trích xuất nội dung bài viết

Để trích xuất 1 đoạn ngắn bài viết, chúng ta có thể dùng thẻ <b:eval> để trích xuất nội dung từ data:post.snippets.

<!-- Ví dụ về trích xuất nội từ bài viết -->
<p class='entry-excerpt excerpt'>
   <b:eval expr='data:post.snippets.long snippet { length: 125 }'/>
</p>

Trong đoạn mẫu trên, nội dung bài viết được giới hạn ở 125 ký tự.

Hy vọng bài viết mang lại một số kiến thức hưu ích cho anh em tham khảo trong quá trình thiết kế blogspot.

Thủ Thuật Miễn Phí

Mình là sinh viên Đại học Haui K14

Hướng dẫn Tạo VPS Windows 11 1h ( 6GB Ram - 4 Core ) | How to create VPS Windows 11

Hướng dẫn sao lưu và khôi phục Blogger

Giao diện (Theme)

Sao lưu giao diện blogger

Khôi phục giao diện blogger

Nội dung: bài viết, trang và bình luận

Sao lưu nội dung blogger

Khôi phục nội dung blogger

Hướng dẫn thay Favicon cho Blogger

Favicon là gì

Hướng dẫn thay Favicon cho Blogger

Tạo favicon

Hướng dẫn thay favicon cho Blogger

Thắc mắc

Tổng hợp các thẻ điều kiện Blogger 2021

Các loại thẻ Blogger cơ bản

Thẻ IF / ELSE

Thẻ Loop

Thẻ Tag

Thẻ Class

Thẻ Includable

Các loại thẻ điều kiện Blogger

Cấu trúc dữ liệu data:view

Một số ví dụ về các thẻ điều kiện

Trích xuất dữ liệu từ liên kết đính kèm (enclosure link)

Trích xuất nội dung bài viết

THÔNG TIN

Nhãn

Xem Nhiều Trong Tuần

Liên Kết Bạn Bè