November 2015

Nhiều bạn thường xuyên hỏi _CTPG_ cách tạo hộp Feedburner theo dõi qua email như ở thanh sidebar của mình. Hộp theo dõi qua email này nhìn rất đơn giản nhưng không kém phần đẹp mắt và hiệu quả.

Hướng dẫn tạo hộp Feedburner theo dõi qua email
Hướng dẫn tạo hộp Feedburner theo dõi qua email

Thực chất thì có nhiều cách để giúp mọi người theo dõi chúng ta khi làm bằng Blogspot, thông qua nhiều kênh hỗ trợ khác nhau, nhưng thường thì mọi người sẽ chọn RSS, hay còn gọi là Feed, bởi rất nhanh chóng, dễ dàng và tất nhiên tiện lợi hơn các kênh khác.
Xem thêm: Hướng dẫn tạo nút chia sẻ bài viết hiệu ứng trượt tuyệt đẹp
Các bước để người dùng theo dõi chúng ta sau khi có hộp theo dõi qua email này khá đơn giản, chỉ cần nhập địa chỉ email vào và chọn nút theo dõi là sẽ hoàn thành. Đơn giản và hiệu quả! Cùng xem hướng dẫn nào.

Hộp theo dõi qua email Feed

Hướng dẫn tạo hộp theo dõi qua email bằng Feedburner

Chú ý là, để tạo được hộp theo dõi qua email này thì buộc các bạn phải tạo được RSS (Cũng là Feed đó mà) trước cho mình, cách tạo RSS như thế nào thì xem ở bài viết này nhé: Cách tạo RSS Feedburner cho Blogspot. Còn ở bài này, nếu các bạn chưa tạo RSS thì một là đợi bài tiếp theo của mình, hai là Google xem bài hướng dẫn khác nha.

- Truy cập vào địa chỉ sau: https://feedburner.google.com

Đây là địa chỉ của Feed, nếu bạn đã tạo RSS cho blog của mình thì sẽ có tên blog ở đó. Hãy truy cập vào blog của bạn.

- Chuyển sang tab Publicize:

Cách tạo hộp theo dõi qua email

- Tiếp tục chọn tùy chọn Email Subscriptions:

Cách tạo hộp theo dõi qua email

- Ở mục Subscription Form Code, đây chính là đoạn code để chúng ta chèn vào Blogspot tạo hộp theo dõi qua email. Hãy copy hết đoạn code này:

Cách tạo hộp theo dõi qua email

- Vào Bố cục (Layout), rồi chọn vị trí muốn thêm hộp theo dõi vào, và chọn thêm tiện ích, chọn HTML/Javascript, và cho đoạn code tạo hộp theo dõi lúc nãy vào phần nội dung.
Xem thêm: Hướng dẫn tạo widget xếp hạng bình luận cho Blogspot
Sau đó lưu lại, và thế là ta đã có một hộp theo dõi qua email cho Blogspot rồi đó :)

Skype có rất nhiều câu lệnh ẩn hữu ích, nhất là những câu lệnh được sử dụng trong việc chat nhóm, giúp chúng ta thao tác nhanh một vài hành động nào đó chỉ với câu lệnh đơn giản. Tuy nhiên, không phải ai cũng biết đến nó, vì khá ít thông tin về nó được chia sẻ. Nên ở bài viết này, _CTPG_ sẽ chia sẻ cho các bạn một số câu lệnh hay dùng trong chat Skype.

Một số câu lệnh hay dùng trong chat Skype

Bạn có bao giờ thấy một dòng chat theo kiểu thông báo như bên dưới trong Skype? Chà, rất ấn tượng, khi bạn khác biệt với những thành viên khác cũng như có thể tạo ra những tin nhắn độc đáo như vậy.

Lệnh command trong Skype

Đó là một thông báo được viết bằng cách sử dụng câu lệnh. Có thể áp dụng cho chat nhóm Skype lẫn chat với các cá nhân khác, nhưng phần lớn nó được áp dụng cho chat nhóm, và chỉ sử dụng được đối với người quản trị của nhóm. Cùng tìm hiểu qua nhé!
Xem thêm:

Một số câu lệnh hay dùng hữu ích trong Skype

Có nhiều lệnh lắm, tuy nhiên ở phạm vi bài viết này chỉ chia sẻ cho các bạn một vài trong số đó mà thôi.
Mẹo: Để xem một vài lệnh đơn giản, có thể gõ /help rồi enter trong Skype, sẽ liệt kê một list khoảng 5 lệnh (Cho chat với cá nhân) hay khoảng hơn chục lệnh (Cho chat với nhóm) hay được sử dụng cho các bạn. Và chú ý nó không phải danh sách đầy đủ câu lệnh nhé, còn nhiều lệnh ẩn nữa.

