Latest Post

Craper là một template blogspot với giao diện sáng,  phong cách lưới và tối giản trong cách bố trí bài viết. Đây là một template với thiết kế hoàn toàn responsive để có thể tương thích với bất cứ kích thước màn hình nào, như màn hình PC, laptop, tablet hay smartphone. Craper cũng đã được tối ưu hóa SEO.

Template Blogspot - Craper - Phong cách lưới - Responsive
Craper là một lựa chọn lý tưởng cho các trang web phong cách gallery, danh mục,  nhiếp ảnh, thiết kế mỹ thuật và các trang web cá nhân.

Thông tin khác về Template Craper cho Blogspot:

  • Thiết kế dạng lưới, tất cả nội dung nằm ở trang chủ
  • Hộp tìm kiếm nổi bật
  • Thiết kế đơn giản và tối ưu
  • Giao diện 2 cột
  • Các vị trí banner quảng cáo đã có sẵn
  • Tối ưu hóa SEO
  • Thiết kế hoàn toàn Responsive
  • Bài viết phổ biến
  • Sử dụng HTML5 và CSS3 mới nhất
  • Các button theo dõi mạng xã hội
  • Sidebar bên phải
  • Không có Footer
  • Điều hướng trang
  • Hệ thống bình luận G+
  • Thanh menu ở top và xổ xuống
  • Tác giải bài viết kèm hình ảnh
  • Tương thích với các trình duyệt phổ biến
  • Lý tưởng cho các trang web gallery, danh mục, thiết kế mỹ thuật và trang web cá nhân
  • Màu chủ đạo: Trắng và ánh sáng màu xanh

Soloris là một template chuẩn SEO miễn phí, với thiết kế hoàn toàn responsive và giao diện theo phong cách tạp chí. Soloris có thiết kế 2 cột đi kèm với nhiều tính năng cao cấp như slider, breadcrumbs hay các widget tùy chỉnh.

Soloris với thiết kế thời trang của nó có thể được sử dụng trên tạp chí trực tuyến, danh mục đầu tư, nhiếp ảnh, điện ảnh, công nghệ, đánh giá, nghệ thuật.

Thông tin khác về Template Soloris cho Blogspot

  • Thiết kế phong cách tạp chí
  • Trang chủ có Slider sử dụng Flexslider
  • Giao diện 2 cột
  • Các vị trí đặt banner quảng cáo có sẵn
  • Phổ biến bài viết
  • Footer 4 cột
  • Tối ưu hóa công cụ tìm kiếm
  • Thiết kế hoàn toàn Responsive
  • Bài viết gần đây
  • Sidebar bên phải
  • Thanh menu xổ xuống
  • Tương thích với các trình duyệt phổ biến
  • Icons chia sẻ mạng xã hội
  • Thanh News Sticker
  • Tùy biến dễ dàng
  • Phù hợp tốt nhất cho tạp chí trực tuyến, danh mục đầu tư, nhiếp ảnh, điện ảnh, công nghệ, đánh giá, các trang web liên quan đến nghệ thuật
  • Màu chủ đạo: Đỏ, trắng và đen

Nếu bạn là quản lý của một công ty và đang tạo nên thương hiệu cho doanh nghiệp của mình, thì chắc chắn việc đưa địa chỉ doanh nghiệp của mình lên Google Maps là thực sự rất cần thiết. Việc doanh nghiệp của bạn xuất hiện trên Google Maps sẽ giúp người tìm kiếm biết được địa chỉ chính xác của doanh nghiệp bạn khi họ tìm kiếm, điều này cũng tạo nên sự chuyên nghiệp cho doanh nghiệp của bạn và cực tốt cho Local SEO.

Hướng dẫn đưa địa chỉ doanh nghiệp lên Google Maps

Những gì bạn cần chuẩn bị để đưa địa chỉ doanh nghiệp lên Google Maps?

  1. Địa chỉ chính xác của trụ sở doanh nghiệp
  2. Mã bưu chính chính xác tại khu vực của bạn (Vì Việt Nam chỉ hỗ trợ hình thức gởi thư, và việc ghi bưu chính chung chung làm rất nhiều doanh nghiệp không nhận được thư từ Google). Xem mã bưu chính chính xác tại đây: Hướng dẫn lấy mã bưu chính chuẩn tại Việt Nam
  3. Một số cái khác như logo công ty, địa chỉ trang web...

Hướng dẫn đưa địa chỉ doanh nghiệp lên Google Maps

- Truy cập vào đỉa chỉ này và click vào nút đăng ký: https://www.google.com/business/placesforbusiness/

Đăng ký doanh nghiệp lên Google Maps
- Đăng nhập tài khoản Gmail của bạn vào
- Thử tìm kiếm tên doanh nghiệp của bạn trên Google Maps, nếu không có, hãy Thêm doanh nghiệp của bạn ở cuối kết quả tìm kiếm
Thêm doanh nghiệp vào Google Maps

- Điền đầy đủ thông tin doanh nghiệp của bạn vào

Thêm doanh nghiệp vào Google Maps