Câu lệnh
Nội dung
/me [text]
Tên của bạn sẽ xuất hiện theo nội dung bạn viết. Đồng thời đoạn chat định dạng như một thông báo của Skype
/topic [text]
Đổi tên cuộc trò chuyện nhóm
/add [skypename+]
Thêm một thành viên vào cuộc trò chuyện. Ví dụ: /add tran.badat1992 tức thêm thành viên tran.badat1992 vào cuộc trò chuyện
/alertson [text]
Tạo âm báo khi cuộc trò chuyện xuất hiện từ này. Ví dụ, nếu mình sử dụng lệnh /alertson Đạt . Thì khi các thành viên khác nói chuyện có từ Đạt, sẽ có âm báo.
/alertsoff
Tắt hoàn toàn các thông báo
/leave
Rời khỏi nhóm chat
/kick [skypename]
Lệnh này sẽ kick thành viên đó ra khỏi cuộc trò chuyện.
/get uri
Tạo một liên kết URL để người khác có thể tham gia vào nhóm theo link này.
/golive [token]
Bắt đầu tính năng gọi nhóm mà không cần phải mời từng người.
/invite [skypename]
Mời một người tham gia nhóm chat
/showmembers
Danh sách tất cả các thành viên đang tham gia nhóm chat, cùng với đó là vai trò của họ trong nhóm

Trên đây là vài câu lệnh đơn giản mà các bạn có thể tham khảo khi sử dụng Skype. Tính năng thông báo khi xuất hiện từ chỉ định là rất hay đó nha, nhất là chat nhóm với những nhóm có nhiều người chat. ^_^

Vào ngày 13-11-2015, Microsoft chính thức tung ra bản cập nhật lớn có số hiệu phiên bản là 10586 cho Windows 10 mang đến nhiều tính năng mới cũng như sửa nhiều lỗi đã tồn tại ở Windows 10 chính thức lâu này.

Cũng trong bản cập nhật lớn này, Windows 10 đã chính thức có khả năng nhắn tin bằng Cortana ngay trên máy tính Windows 10.

Cách nhắn tin bằng Cortana trên máy tính Windows 10

Vậy làm thế nào để nhắn tin bằng Cortana trên máy tính Windows 10?

Trước tiên, nói sơ qua về điều kiện để có thể nhắn tin trên máy tính Windows 10 đã. Đó là khi và chỉ khi bạn sử dụng một điện thoại đang chạy Windows 10 nhưng bị cuộc gọi nhỡ. Thì sẽ có thông báo từ Cortana về số gọi và thời gian gọi. Đồng thời, Cortana cũng cung cấp cho các bạn tùy chọn nhắn tin cho số gọi nhỡ đó ngay trên máy tính. Sau đó tin nhắn sẽ được đồng bộ qua Cortana trên điện thoại và sẽ được gửi đi trên điện thoại Windows 10 Mobile.

Nhớ là để sử dụng được nhắn tin bằng Cortana thì bạn phải sử dụng máy tính Windows 10 build 586 trở lên và cả điện thoại chạy Windows 10 nhé.
Xem thêm: Cách tắt bật Cortana trên Windows 10

Cách nhắn tin bằng Cortana trên máy tính Windows 10

- Sau khi có cuộc gọi nhỡ trên điện thoại Windows 10 Mobile, thì sẽ có 1 thông báo đến máy tính đang sử dụng chung tài khoản và cũng là Windows 10, như sau:

Thông báo cuộc gọi nhỡ của Cortana trên Windows 10
Thông báo cuộc gọi nhỡ của Cortana trên Windows 10

- Sau đó, bạn có thể click vào tùy chọn Text reply của thông báo này, Cortana sẽ được mở lên, và bạn có thể nhập tin nhắn vào phần nội dung, tiếp tục nhấn vài Send:

Nhắn tin bằng Cortana cho số gọi nhớ trên Windows 10
Nhắn tin bằng Cortana cho số gọi nhớ trên Windows 10

- Đợi 1 tí, tin nhắn sẽ được chuyển tiếp sang Cortana trên Windows 10 Mobile ở điện thoại và tự động gửi đi:

Tin nhắn từ Cortana Windows 10 được đồng bộ sang điện thoại Windows 10 Mobile
Tin nhắn từ Cortana Windows 10 được đồng bộ sang điện thoại Windows 10 Mobile

- Xong, bạn đã gởi tin nhắn thành công.

Mặc dù label của Blogspot theo nhiều người dùng thì rất khó tối ưu và gần như không SEO được. Tuy nhiên, đó chỉ là vấn đề bó hẹp với kiến thức của họ mà thôi. Bạn vẫn có thể tối ưu label tốt, thậm chí biến label của Blogspot thành một bài viết, dễ dàng chỉnh sửa và tối ưu.

Ở bài viết trước, _CTPG_ đã hướng dẫn các bạn cách tối ưu label bằng cách tối ưu tiêu đề và tối ưu mô tả cho các label. Các bạn có thể xem ở đây: http://www.tranbadat.info/2015/08/toi-uu-seo-blogspot-cho-label-cuc-don-gian.html . Nhưng nếu với chỉ nhiêu đó, thì bạn cần một lượng backlink lớn hay SEO một từ khóa dễ mới có thể đưa các label này lên top dễ dàng.