Chú ý, mã bưu chính phải lấy chính xác theo hướng dẫn ở đường link mình đưa lúc nãy nhé, để việc xác nhận doanh nghiệp dễ dàng, tránh thất lạc thư của Google!
- Khi bạn xác nhận, có thể địa chỉ doanh nghiệp sẽ không tìm thấy trên bản đồ, lúc đó hãy click vào thông báo và di chuyển địa chỉ đến đúng vị trí của doanh nghiệp nhé.
- Tiếp theo sẽ khu vực cung cấp hàng hóa dịch vụ của doanh nghiệp, chổ nào có thì cứ thêm vào cho hoàn thành nhé.
Thêm doanh nghiệp vào Google Maps
- Sau khi hoàn thành các bước trên thì click vào Gửi thư xác minh thôi. Bạn có thể phải đợi 5 ngày cho tới 2 tuần để thư có thể đến (trong trường hợp mã bưu chính chính xác).
Gửi thư xác minh Google Maps

- Sau khi đã nhận được thư thì bạn sẽ có 1 mã PIN và 1 địa chỉ để xác nhận mã PIN, hãy làm theo hướng dẫn bên trong đó là được ^_^

Chúc các bạn thành công khi đưa doanh nghiệp của mình lên Google!

Mã bưu chính là điều vô cùng cần thiết khi bạn sử dụng các dịch vụ trên thế giới, trong đó có các dịch vụ của Google như Google Adsense, Google Maps để nhận mã PIN xác nhận. Tại Việt Nam, nếu bạn sử dụng các dịch vụ trên thì trong quá trình gởi thư từ Google có thể dẫn tới thất lạc nếu bạn không đưa một mã bưu chính chính xác cho Google, làm cho việc xác nhận có thể diễn ra trong vài tháng, quá lâu! Vì vậy việc xác định chính xác mã bưu chính ở khu vực mình sống là điều vô cùng cần thiết.

Hướng dẫn lấy mã bưu chính chuẩn cho Việt Nam

Hướng dẫn lấy mã bưu chính chuẩn tại Việt Nam

- Bạn hãy truy cập vào địa chỉ này: http://www.geopostcodes.com/Vietnam và tiến hành truy cập lần lượt qua từng vùng trong danh sách hoặc thực hiện tìm kiếm, mình chọn cách tìm kiếm:

Hướng dẫn lấy mã bưu chính chuẩn cho Việt Nam

Mình tìm kiếm từ Quận 10, và ra được kết quả như trên, bấm luôn vào đường dẫn Quận 10 nhé.

- Và đây sẽ là danh sách các phường (Xã) có trong khu vực mình tìm kiếm. Mình đang ở Q10, phường 6, vậy thì click vào "Số 6"

Hướng dẫn lấy mã bưu chính chuẩn cho Việt Nam

- Sau khi chọn phường, thì đây chính là nơi cung cấp mã bưu chính chính xác cho từ đường, địa chỉ, hẻm thuộc phường đó. Cực kỳ chi tiết:

Hướng dẫn lấy mã bưu chính chuẩn cho Việt Nam

Công việc còn lại của các bạn chỉ là lấy mã bưu chính tương ứng với khu vực mình sống và cung cấp cho các dịch vụ cần đến mã bưu chính chính xác như Google Adsense hay Google Maps (Xác minh địa chỉ doanh nghiệp trên bản đồ) thôi. 

Gaps là một template blogspot với giao diện rất thân thiện và thiết kế đơn giản, thanh lịch. Với thiết kế cao cấp và hoàn toàn responsive, Gaps sẽ là một trong những template cho blogspot chủ đề tạp chí cực tốt. Và template Gaps mang đến những tính năng cao cấp và hoàn toàn tối ưu hóa với các công cụ tìm kiếm.

Template Gaps có thể được sử dụng trên tạp chí trực tuyến, tin tức, các trang công nghệ, review và các trang web nội dung phong phú.

Xem thêm:

Thông tin khác về Template Gaps cho Blogspot:

  • Phong cách thiết kế tạp chí
  • Tự động resize ảnh cho Thumbnails bài viết
  • Giao diện 2 cột
  • Thanh menu xổ xuống
  • Bài viết phổ biến
  • Vị trí đặt quảng cáo có sẵn
  • Hệ thống bình luận G+ và FB
  • Tối ưu hóa công cụ tìm kiếm
  • Thiết kế hoàn toàn Responsive
  • Hình ảnh và thông tin về tác giả bài viết
  • Sidebar bên phải
  • Footer 3 cột
  • Có mục News Sticker
  • Bài viết liên quan
  • Tương thích với các trình duyệt phổ biến
  • Icons chia sẻ mạng xã hội
  • Thanh diều hướng trang
  • Trang 404 tùy chỉnh
  • Giao diện dễ sử dụng
  • Sử dụng tốt nhất cho tạp chí, tin tức, trang web công nghệ, các trang web review trực tuyến
  • Màu chủ đạo: Đen, xanh và trắng

Breeze là một template blogspot miễn phí, rất chuyện nghiệp với thiết kế hoàn toàn responsive. Template Breeze có 2 bản - Hình nền cố định và hình nền thay đổi. Với phong cách landing page, bố trí khoa học và đẹp, đây là một lựa chọn cực tốt cho những trang blog dành cho cá nhân hoặc doanh nghiệp để tiếp thị sản phẩm.

Xem thêm:

Thông tin thêm về Template Breeze cho Blogspot:

  • Thiết kế landing page, thanh lịch
  • Tự động resize ảnh cho thumbnails
  • Giao diện 2 cột
  • Thanh menu xổ xuống
  • Bài viết phổ biến
  • Có sẵn các vị trí đặt quảng cáo
  • Tối ưu hóa công cụ tìm kiếm
  • Giao diện hoàn toàn responsive
  • Thông tin tác giả bài viết
  • Sidebar bên phải
  • Footer 3 cột
  • Slider bài viết liên quan cuối mỗi bài viết
  • Hệ thống bình luận G+
  • Tương thích với các trình duyệt phổ biến
  • Icons chia sẻ mạng xã hội
  • Điều hướng trang
  • Hộp tìm kiếm tự động mở rộng khi trỏ chuột vào
  • Trang lỗi 404 tùy chỉnh
  • Theo dõi qua email
  • Phù hợp nhất cho cá nhân, tiếp thị, doanh nghiệp và các trang web loại tạp chí đơn giản
  • Màu sắc không giới hạn

Đôi khi vì một số lý do nào đó mà bạn chỉ muốn một hay một số widget hiển thị ở trang này nhưng không hiển thị ở trang kia. Ví dụ với widget quảng cáo Google Adsense, Google không cho phép hiển thị quảng cáo ở các trang lỗi 404. Tuy nhiên, nếu thêm widget vào thanh sidebar hay footer, thì nó sẽ hiển thị ở tất cả các trang, kể cả trang lỗi 404. Đó là lý do bạn phải tìm cách không cho hiển thị quảng cáo trong trang 404, tránh việc bị Google phạt.

Cách tùy chỉnh widget hiển thị trong Blogspot bằng CSS

Đầu tiên nên tìm hiểu một số code hiển thị nội dung bằng HTML trong Blogspot :

Chúng ta có một số code HTML hiển thị nội dung như sau:
- Code chỉ hiển thị nội dung ở trang chủ:
<b:if cond='data:blog.url == data:blog.homepageUrl'> nội dung sẽ hiển thị </b:if>
- Code chỉ hiển thị nội dung ở trang bài viết:
<b:if cond='data:blog.pageType == "item"'> nội dung sẽ hiển thị </b:if>
- Code chỉ hiển thị nội dung ở trang label:
 <b:if cond='data:blog.searchLabel'> nội dung sẽ hiển thị </b:if>
- Code chỉ hiển thị nội dung ở trang Static:
<b:if cond='data:blog.pageType == "static_page"'> nội dung sẽ hiển thị </b:if>
- Code chỉ hiển thị nội dung ở trang lưu trữ:
<b:if cond='data:blog.pageType == "archive"'> nội dung sẽ hiển thị </b:if>
- Code chỉ hiển thị nội dung ở trang lỗi 404:
<b:if cond='data:blog.pageType == "error_page"'> nội dung sẽ hiển thị </b:if>
- Code hiển thị nội dung ở trang chủ, label, lưu trữ:
 <b:if cond='data:blog.pageType == "index"'> nội dung sẽ hiển thị </b:if>
- Còn đây là code chỉ hiển thị nội dung ở một trang url bạn chỉ định:
<b:if cond='data:blog.url == "URL của trang riêng biệt"'> nội dung sẽ hiển thị </b:if>
Trên đây là những code dùng để hiển thị nội dung ở một số trang trong Blogspot.

Vậy code không cho phép hiển thị nội dung là gì?

Trong Blogspot quy định, code hiển thị nội dung sẽ được sử dụng với dấu "==", còn với code không hiển thị nội dung thì sẽ được sử dụng với dấu "!=". Vậy có nghĩa là gì? Nghĩa là bạn chỉ cần thay dấu "==" sau phần data:blog... ở các đoạn code tương ứng trên bằng dấu "!=" thì sẽ đổi thành code không cho phép hiển thị nội dung!
Ví dụ, đây là code không hiển thị nội dung ở trang lỗi 404:
<b:if cond='data:blog.pageType != "error_page"'> nội dung sẽ hiển thị </b:if>

Cách tùy chỉnh widget hiển thị trong Blogspot bằng CSS

Có nhiều cách để áp dụng việc ẩn hiện widget ở một số khu vực nào đó, bạn có thể trực tiếp thêm các đoạn code ở trên vào các widget bạn muốn, hoặc bạn sẽ sử dụng CSS như dưới đây:
- Thêm đoạn code này vào trước thẻ </body>
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#HTML1 {display: none;}
</style>
</b:if>
Trong đó:
+ {display:none;} sẽ làm ẩn nội dung của id HTML1. Tương tự, bạn có thể thêm tất cả các widget khác vào ngay sau #HTML1, ngăn cách nhau bởi dấu phẩy là được.
+ <b:if cond='data:blog.pageType == "item"'> bạn sẽ thay bằng đoạn code ẩn, hiện nội dung như các đoạn code ở trên. Với đoạn code ở ví dụ này, có nghĩa là cho phép hiển thị widget HTML1 tại trang bài viết!