Tối ưu SEO Blogspot - Tối ưu label thành một bài viết
Tối ưu label thành một bài viết
Còn ở bài viết này, _CTPG_ sẽ hướng dẫn các bạn một kiến thức nâng cao hơn nữa, đó là biến Label thành một bài viết, mà ở đó, bạn có thể dễ dàng tùy chỉnh, cập nhật nội dung cho bài viết label này. Nghe có hứng thú không chứ?

Các bạn có thể xem một label minh họa cho bài viết này tại label SEO BLOGSPOT này của mình. Label này thực ra đang đứng 9 từ khóa SEO Blogspot mặc dù không cần backlink, tuy nhiên, nó chỉ đứng 9 mỗi khi mình update nội dung và cập nhật lại cho Google, chứ khoảng 3-4 ngày sau nó lại biến mất, thay bằng 1 bài viết vì có 1 bài viết khác tối ưu tương đương nó và nhưng lại có traffic nhiều hơn.

Thôi, lan man đủ rồi, vào vấn đề chính thôi.

Hướng dẫn tối ưu label thành một bài viết

Ý tưởng thì chính là nó, biến label thành một bài viết. Và nếu các bạn đã đọc qua bài viết tối ưu SEO cho label mình vừa nhắc ở trên, thì bạn sẽ thấy mình tiếp tục áp dụng lại kiến thức ở bài viết đó đấy.

- Kiến thức đó chính là đoạn code này:
<b:if cond='data:blog.url == "URL của trang riêng biệt"'> nội dung sẽ hiển thị </b:if>
Với đoạn code này, bạn sẽ chỉ định nội dung hiển thị bên trong nó chỉ được hiển thị khi truy cập vào URL được chỉ định ở trên.
Có nghĩa là, mình sẽ viết 1 bài viết cho Label này, và áp dụng code trên để chỉ hiển thị nội dung bài viết khi vào label này.

Và đây chính là nội dung bài viết của label SEO Blogspot được mình viết trong code của blog:

Một định dạng cơ bản để biến label thành một bài viết
Một định dạng cơ bản để biến label thành một bài viết (Click vào xem ảnh đầy đủ)

- Vậy, lúc này quan trọng chính là đặt đoạn code chứa bài viết trên ở vị trí nào thôi. Cái này thì tùy vào blog của các bạn. Ý tưởng luôn là đặt ngay vị trí dưới cùng của label, nếu các blog có phân trang thì ngay dưới phần phân trang. Điều này giúp đẹp blog và không ảnh hưởng nhiều tới người xem. (Như của mình đấy)

Đấy, chỉ như vậy thôi. Mình không thể chỉ cặn kẽ, vì các template khác nhau sẽ có các khu vực khác nhau để có thể chèn nội dung. Chúc các bạn tối ưu label thật tốt cho SEO :)

Cách tùy chỉnh hiển thị quảng cáo trên giao diện Mobile trên Blogspot? là câu hỏi được rất nhiều bạn giúp mình giải đáp. Do thời gian gần đây hơi bận nên chưa viết hướng dẫn được, hôm nay có rảnh tí nên viết bài này để hướng dẫn các bạn tối ưu quảng cáo Google Adsense trên cả giao diện Mobile.

Cách tùy chỉnh quảng cáo Adsense trên giao diện mobile

Vì sao phải tùy chỉnh hiển thị quảng cáo Adsense trên Mobile cho Blogspot?

Nếu bạn đang sở hữu tài khoản Google Adsense, bạn sẽ thấy rằng các kích thước quảng cáo nội dung của Google Adsense phần lớn cố định ở các kích thước, như 326x280, 720x90… Tuy nhiên, những kích thước quảng cáo này nếu được đặt lên 1 website có giao diện responsive, thì khi với những điện thoại hay màn hình có kích thước nhỏ dưới 6 inch, các kích thước quảng cáo trên sẽ bị tràn ra ngoài màn hình hay bị các thành phần khác che mất, đây là lại 1 điều cấm kỵ trong chính sách của Google Adsense. Mà đặt như thế này cũng không hề hiệu quả, mà lại làm xấu cả giao diện nữa.

Google Adsense cũng có quảng cáo Responsive, tương thích cho tất cả các kích thước màn hình. Tuy nhiên, thật sự quảng cáo này được mình sử dụng không thấy có sự hữu dụng lắm. Ví dụ như sau: Nếu mình đặt quảng cáo Responsive vào một vị trí có chiều rộng lớn nhất là 720px, thì thay vì tự động chọn kích thước hiển thị (lúc trên các màn hình máy tính) là 720x90 cho các quảng cáo, thì quảng cáo responsive này lại thường xuyên là 300x600, nhìn thật tồi tệ. Thậm chí bạn đặt 1 quảng cáo responsive lên 1 thanh sidebar có chiều rộng khoảng 300px, thì không bao giờ bạn được nhìn thấy một kích thước là 300x250px trên các màn hình máy tính, luôn là 300x600. Đó chính là những lý do mình gần như không sử dụng quảng cáo responsive.
Chính vì những lý do trên, mình luôn phải sử dụng các kích thước có sẵn của Google Adsense, nhưng sử dụng các thủ thuật blogspot để tùy chỉnh hiển thị quảng cáo trên cả máy tính và di động, để đảm bảo giao diện nhìn tốt nhất, lại không vượt quá 3 quảng cáo trên 1 trang hay bị lỗi đè giao diện.