- Ví dụ với đoạn code này:
Statac Page
Ở dòng 5674, đây là dòng cho phép hiển thị ở trang Static. Tuy nhiên ở dòng 5676, các thành phần như thông tin cuối bài viết, khung bình luận, nút like FB, G+ mình sử dụng display:none, nghĩa là tất cả mọi thứ đều được hiển thị ở trang Static, ngoại trừ những cái trên ^_^ Trang static của mình là trang này: www.tranbadat.info/p/search.html
Có lẽ sau khi đọc xong bài viết này bạn đã hiểu cách tùy chỉnh widget hiển thị trong Blogspot, nhằm tùy chỉnh cho phù hợp với website của mình. Nếu có thắc mắc gì thì cmt bên dưới nhé :)

Với Google Adsense, việc tối ưu doanh thu để làm tăng thu nhập cho chính mình chắc chắn là điều ai cũng muốn. Với mỗi trang, tối đa có được 3 đơn vị Adsense về nội dung được hiển thị, điều này người sử dụng đã nắm rõ.

Cách tối ưu doanh thu Google Adsense: Dùng Google Search Box

Vậy ngoài cách đặt các đơn vị Adsense nội dung để tối ưu doanh thu thì còn cách gì khác?

Trong chính sách của mình, Google quy định, với mỗi trang, được quyền có tối đa 3 đơn vị Adsense nội dung, 3 đơn vị quảng cáo liên kết và 2 hộp tìm kiếm (Google Search Box). Vậy tức là sao? Có nghĩa là doanh thu không chỉ đến từ việc hiển thị các nội dung và lượt click vào các nội dung được cung cấp bởi Google Adsense nội dung và liên kết, mà doanh thu còn đến từ Google Search Box.

Google Search Box ( Hộp tìm kiếm tùy chỉnh)

Đó là một công cụ tìm kiếm được tích hợp vào chính trang web của các bạn, dùng để tìm kiếm những nội dung mà người dùng cần, nội dung này có thể đến từ toàn bộ các trang web, hoặc chỉ một vài trang mà bạn chỉ định.
Google sẽ dựa vào từ khóa tìm kiếm mà hiển thị quảng cáo phù hợp với nó trong kết quả tìm kiếm, tăng tỉ lệ click quảng cáo, và ngoài ra cũng có cả thu nhập từ lượt sử dụng Google Search Box nữa. Đây chính là một cách tối ưu doanh thu Google Adsense.

Cách tạo Google Search Box để tối ưu doanh thu Adsense

- Truy cập trang Google Adsense tại địa chỉ: http://google.com/adsense
- Vào tab Quảng cáo của tôi, tiếp tục vào Các sản phẩm khác, tại đây, hãy thêm Tìm kiếm tùy chỉnh vào cho tài khoản Adsense của bạn
- Sau khi đã có mục Tìm kiếm, hãy vào Công cụ tìm kiếm tùy chỉnh, tiếp tục chọn Tạo công cụ tìm kiếm tùy chỉnh:
Tạo công cụ tìm kiếm tùy chỉnh

- Điền đầy đủ thông tin như ảnh dưới đây, phần Thông tin tìm kiếm bạn có thể tùy chỉnh toàn bộ trang hoặc một vài trang bạn chỉ định
Thuộc tính tìm kiếm

- Phần Các kênh tùy chỉnh, bạn có thể tùy chỉnh theo các kênh có sẵn nếu bạn đã thiết lập trước đó

- Phần Kiểu hộp tìm kiếm, nên chọn kiểu đầu tiên để thuận tiện cho việc tìm kiếm của người xem, chú ý, phần chiều dài của hộp văn bản, bạn phải thử vài lần để xác định chiều dài nào mới phù hợp với vị trí mình đặt searchbox nhé.
Google Search Box

- Kiểu quảng cáo: Làm biếng thì cứ để mặc định cho khỏe ^^
- Kết quả tìm kiếm: Phần này khá quan trọng, bạn nên chọn Hiển thị kết quả trên trang web của tôi bằng khung nội tuyến, nhằm mục đích giảm tỷ lệ thoát!

Google Search Box

Phần URL, tại đây bạn sẽ đặt đường dẫn cho kết quả hiển thị của Google, ở đây mình hướng dẫn cho Blogspot nên đường dẫn hiển thị sẽ là một trang mới của Blog, mình đặt nó là search nên có đường dẫn là http://www.tranbadat.info/p/search.html, các bạn tạo bằng tên gì thì cứ thay vào đó thôi.

- Nhấn lưu và lấy mã sau khi đã hoàn thành các công việc trên, bạn sẽ nhận được 2 đoạn code.

Google Search Box

Với đoạn code đầu, hãy chèn vào vị trí bạn muốn xuất hiện Google Search Box.
Với đoạn code 2, bạn hãy copy toàn bộ code này paste vào trang mà mình tạo đường dẫn hiển thị kết quả của Google, của mình là search đó (Nhớ là paste vào tab HTML)

Google Search Box

Xong, thế là bạn đã có Hộp tìm kiếm Google Search Box để tối ưu doanh thu cho Google Adsense rồi đấy. Nếu bạn muốn đặt nó vào hộp tìm kiếm sẵn có của trang web mình thì có thể tùy chỉnh 1 tí để thay vào nhé. Hộp tìm kiếm tùy chỉnh của mình ngay thanh menu đó!

Để có thể dễ dàng SEO Blogspot, việc tối ưu các thẻ H1, H2 cho Blogspot là cực kỳ cần thiết. Ở đây, với thẻ H1 sẽ cho tiêu đề của các trang bài viết hoặc Static, còn thẻ H2 sẽ cho tiêu đề trang chủ, trang label và trang lưu trữ. Đối với các bài viết, thì thẻ H2 này chính là tiêu đề của các widget trên sidebar, footer...

Hướng dẫn tối ưu thẻ H1, H2 cho Blogspot

Làm thế nào để tối ưu các thẻ H1, H2 cho Blogspot?

- Truy cập vào trang quản trị Blogger.
- Tiếp tục vào Mẫu (Template), và Chỉnh sửa HTML (Edit HTML)

Chỉnh sửa HTML Blogspot

- Backup hết toàn bộ code để đề phòng lúc chỉnh sửa bị lỗi thì còn phục hồi lại nhé.
- Tìm đoạn code sau:
class='post hentry'
Nó sẽ nằm trong thẻ div như thế này: <div class='post hentry'>
- Thay thế toàn bộ đoạn thẻ div trên bằng đoạn code này:
<div class='post hentry' itemprop='blogPost' itemscope='itemscope'itemtype='http://schema.org/BlogPosting'>
<meta expr:content='data:post.firstImageUrl' itemprop='image_url'/> 

- Tiếp tục tìm đoạn code này hoặc đoạn code nào đó tương tự như thế:
<b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>
    <b:if cond='data:post.link'>
      <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
      <data:post.title/>
    </b:if>
   </h3>
  </b:if>
Nếu là các template mới thì có thể nó sẽ như thế này:
<b:if cond='data:post.title'>
<h3 class='post-title entry-title' itemprop='name'>
<b:if cond='data:post.link or (data:post.url and data:blog.url != data:post.url)'>
<a expr:href='data:post.link ? data:post.link : data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
- Thay thế toàn bộ đoạn code tìm được đó bằng đoạn code đã tối ưu này:
<b:if cond='data:post.title'>
                     <b:if cond='data:blog.pageType == &quot;index&quot;'>
    <h2 class='post-title entry-title' itemprop='name'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link' itemprop='url'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
<a expr:href='data:post.url' itemprop='url'><data:post.title/></a>
<b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
     </h2>
                       <b:elseif cond='data:blog.pageType == &quot;archive&quot;'/>
<h2 class='post-title entry-title' itemprop='name'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link' itemprop='url'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
<a expr:href='data:post.url' itemprop='url'><data:post.title/></a>
<b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h2>
<b:else/>
<h1 class='post-title entry-title' itemprop='name'>
     <b:if cond='data:post.link'>
       <data:post.title/>
     <b:else/>
        <b:if cond='data:post.url'>
         <data:post.title/>
<b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h1>
</b:if>
                    </b:if>
- Lưu template lại, và thế là bạn đã hoàn thành việc tối ưu hóa thẻ H1, H2 cho Blogspot của bạn rồi đấy ^_^

Hôm nay mình sẽ hướng dẫn các bạn thêm một hộp tìm kiếm cho Blogspot (Có kèm theo các button theo dõi mạng xã hội nhé), để thuận tiện cho người xem có thể tìm kiếm thứ mình cần trên Blogspot của các bạn! Hướng dẫn vô cùng dễ dàng, không tốn nhiều công sức để tạo ra một hộp tìm kiếm đơn giản đâu.

Làm thế nào tạo hộp tìm kiếm cho Blogspot?

- Đầu tiên lúc nào cũng là truy cập vào trang quản trị Blogger đã.
- Tiếp tục vào phần Bố cục (Layout), chọn vị trí bạn muốn thêm hộp tìm kiếm, click vào Thêm tiện ích (Add a gadget):