Cách tùy chỉnh quảng cáo Adsense trên giao diện mobile cho Blogspot

Mình muốn hướng dẫn 1 bài đầy đủ, nhưng có vấn đề là mình viết ra rất khó hiểu, đến mình đọc lại cũng không dám chắc các bạn sẽ hiểu mình đang nói về gì. Chính vì thế trong bài viết mình chỉ đưa ra code và công dụng, còn làm thế nào thì là do ý tưởng của mỗi bạn nhé.

- Với các quảng cáo bị đè hay bị tràn khỏi màn hình ở giao diện mobile, cách tốt nhất là không cho quảng cáo hiển thị ở giao diện mobile. Hãy sử dụng code này để ẩn.
.HTMLxxx {display:none;}
Trong đó, .HTMLxxx là class chứa quảng cáo của các bạn. Chèn code này vào code css responsive có max-width khoảng 479px của các bạn, sẽ làm ẩn quảng cáo trên các giao diện có kích thước dưới 479px.

- Còn trường hợp lên giao diện mobile, quảng cáo xuất hiện không đúng ý (Như tụt xuống gần cuối website, quảng cáo ở header thì biến mất, hay nói chung là chẳng có tác dụng quảng cáo gì mấy). Thì các bạn có thể chèn quảng cáo vào những vị trí hiển thị tốt nhất, ví dụ ngay dưới header, trên phần body. Và chỉ cho hiển thị trên mobile. Thì sử dụng code sau:
<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- quang_cao_test_mobile_tranbadat -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-xxxxxxxxxxxxx"
     data-ad-slot="4283379704"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

</b:if>
Trong đó, đoạn code màu xanh là code quảng cáo Adsense có kích thước tốt với giao diện mobile (Ở trên là 300x250), còn đoạn code if bên ngoài, là code chỉ hiển thị trên giao diện Mobile, đổi true thành false thì hiển thị trên tất cả các giao diện, trừ mobile.

Ví dụ: Đoạn code quảng cáo trên mình đặt ngay bên dưới Bài đăng mới của tranbadat.info. Vậy thì...

Đây là trang chủ trên máy tính, chẳng có gì cả.

quảng cáo adsense tren máy tính

Tuy nhiên, đây là trang chủ trên điện thoại, đấy, nó nằm ngay bên dưới đấy ^_^

quang cao google adsense tren mobile

Hy vọng với bài hướng dẫn đơn giản như thế này, sẽ giúp các bạn tùy chỉnh tốt hơn cho quảng cáo Adsense trên website của các bạn. Chúc các bạn thành công. Nếu có cơ hội thì mình sẽ làm 1 video hướng dẫn cặn kẽ hơn nhé. Còn tạm thời nếu có thắc mắc thì cứ cmt bên dưới, mình sẽ trả lời nhé.

Ở bài viết Cách hiển thị ảnh Blogspot bị VNPT chặn, _CTPG_ đã hướng dẫn các bạn cách xử lý vấn đề bị chặn ảnh bởi nhà mạng này một cách thủ công. Tuy nhiên, cách này chỉ nên được áp dụng nếu bạn tự quản lý được hình ảnh post ở Blogspot.

Cách khắc phục ảnh bị lỗi do VNPT chặn bằng Javascript

Ở bài viết này, _CTPG_ sẽ tiếp tục hướng dẫn các bạn cách khắc phục ảnh bị lỗi do VNPT chặn bằng một cách khác: Sử dụng Javascript để hiển thị ảnh, hay chính xác hơn là để thay đổi đường dẫn của ảnh. Vì VNPT chỉ chặn blogspot.com thôi.

Cùng theo dõi hướng dẫn sử dụng javascript để thay đổi đường dẫn ảnh của Blogspot nhé.

Cách khắc phục ảnh lỗi do VNTP chặn trên Blogspot

- Vào trang quản trị Blogger

- Truy cập vào Mẫu (Template) -> Chỉnh sửa HTML (Edit HTML):

Edit HTML

- Sau đó hãy thêm đoạn code bên dưới đây vào phía trên thẻ </body>:
<script type='text/javascript'>
//<![CDATA[
var images = document.getElementsByTagName("img");
for(var i=0;i<images.length;i++) {  
images[i].src = images[i].src.replace(/[0-9]+.bp.blogspot.com/,"lh4.ggpht.com");
}
//]]>
</script>
Ý nghĩa của đoạn code này là gì? Đoạn code Java này sẽ tự động thay đổi các đường dẫn hình ảnh có định dạng từ 1-9.blogspot.com sang đường dẫn lh4.ggpht.com. Vì thực chất ảnh up lên blogspot là ảnh up lên picasa, nên việc thay đổi đường dẫn hình ảnh này sang đường dẫn mới sẽ không ảnh hưởng đến hình ảnh.