- Chọn HTML/JavaScript, và thêm đoạn code này vào:
<style>
#tbg-social{ width:350px;}ul.tbg-social{margin:0;padding:0;list-style:none;-webkit-perspective: 10000px; -moz-perspective: 10000px;-o-perspective: 10000px;perspective: 10000px;}
ul.tbg-social li{display: inline-block;width: 55px; height: 50px;margin-right: -px; background: white;font: bold 36px Arial;
text-transform: uppercase;text-align: center;cursor: pointer;}
ul.tbg-social li a{display:block;width: 100%;height: 100%;color: black;text-decoration: none;outline: none;-webkit-transition:all 300ms ease-out 0.1s; -moz-transition:all 300ms ease-out 0.1s;-o-transition:all 300ms ease-out 0.1s;transition:all 300ms ease-out 0.1s;}
ul.tbg-social li a span{-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;padding-top: 5px; display:block;width: 100%;height: 100%;-webkit-transition:all 300ms ease-out 0.1s;-moz-transition:all 300ms ease-out 0.1s;-o-transition:all 300ms ease-out 0.1s;transition:all 300ms ease-out 0.1s;}
ul.tbg-social li a img{border-width: 0;}
ul.tbg-social li:hover a{-moz-transform: rotateY(180deg); -webkit-transform: rotateY(180deg);transform: rotateY(180deg);background: #cef1ff; -webkit-border-radius:7px;-moz-border-radius:7px;border-radius:7px;-webkit-box-shadow:0 0 5px #eee inset;-moz-box-shadow:0 0 5px #eee inset;box-shadow:0 0 5px #eee inset;
}ul.tbg-social li:hover a span{-moz-transform: rotateY(90deg); -webkit-transform: rotateY(90deg);transform: rotateY(90deg);}
#tbguide-searchbox { border-radius: 5px; background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRNAPeFfD2hpUr4W7KdaBP2m8931DyHRB7p770QY2t2Wk4Uyum9KHMmJni1GxV68Lf_zOC26PZzJ7_Gw82kqG92RSGM1aKagE0wSUCLa36QVBrooEgh2FkrY0DZZ5F0vqxmP9dKbF0lovB/s1600/search_box_psd_12.jpg) no-repeat scroll center center transparent; width: 290px; height: 50px; disaply: block;}
form#tbguide-searchform { display: block; padding: 7px 16px; margin: 0;}
form#tbguide-searchform #s { padding-left: 24px !important; padding: 7.5px; margin: 0; width: 198px; font-size: 16px; font-family: georgia; font-style: italic; color: #666666; vertical-align: top; border: none; background: transparent;}form#tbguide-searchform#sbutton { margin: 0; padding: 0; height: 40px; width: 74px; vertical-align: top; border: none; background: transparent;}</style>
<div id="tbg-social"><center><a style="font-size:25px;" >Find Us Here </a>
</center><br />
<ul class="tbg-social"><li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8XeKfXWPqaEW9A0CdvmyuFNAYD7h-y0qfzSSsgOCBVnw2Ido3MSVx9Bp0lMa10sAvYz1sKDzR1YdSjKS0I3Sie5E1RFmtgxNFNgsJ_YZ3b8tAxvMYfR_AQSuWdscy5mapl8jmvc4txXn0/s1600/tbguide-social-buttons-facebook.jpg" title="Facebook" /></a></li>
<li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhglFXi4ggJ12QguAqTlQpko1pgGlItfajdWNfYxhavWNrDZ_LYkXVNbTv_CSVKr1Mz5Nx8Fs4SzA3FFenQ_0ZczGqyBI7pFov1QDZrJqbFkiqxQkGU_noInBBBFpK3zOpicj31j6_-M_3L/s1600/tbguide-social-buttons-stumble.jpg" title="stumble" /></a></li>
<li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaTDPXV1qJ6pSs9QDs3melXWyTvWCFMs5iWgW2qe6nv-QXo-mlsKW6khpe0KFsViqe74edL3yYAhTHy6G-rMpQDEUU2QAFwGAyC84UfkSQVW3cpVOZf9mTYAXmbBMLkXVtXhBoBHXMgJRW/s1600/tbguide-social-buttons.jpg" title="twitter" /></a></li>
<li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxxOoKgiltlJMWqJbC78T2ohyphenhyphenzvzX6gtRZazaGEgsLznd7pz0et_RvQ5YkJyje3wEaA_qp-CMyWpozKx2ggc7IYeyPL59sh6vY4d35ULle1_iMTX6xmi86vkJ_vxad-_Gn42zYX9Ibiq55/s1600/tbguidesocial-buttons-google.jpg" title="Google Plus" /></a></li>
<li><a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5bJsS-UlPb6s4oVOW_TP3KFWXoVd3k0kRlG8CgiGbRXSf4XHABF8n_ii4L8RD8EiTJd5jGSvE5zuFMNfD5rnTgbDvCrKrG1lc_AmTmCpHfbyzk1BRYuo2Lho5Uw17onGRX1FygyasnqWl/s1600/tbguidesocial-buttons-rss.jpg" title="Add RSS Feed" /></a></li>
</ul><div id="tbguide-searchbox"><form action="/search" id="tbguide-searchform" method="get">
<input id="s" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;&quot;Search..;}" onfocus="if (this.value == &quot;Search...&quot;) {this.value = &quot;&quot;}" type="text" value="" />
<input id="sbutton" src="http://img1.blogblog.com/img/blank.gif" type="image" /> </form></div></div>
Bạn thay các dấu # thành các đường link đến các mạng xã hội của bạn nhé.

- Cuối cùng là lưu lại! Và tận hưởng thành quả, bạn đã có một hộp tìm kiếm đơn giản cho Blogspot rồi đấy!

Proximatemplate blogspot miễn phí có thể sử dụng cho nhiều chủ đề khác nhau. Proxima có thiết kế thân thiện, hoàn toàn responsive tương thích với tất cả các loại màn hình. Các hiệu ứng hình ảnh khá chuyên nghiệp.