- Tuy nhiên, bạn nên kiểm tra lại có phải toàn bộ ảnh đã được thay đổi đường dẫn hay không! Không phải teamplate nào các bạn thêm đoạn code này vào ngay phía trên </body> là được áp dụng đâu. Có thể đoạn code này thêm vào bên dưới các đoạn Javascript khác, và bị các đoạn js này chặn khiến cho nó không được áp dụng. Hãy thử di chuyển đoạn JS hiển thị ảnh này lên trên, miễn nằm trong thẻ <body> là được, và kiểm tra vị trí nào nó hoạt động. Đôi khi cũng gặp hiện tượng nó hoạt động nhưng lại chặn 1 đoạn JS khác, khiến đoạn JS đó không hoạt động được đấy ^_^

Kết thúc vấn đề tại đây, với 2 cách khắc phục ảnh lỗi do bị VNPT chặn được _CTPG_ chia sẻ, hy vọng các bạn có thể khắc phục triệt để lỗi này. Chúc các bạn thành công!

Facebook hiện đang là mạng xã hội lớn nhất thế giới với hơn 1.5 tỉ người sử dụng, là nơi giao lưu của mọi người với nhau. Tuy nhiên, đôi lúc chúng ta lại không vào được Facebook do nhiều lý do, mà phần lớn là do bị nhà mạng chặn không cho truy cập.

Cách vào Facebook bị chặn bằng trình duyệt Cốc Cốc

Từ lý do đã xuất hiện rất nhiều cách vào facebook được cư dân mạng chia sẻ, nhưng trong đó, việc truy cập vào facebook bị chặn bởi trình duyệt Cốc Cốc là khả quan và đơn giản nhất. Và với một số lý do sau đây, bạn nên sử dụng Cốc Cốc làm trình duyệt:
  • Cốc Cốc được tích hợp công nghệ vượt tường lửa của các nhà mạng để vào Facebook. Từ đó không phải mỗi lần muốn vào Facebook lại lên mạng gõ cách vào facebook để tìm hiểu cách xử lý.
  • Cốc Cốc là trình duyệt được cung cấp bởi các lập trình viên Việt Nam
  • Sử dụng Cốc Cốc có thể dễ dàng xem vài tải các video
  • Có sử dụng gợi ý tiếng Việt cho những bạn làm biếng gõ tiếng Việt
  • Tốc độ tải trang rất nhanh, kể cả Facebook
Với những lý do trên, các bạn đã có thể sử dụng Cốc Cốc làm trình duyệt hàng ngày của mình. Một phần để phục vụ công việc, giải trí, một phần sẽ giúp các bạn giải quyết các phiền toái về vấn đề Facebook bị chặn tại Việt Nam.

Cách vào facebook bằng Cốc Cốc

Cách vào Facebook bị chặn bằng trình duyệt Cốc Cốc

Công việc của chúng ta chỉ đơn giản là tải trình duyệt Cốc Cốc về và cài đặt sử dụng là đã có thể vào Facebook rồi.

- Truy cập vào đường dẫn sau và tải Cốc Cốc về: http://coccoc.com/

- Sau đó tiến hành cài đặt trình duyệt, trong quá trình cài đặt, bạn có thể tùy chọn đặt Cốc Cốc làm trình duyệt mặc định hay không

- Sau khi cài đặt xong thì tiến hành mở trình duyệt lên và truy cập vào Facebook mà không cần thêm bất cứ công cụ hỗ trợ nào.

Sử dụng Cốc Cốc là lựa chọn tuyệt vời để trả lời cho kết quả tìm kiếm "cách vào facebook" trên các công cụ tìm kiếm. Ngoài cách vào Facebook bằng trình duyệt Cốc Cốc thì các bạn có thể tham khảo thêm cách: Sử dụng Hotspot Shield, hay sử dụng file host để truy cập Facebook. Chúc các bạn thành công!

Đa phần hiện nay, các bạn đều sử dụng những template Blogspot tùy chỉnh được chia sẻ trên mạng để làm giao diện cho Blogspot, vì nhiều lý do, trong đó lý do chính là giao diện đó đẹp, được tối ưu và phù hợp nhu cầu làm blog của các bạn.

Cách tối ưu Blogspot có 2 thẻ H1 trên 1 trang
Tối ưu Blogspot có 2 thẻ H1
Tuy nhiên, không phải template Blogspot nào cũng được tối ưu SEO hoàn chỉnh, mà lỗi phổ biến đó là xuất hiện 2 thẻ H1 ở 1 trang bài viết. Thường xuất hiện 2 thẻ H1 khi bạn sử dụng tiêu đề web mình là chữ, còn nếu thay ảnh vào thì vẫn có 2 thẻ H1, nhưng 1 thẻ H1 bị trống.

Điều này ảnh hưởng tới SEO cho Blogspot của bạn, tuy nhiên, nếu có 2 thẻ H1 thật sự thì cũng không ảnh hưởng nhiều tới kết quả đâu. Và, ở bài viết này _CTPG_ sẽ hướng dẫn các bạn thủ thuật tối ưu lại các thẻ H1 của blog các bạn. Đây là thủ thuật mình tối ưu cho chính blog của mình. Hãy cùng theo dõi nhé:

Cách tối ưu Blogspot có 2 thẻ H1

- Làm gì thì làm, đầu tiên là phải backup code trước đã nhé.

- Sau đó thì truy cập vào Chỉnh sửa HTML (Edit HTML)

- Click vào vùng code, sau đó bấm Ctrl + F để mở hộp tìm kiếm, và tìm đến đoạn chữ này:
shrink to fit then we expand the header.
- Ngay phía dưới nó là đoạn code bắt đầu từ:
<b:if cond='data:mobile'>
Cách tối ưu thẻ H1 Blogspot

Chúng ta sẽ thay toàn bộ đoạn code bắt đầu từ đoạn code trên đến thẻ:
</b:includable>
Thẻ này nằm ngay trên thẻ này:
<b:includable id='description'>
Tối ưu H1 cho Blogspot

- Thay toàn bộ đoạn code đó bằng đoạn code đã được mình tối ưu thẻ H1 ở đây (Có thể coi đoạn code dưới này để tìm đoạn code tương tự trong Blogspot của các bạn):
      <b:if cond='data:mobile'>
          <div id='header-inner'>
            <div class='titlewrapper' style='background: transparent'>
              <b:if cond='data:blog.url == data:blog.homepageUrl'>
<h1 class='title' itemprop='name' style='background: transparent; border-width: 0px'>
    <b:include name='title'/>
</h1>
    <b:else/>
<p class='title' itemprop='name' style='background: transparent; border-width: 0px'>
    <b:include name='title'/>
</p>
</b:if>
            </div>
            <b:include name='description'/>
          </div>
        <b:else/>
          <div expr:style='&quot;background-image: url(\&quot;&quot; + data:sourceUrl + &quot;\&quot;); &quot;                        + &quot;background-position: &quot;                        + data:backgroundPositionStyleStr + &quot;; &quot;                        + data:widthStyleStr                        + &quot;min-height: &quot; + data:height                        + &quot;_height: &quot; + data:height                        + &quot;background-repeat: no-repeat; &quot;' id='header-inner'>
            <div class='titlewrapper' style='background: transparent'>
            <b:if cond='data:blog.url == data:blog.homepageUrl'>
<h1 class='title' itemprop='name' style='background: transparent; border-width: 0px'>
    <b:include name='title'/>
</h1>
    <b:else/>
<p class='title' itemprop='name' style='background: transparent; border-width: 0px'>
    <b:include name='title'/>
</p>
</b:if>
            </div>
            <b:include name='description'/>
          </div>
        </b:if>
    <b:else/>
      <!--Show the image only-->
      <div id='header-inner'>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
        </a>
        <!--Show the description-->
        <b:if cond='data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'>
          <b:include name='description'/>
        </b:if>
      </div>
    </b:if>
  <b:else/>
    <!--No header image -->
    <div id='header-inner'>
      <div class='titlewrapper'>
        <b:if cond='data:blog.url == data:blog.homepageUrl'>
<h1 class='title' itemprop='name'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title' itemprop='name'>
<b:include name='title'/>
</p>
</b:if>
      </div>
      <b:include name='description'/>
    </div>
  </b:if>
</b:includable>
- Nhớ chú ý thay cho chính xác đoạn code như mình chỉ nhé. Sau đó lưu lại, và kiểm tra lại bằng các công cụ kiểm tra onpage.

- Ngoài ra, vẫn còn 1 đoạn code tối ưu H1 dành cho blog, mình có chia sẻ ở bài viết: Tối ưu thẻ H1, H2 cho Blogspot này, các bạn nên tham khảo thêm, đoạn H1 ở bài viết kia không nằm trong đoạn code tối ưu ở bài viết này.

Xong rồi đấy, nếu sau khi làm xong mà vẫn chưa tối ưu 2 thẻ H1 trên 1 trang thì comment bên dưới để mình xem qua blog của các bạn nhé :)

Lâu lâu trở lại với Blogspot, nay _CTPG_ xin hướng dẫn các bạn thủ thuật tạo nút chia sẻ (share) bài viết có hiệu ứng trượt mở rất độc đáo và đẹp mắt.

Hướng dẫn tạo nút chia sẻ bài viết Blogspot hiệu ứng trượt đẹp mắt

Các bạn có thể xem demo nút share đó tại đây nhé. Về cơ bản, nút share này sẽ được bao phủ lên bởi các một lớp, sau khi rê chuột vào thì lớp này trượt sang 1 bên để lộ nút chia sẻ, rất độc đáo và đẹp mắt. Phải nói là rất cuốn hút.