Template Proxima cho Blogspot
Proxima blogger template là một sự lựa chọn lý tưởng cho các trang web về game, công thức nấu ăn, tin tức, review, nghệ thuật và nhiếp ảnh.

Thông tin khác về template Proxima cho Blogspot:

  • Thiết kế phong cách Gallery và Danh mục
  • Tự động lấy ảnh làm ảnh đại diện cho bài việt
  • Giao diện 2 cột
  • Thanh menu xổ xuống
  • Bài viết mới nhất với slider dạng zoom ảnh
  • Vị trí đặt banner quảng cáo có sẵn
  • Tối ưu hóa công cụ tìm kiếm
  • Giao diện hoàn toàn responsive
  • Thông tin tác giả 
  • Sidebar bên phải
  • Footer 3 cột
  • Có News Ticker
  • Bài viết liên quan
  • Hệ thống bình luận Blogger
  • Tương thích với các trình duyệt phổ biến
  • Button theo dõi và các icon chia sẻ lên mạng xã hội 
  • Thanh điều hướng trang
  • Hộp tìm kiếm
  • Bài viết phổ biến, Nhãn và Lưu trữ bên thanh Sidebar!
  • Trang lỗi 404 tùy chỉnh

Đây là hướng dẫn tạo sitemap cho Blogspot nhằm cung cấp cho các công cụ tìm kiếm sơ đồ trang blog của bạn, nó sẽ giúp điều hướng bots và hỗ trợ SEO Blogspot tốt hơn. Ngoài ra, với sitemap này, đây có thể nói là một trang điều hướng cho các bài viết của bạn, nó sẽ hiển thị theo label, tên đầy đủ các bài viết trong từng label, giao diện khá đẹp nhé ^^

Tạo sitemap cho Blogspot - SEO Blogger
Với sitemap cho Blogspot này, mọi thứ đều hoàn toàn tự động, mỗi bài viết sau khi được public lên sẽ tự được thêm vào để cung cấp thông tin cho các bọ tìm kiếm!

Làm sao để tạo sitemap cho Blogspot?

- Truy cập vào trang quản trị Blogger
- Chọn Trang, tiếp tục tạo Trang mới
Tạo trang cho Blogspot