Nói dông dài làm gì, vào luôn chủ đề thôi:

Hướng dẫn tạo nút chia sẻ bài viết với hiệu ứng trượt đẹp mắt

- Đầu tiên, luôn phải backup code trước khi chỉnh sửa bất kỳ điều gì nha ^_^

- Tiếp theo, chúng ta cần thêm thư viện css cho nút chia sẻ bài viết này đã, bạn hãy thêm thư viện dưới đây phía trên <b:skin>:
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/>
- Sau đó thêm đoạn css này vào phía trên thẻ ]]></b:skin>:
#share-buttons{
width: 100%;
display: inline-block;
text-align: center;
margin: 20px auto;
}
.share-button{
background:#DCE0E0!important;
position:relative;
display:block;
float:left;
height:40px;
overflow:hidden;
width:150px;
/*border-radius*/
-webkit-border-radius:3px;
   -moz-border-radius:3px;
        border-radius:3px;
margin:0 7px;
}
.icon{
display:block;
float:left;
position:relative;
z-index:3;
height:100%;
vertical-align:top;
width:38px;
-moz-border-radius-topleft:3px;
-moz-border-radius-topright:0;
-moz-border-radius-bottomright:0;
-moz-border-radius-bottomleft:3px;
/*border-radius*/
-webkit-border-radius:3px 0 0 3px;
   -moz-border-radius:3px 0 0 3px;
        border-radius:3px 0 0 3px;
text-align:center;
}
.icon i{
color:#fff;
line-height:42px;
}
.pslide{
z-index:2;
display:block;
height:100%;
left:38px;
position:absolute;
width:112px;
-moz-border-radius-topleft:0;
-moz-border-radius-topright:3px;
-moz-border-radius-bottomright:3px;
-moz-border-radius-bottomleft:0;
/*border-radius*/
-webkit-border-radius:0 3px 3px 0;
   -moz-border-radius:0 3px 3px 0;
        border-radius:0 3px 3px 0;
margin:0;
}
.pslide p{
font-family:Open Sans;
font-weight:400;
border-left:1px solid rgba(255,255,255,0.35);
color:#fff;
font-size:16px;
left:0;
position:absolute;
text-align:center;
top:8px;
width:100%;
margin:0;
}
.share-button .pslide{
/*transition*/
-webkit-transition:all .2s ease-in-out;
   -moz-transition:all .2s ease-in-out;
     -o-transition:all .2s ease-in-out;
        transition:all .2s ease-in-out;
}
.facebook1 iframe{
display:block;
position:absolute;
right:5px;
top:6px;
z-index:1;
}
.facebook2 iframe{
display:block;
position:absolute;
right:5px;
top:6px;
z-index:1;
}
.twitter iframe{
width:90px!important;
right:5px;
top:10px;
z-index:1;
display:block;
position:absolute;
}
.google #___plusone_0{
width:70px!important;
top:10px;
right:15px;
position:absolute;
display:block;
z-index:1;
}
.facebook1:hover .pslide{
left:-90px;
}
.facebook2:hover .pslide{
left:150px;
}
.twitter:hover .pslide{
left: -90px;
}
.google:hover .pslide{
left: 150px;
}
.facebook1 .icon,.facebook1 .pslide{
background:#305c99;
}
.facebook2 .icon,.facebook2 .pslide{
background:#305c99;
}
.twitter .icon,.twitter .pslide{
background:#00cdff;
}
.google .icon,.google .pslide{
background:#d24228;
}

- Về cơ bản chúng ta đã xong phần CSS định dạng cho đoạn code chia sẻ bài viết trong Blogspot này, giờ thì thêm đoạn Javascript này phía trên thẻ </body>:
<script type='text/javascript'>
/*<![CDATA[*/
(function () {
    var a = document.getElementById('SocialBar');
    var b = document.getElementById('social_share');
    b.innerHTML = a.innerHTML;
    a.parentNode.removeChild(a)
})();
/*]]>*/</script>
- Và cuối cùng, thêm đoạn HTML này ngay vị trí bạn muốn hiển thị nút chia sẻ:
<div id='social_share'>
<div id='share-buttons'>
<div class='facebook2 share-button'>
<i class='icon'>
<i class='fa fa-facebook'/></i><div class='pslide'><p> facebook </p>
</div>
<div class='fb-like' data-action='like' data-layout='button_count' data-share='false' data-show-faces='false'/>
</div>
<div class='twitter share-button'>
<i class='icon'>
<i class='fa fa-twitter'>
</i>
</i>
<div class='pslide'>
<p> twitter </p>
</div>
 <a class='twitter-share-button' data-count='horizontal' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' title='Share via Twitter'>
               
                </a>
                <script async='async' src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</div>
<div class='google share-button'>
<i class='icon'>
<i class='fa fa-google-plus'>
</i>
</i>
<div class='pslide'>
<p> google+ </p>
</div>
<div class='g-plusone' data-count='true' data-size='medium' expr:data-href='data:post.url' rel='nofollow'/>
                <script type='text/javascript'>
                  window.___gcfg = {lang: &#39;id&#39;};
                                    (function() {
                                    var po = document.createElement(&#39;script&#39;); po.type = &#39;text/javascript&#39;; po.async = true;
                                    po.src = &#39;https://apis.google.com/js/plusone.js&#39;;
                                    var s = document.getElementsByTagName(&#39;script&#39;)[0]; s.parentNode.insertBefore(po, s);
                                   })();
                </script>
</div>
<div class='facebook1 share-button'>
<i class='icon'>
<i class='fa fa-facebook'/></i><div class='pslide'><p> fb share </p>
</div>
  <a class='fb-share-button' name='fb_share' rel='nofollow' share_url='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:blog.url' type='button_count'/>
</div>
</div>
</div>
Xong, lưu lại và tận hưởng thành quả thôi. Nút chia sẻ bài viết này khá lớn, nổi bật nên càng tạo thuận lợi cho người đọc chia sẻ bài viết. Chúc các bạn thành công. Có gì thắc mắc thì cmt bên dưới _CTPG_ trả lời nhé ^_^

Trong các văn bản hành chính, việc căn lề trong Word là vô cùng khắt khe, theo đúng tiêu chuẩn của quy định của đơn vị hay của cơ quan, của nhà nước. Theo như văn bản số:01/2011/TT-BNV Hướng dẫn thể thức và kỹ thuật trình bày văn bản hành chính, thì quy định về tiêu chuẩn canh lề trong văn bản như sau:
  • Lề trên: Cách mép trên 20-25mm
  • Lề dưới: Cách mép dưới 20-25mm
  • Lề trái: Cách mép trái 30-35mm
  • Lề phải: Cách mép phải 15-20mm
Cách căn lề trong Word 2007, 2010, 2013, 2016

Vì với những tiêu chuẩn khắt khe như vậy, đòi hỏi chúng ta phải biết căn lề văn bản. Ở bài viết này, _CTPG_ sẽ hướng dẫn các bạn thực hiện căn lề trong Word 2007, 2010, 2013, 2016; cùng với đó là cách để các bạn cài đặt các thông số canh lề này làm mặc định để không phải thực hiện căn lề lại cho các lần sau.

Vì yêu cầu khi căn chỉnh lề thường với đơn vị centimet nên đầu tiên chúng ta cần phải chuyển đơn vị của Word sang centimet đã, nếu bạn nào đã có sẵn tùy chọn đơn vị này thì có thể bỏ qua bước này.

Chuyển sang đơn vị centimet trước khi căn lề

- Vào File -> Options:

Mở Options trong Word

- Cửa sổ Options mở ra, vào tùy chọn Advanced. Sau đó tìm đến tùy chọn: Show measurements in units of:

Chuyển đơn vị sang Centimet

Chuyển đơn vị đo sang Centimeters.

Xong, giờ đi canh lề văn bản thôi.

Cách căn lề văn bản trong Word 2007, 2010, 2013, 2016

- Tại tab Layout của Word (Page Layout với 2007-2010), ở khu vực tùy chọn Page setup, hãy click vào icon mở rộng như dưới ảnh:

Mở margin căn lề văn bản

- Ở tab Margins, chúng ta sẽ có những tùy chọn căn lề như sau (Chỉ cần quan tâm 4 thông số, Top, Bottom, Left và Right là được rồi):
  • Top: Căn lề trên, là khoảng cách từ mép trên của khổ guất tới dòng đầu tiên của khổ giấy
  • Bottom: Căn lề dưới, là khoảng cách từ mép dưới cho đến dòng cuối cùng của khổ giấy
  • Left: Căn lề trái, là khoảng cách từ mép trái khổ giấy tới ký tự đầu tiên bên trái
  • Right: Căn lề phải, là khoảng cách từ mép phải giấy đến chữ, ký tự cuối cùng bên phải
Can le trong Word 2007

Sau khi căn chỉnh xong thì bạn có thể lưu lại rồi.

Cách thiết lập mặc định căn chỉnh lề

Sau khi kết thúc việc căn chỉnh lề ở những bước trên, các bạn có thể click vào tùy chọn Save As Default:

Cai dat mac dinh can le van ban

Sau đó sẽ có một thông báo xác nhận việc chọn những thông số căn chỉnh ở trên làm mặc định, bạn hãy chọn Yes. Hoàn thành việc cài đặt căn chỉnh lề mặc định.

Cài đặt mặc định căn lề văn bản Word

Hy vọng với cách căn lề trong Word và cách thiết lập mặc định trên, các bạn sẽ không gặp khó khăn trong việc trình bày định dạng văn bản phù hợp các chuẩn đề ra. Và với Excel, Powerpoint cũng làm tương tự như vậy nha. Chúc các bạn thành công! Và nhớ theo dõi _CTPG_ nha ^_^


Author Name

Contact Form

Name

Email *

Message *

Powered by Blogger.