- Xuất hiện khu vực như khu vực viết bài mới của chúng ta, hãy thêm đoạn code này vào phần nội dung (Nhớ là tab HTML nhé):
<style>
p.labels a{color: #242424; text-transform: uppercase;font-size: 15px;}
a.post-titles {color: #0000FF;}
ol li{list-style-type:decimal;line-height:25px;}
</style>
<script>
//<![CDATA[
var postTitle=new Array();var postUrl=new Array();var postPublished=new Array();var postDate=new Array();var postLabels=new Array();var postRecent=new Array();var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;function bloggersitemap(a){function b(){if("entry" in a.feed){var d=a.feed.entry.length;numberfeed=d;ii=0;for(var h=0;h<d;h++){var n=a.feed.entry[h];var e=n.title.$t;var m=n.published.$t.substring(0,10);var j;for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="alternate"){j=n.link[g].href;break}}var o="";for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="enclosure"){o=n.link[g].href;break}}var c="";if("category" in n){for(var g=0;g<n.category.length;g++){c=n.category[g].term;var f=c.lastIndexOf(";");if(f!=-1){c=c.substring(0,f)}postLabels[ii]=c;postTitle[ii]=e;postDate[ii]=m;postUrl[ii]=j;postPublished[ii]=o;if(h<10){postRecent[ii]=true}else{postRecent[ii]=false}ii=ii+1}}}}}b();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write('</br>')}function filterPosts(a){scroll(0,0);postFilter=a;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(d){function c(e,g){var f=postTitle[e];postTitle[e]=postTitle[g];postTitle[g]=f;var f=postDate[e];postDate[e]=postDate[g];postDate[g]=f;var f=postUrl[e];postUrl[e]=postUrl[g];postUrl[g]=f;var f=postLabels[e];postLabels[e]=postLabels[g];postLabels[g]=f;var f=postPublished[e];postPublished[e]=postPublished[g];postPublished[g]=f;var f=postRecent[e];postRecent[e]=postRecent[g];postRecent[g]=f}for(var b=0;b<postTitle.length-1;b++){for(var a=b+1;a<postTitle.length;a++){if(d=="titleasc"){if(postTitle[b]>postTitle[a]){c(b,a)}}if(d=="titledesc"){if(postTitle[b]<postTitle[a]){c(b,a)}}if(d=="dateoldest"){if(postDate[b]>postDate[a]){c(b,a)}}if(d=="datenewest"){if(postDate[b]<postDate[a]){c(b,a)}}if(d=="orderlabel"){if(postLabels[b]>postLabels[a]){c(b,a)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];firsti=a;do{a=a+1}while(postLabels[a]==temp1);b=a;sortPosts2(firsti,a);if(b>postTitle.length){break}}}function sortPosts2(d,c){function e(f,h){var g=postTitle[f];postTitle[f]=postTitle[h];postTitle[h]=g;var g=postDate[f];postDate[f]=postDate[h];postDate[h]=g;var g=postUrl[f];postUrl[f]=postUrl[h];postUrl[h]=g;var g=postLabels[f];postLabels[f]=postLabels[h];postLabels[h]=g;var g=postPublished[f];postPublished[f]=postPublished[h];postPublished[h]=g;var g=postRecent[f];postRecent[f]=postRecent[h];postRecent[h]=g}for(var b=d;b<c-1;b++){for(var a=b+1;a<c;a++){if(postTitle[b]>postTitle[a]){e(b,a)}}}}function displayToc(a){var l=0;var h="";var e="Post Title";var m="Click to sort by title";var d="Date";var k="Click to sort by date";var c="Category";var j="";if(sortBy=="titleasc"){m+=" (descending)";k+=" (newest first)"}if(sortBy=="titledesc"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="dateoldest"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="datenewest"){m+=" (ascending)";k+=" (oldest first)"}if(postFilter!=""){j="Click to view all"}h+="<table>";h+="
<tr>";h+='<td class="header1">';h+='<a href="javascript:toggleTitleSort();" title="'+m+'">'+e+"</a>";h+="</td>";h+='<td class="header2">';h+='<a href="javascript:toggleDateSort();" title="'+k+'">'+d+"</a>";h+="</td>";h+='<td class="header3">';h+='<a href="javascript:allPosts();" title="'+j+'">'+c+"</a>";h+="</td>";h+='<td class="header4">';h+="Read all";h+="</td>";h+="</tr>
";for(var g=0;g<postTitle.length;g++){if(a==""){h+='
<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>
';l++}else{z=postLabels[g].lastIndexOf(a);if(z!=-1){h+='
<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>
';l++}}}h+="</table>
";if(l==postTitle.length){var f='<span class="toc-note">Show All '+postTitle.length+" Posts<br/></span>"}else{var f='<span class="toc-note">Show '+l+" posts by category '";f+=postFilter+"' the "+postTitle.length+" Total Posts<br/></span>"}var b=document.getElementById("toc");b.innerHTML=f+h}function displayToc2(){var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];document.write("<p/>");document.write('<p class="labels">
<a href="/search/label/'+temp1+'">'+temp1+"</a></p>
<ol>");firsti=a;do{document.write("
<li>");document.write('<a class="post-titles" href="'+postUrl[a]+'">'+postTitle[a]+"</a>");if(postRecent[a]==true){document.write(' - <strong><span style="color: rgb(255, 0, 0);">New!</span></strong>')}document.write("</li>
");a=a+1}while(postLabels[a]==temp1);b=a;document.write("</ol>
");sortPosts2(firsti,a);if(b>postTitle.length){break}}}function toggleTitleSort(){if(sortBy=="titleasc"){sortBy="titledesc"}else{sortBy="titleasc"}sortPosts(sortBy);displayToc(postFilter)}function toggleDateSort(){if(sortBy=="datenewest"){sortBy="dateoldest"}else{sortBy="datenewest"}sortPosts(sortBy);displayToc(postFilter)}function showToc(){if(tocLoaded){displayToc(postFilter);var a=document.getElementById("toclink")}else{alert("Just wait... TOC is loading")}}function hideToc(){var a=document.getElementById("toc");a.innerHTML="";var b=document.getElementById("toclink");b.innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">?? Display Table of Contents</a> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_YqoAnW8EHm5ljH-UF_qnXeipunyEhmWZSFalbYi7_YYCyNa35YhBkpAZXu25LbGcgEVK1WnGlrJnTAQae5d3MIHMpRoeb7IvOcMdgfyqc5DeqVuzzhQlNmplnHSO92NXF0xUCjlN3PyI/s1600/new_icon.gif"/>'}function looptemp2(){for(var a=0;a<numberfeed;a++){document.write("<br>");document.write('Post Link : <a href="'+postUrl[a]+'">'+postTitle[a]+"</a><br>");document.write('Read all : <a href="'+postPublished[a]+'">'+postTitle[a]+"</a><br>");document.write("<br>")}};
//]]>
</script>
<script src="http://templateblogvn.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script>
Thay đường dẫn màu xanh bằng đường dẫn blog của bạn nhé!

   Chú ý: Phần tiêu đề, đây chính là đường dẫn đến sitemap của chúng ta, ví dụ, nếu mình ghi chổ đó là sitemap, thì sau khi public trang này ra thì nó sẽ có dạng: blogspot.com/p/sitemap.html.

- Nhìn vào thanh sidebar bên phải phần viết bài, click vào Tùy chọn, phần nhận xét của người đọc, tick vào Không cho phép, ẩn liên kết hiện có nhé.
- Sau khi hoàn thành các bước trên thì bấm vào Xuất bản nhé.

Vậy là bạn đã hoàn thành, và có 1 trang sitemap cho blogspot khá đẹp, nó sẽ nằm ở đường dẫn:
http://domaincuaban/p/sitemap.html

Bạn có thể sử dụng sitemap này để submit với Google nhằm cung cấp sơ đồ trang cho googlebot có thể tìm kiếm đến các khu vực trên website của bạn.

Author Name

Contact Form

Name

Email *

Message *

Powered by Blogger.