5 lý do nên dùng Twitter Bootstrap cho dự án Web

5 ly do de dung twitter bootstrap

Twitter Bootstrap ngày càng được sử dụng nhiều bạn có thể dạo 1 vòng những website hoặc blogger khác có thể thấy giao diện sử dụng bootstrap rất nhiều.Bạn có thể nhanh chóng tạo 1 giao diện web bằng cách sử dụng các component của bootstrap, giúp bạn tranh việc lặp đi lặp lại quá trình tạo ra các class CSS và những đoạn mã HTML giống nhau.

Nếu bạn mới biết đến HTML và CSS thì có thể gặp 1 ít khó khăn vì với bạn có thể Bootstrap khó điều khiển và sử dụng.

Những tính năng nổi bật của Twitter Bootstrap:

  • Grid System
  • Responsive
  • Component
  • Typography
  • Tích hợp Jquery và Javascript
  • Khả năng tương thích với trình duyệt

Những tính năng có thể ngày xưa phải mất rất nhiều thời gian để viết thì bây giờ đã được tích hợp sẳn.Trong nội dung bài viết này mình chỉ nói đến những phần tích cực,lợi ích của việc sử dụng Bootstrap để các bạn có cái nhìn mới về quá trình phát triển web cũng như có thể áp dụng cho những dự án sau này của bạn.

1- Phát triển ứng dụng web nhanh chóng

Nếu cần phát triển nhanh một website hoặc ứng dụng web trong vòng 1 tuần và có một ngân sách eo hệp thì bạn nên chọn Bootstrap ! Bạn có thể lấy một mẩu web phù hợp với bạn và chỉ cần thêm thắt 1 số màu sắc,hình ảnh, video,.. trang trí lại thì dã hoàn thành rồi.Nếu không sử dụng Bootstrap thì có thể kết quả sau 1 tuần sẽ rất tệ hại và sẽ gặp nhiều vấn đề.Nhưng với Bootstrap thì khác, được viết bởi những người thông minh và tài năng trên khắp hành tình.Sự tương thích của trình duyệt với thiết bị đã được kiểm tra nhiều lần nên bạn hoàn toàn có thể tin tưởng kết quả mình làm ra và nhiều khi không cần kiểm tra lại nên giúp cho dự án của bạn tiết kiệm được thời gian và tiền bạc.

2 – Nền tảng dễ sử dụng

Twitter Bootstrap chỉ gồm CSS và JS nên bạn không cần phải tìm hiểu gì mới, chỉ cần bạn chịu khó ngồi đọc những tài liệu được viết chi tiết cho người dùng.Một số trường hợp thì có thể phức tạp một chút nếu bạn sử dụng phiên bản Sass hoặc Less,hoặc sử dụng Bootstrap cho .NET như này, hoặc sử dung như plugin của WordPress.

3 – Giao diện sang trọng và đầy đủ

Với giao diện màu xám bạc rất sang trọng,hổ trợ gần như đầy đủ những thành phần cần thiết mà một website hiện đại cần.Cấu trúc HTML rõ ràng giúp bạn có thể nhanh chóng nắm bắt được cách sử dụng của Bootstrap.Tuy cấu trúc của Bootstrap không phải là tốt nhất nhưng giúp nắm bắt dễ dàng và nhanh chóng.Nếu bạn cảm thấy những thành phần trong Bootstrap có thể thừa thải thì ban có thể vào mã nguồn của Bootstrap để chỉnh sửa theo ý mình

4 – Responsive

Một website được gọi là responsive có nghĩa là khi bạn vào bằng những thiết bị có kích thước màn hình khác nhau  và website có khả năng thay đổi giao diện phù hợp với kích thước màn hình đó mà không cần load lại trang.

Do có sử dụng Grid System nên Bootstrap mặc định hổ trợ Responsive.Và Bootstrap được viết theo xu hướng Mobile first tức là ưu tiêng giao diện trên Mobile trước nên nếu sử dụng Bootstrap website của bạn sẽ phù hợp với tất cả kích thước màn hình.

5 – Dễ dàng tùy biến

Để phù hợp cho nhiều loại website thì đội ngũ phát triển Bootstrap đã làm thêm 1 tính năng trên website của họ là Customizer.Bạn có thể thay đổi gần như tất cả những thuộc tính của Bootstrap để phù hợp với project của bạn hơn.Nếu những tùy chỉnh này không đủ với bạn, bạn có thể chỉnh sửa trực tiếp trên mã nguồn của Bootstrap

twitter_customizer

Bạn có thể tham khảo thêm những thông tin về Bootstrap tại đây

Mỗi thứ trên đời này chỉ hữu ích ở một mức độ nào đó và Bootstrap không phải là công cự tốt nhất cho mọi loại web nên việc sử dụng nó hay không là tùy thuộc vào quyết định của người lập trình viên.

Trong bài viết sắp tới mình sẽ viết Những lý do bạn không nên sử dụng Twitter Bootstrap trong dự án của mình.Mình mong các bạn có thể góp ý cho mình, vì bài viết nghĩ gì viết đó nên đôi chổ chưa phù hợp, hoặc bạn có lý do nào khác có thể đóng góp để bài viết hoàn chỉnh hơn.

Tổng hợp 9 plugin tạo Breadcrumbs cho WordPress

Như ở bài viết trước mình đã đề cập đến lợi ích của Breadcrumbs với website.Không thể phủ nhận sự cần thiết của nó đối với website.Nếu website hoặc blog của bạn có nhiều nội dung thì bạn nên sử dụng 1 trong những plugin mà mình giới thiệu trong bài viết này.

Đọc thêm :Thêm Breadcrumbs vào WordPress không cần Plugin

Ở bài trước mình đã hướng dẩn các bạn cách thêm Breadcrumbs cho wordpress mà không cần dùng plugin.Nhưng nhiều bạn không muốn đụng đến code mà thích dùng plugin nên hôm nay mình viết bài này để giới thiệu đến các bạn những plugin giúp các bạn tạo ra 1 Breadcrumbs đơn giản và hiệu quả.

Nhưng trước tiên mình sẽ nói đến lợi ích của việc sử dụng Breadcrumbs cho website của bạn:

Hoạt động như thanh điều hướng thứ 2

Tạo ra sự thuận tiện cho người dùng nếu họ muốn đến 1 pages cụ thể hoặc 1 danh mục (category) một cách nhanh chóng.Nó là một yếu tố quan trọng đối với người đọc vì blog thân thiện và dể sử dụng sẽ thu hút họ quay trở lại.

Giúp xác định được vị trí của độc giả

Đây là điều quan trọng vì nó giúp người dùng xác định được mình đang ở đâu trên website của bạn.Không tạo cho họ cảm giác bị lạc lỏng giữa hàng trăm hoặc đến hàng ngàn bài viết.

Hổ trợ SEO

Breadcrumbs giúp tạo ra các liên kết nội bộ bằng những từ khóa có liên quan với nhau.Các công cụ tìm kiếm hiện nay rất chú trọng đến các dữ liệu có cấu trúc và bạn có thể xem 1 ví dụ mình họa việc dùng Breadcrumbs

ho tro rich snippetts

Và đây là một kết quả không dùng Breadcrumbs

loi ich khi dung breadcrumbs

Phần link trong kết quả tìm kiếm đẹp hơn, gọn hơn và khi người dùng click vào thì nó dẩn trực tiếp đến trong trường hợp này là category.

Bên trên là những lợi ích khi bạn thêm Breadcrumbs vào website của bạn, còn bây giờ mình xin giới thiệu đến các bạn 9 plugin có thể giúp bạn làm được những điều trên:

1- Breadcrumb NavXT

Đây là một plugin hoàn hảo cho bạn.Bạn có thể tùy chỉnh nhiều thứ bên trong plugin này để đáp ứng được như cầu sử dụng của bạn.Một ưu điểm của Breadcrumb NavXT nữa là phần quản lý trong admin rất đơn giản.

1- Breadcrumb NavXT

2- WordPress SEO by Yoast

Nếu bạn đang sử dụng Plugin SEO này thì bạn có thể kích hoạt tính năng Breadcrumbs trong phần setting và copy đoạn code đến nói mà bạn muốn hiển thị

wordpress-seo

bat tinh nang Breadcrumbs trong SEO by Yoat

Sau khi check vào Enable Breadcrumbs bạn chỉ cần copy đoạn code sau để vào nơi bạn muốn hiển thị trên theme của mình.

[code language=”php”]
if ( function_exists(‘yoast_breadcrumb’) ) {
yoast_breadcrumb(‘<p id="breadcrumbs">’,’</p>’);
}
[/code]

 3- Instant Breadcrumbs

Khi sử dụng plugin này , bạn không cần phải chính sửa bất cứ gì trong theme của bạn.Nó sẽ dùng Primary Menu để thể hiện Breadcrumbs.Plugin này thích hợp với những bạn không am hiểu nhiều về code.

Instant Breadcrumbs

4- Breadcrumbs Everywhere

Đây là một plugin hổ trợ cho BuddyPress.Bạn chỉ cần chèn 1 dòng code vào thôi.

Breadcrumbs Everywhere

Thêm một số hình ảnh về plugin này

Breadcrumbs Everywhere buddypressBreadcrumbs Everywhere buddypress group Breadcrumbs Everywhere buddypress setting 

5- Breadcrumb Trail

Breadcrumbs Trail

Một plugin cũng khá hay.Sắp tới mình sẽ thêm nó vào theme hiện tại mình đang dùng.

6-  RDFa Breadcrumb

RDFa Breadcrumbs

Plugin này hổ trợ thêm nhiều ngôn ngữ trên thế giới.

7- SEO BreadCrumb

SEO Breadcrumbs

Plugin này thì cho phép bạn tùy chỉnh thêm dạng hiển thị là list

8- Full Breadcrumb

Plugin Breadcrumb này cho bạn tùy chọn khá nhiều.

9- WPshore Breadcrumbs

Plugin đơn giản hổ trợ tạo Breadcrumb

Với những plugin trên bạn hoàn toàn có thể tạo ngày cho website của mình một Breadcrumb đơn giản và hổ trợ tốt cho SEO.

Cloudzin – VPS giá rẻ, chất lượng cao của người Việt

Năm 2014 với nhiều thay đổi lớn trong đó Blog của mình thay đổi giao diện cũng như thay đổi hosting.Mình chuyển từ StableHost sang VPS của Cloudzin không phải vì host cũ không đáp ứng được nhu cầu của mình mà là do mình muốn tự do hơn.Lúc trước mình dùng Share hosting của StableHost nói chung rất ok nhưng khi nghe giới thiệu Cloudzin là một VPS của người Việt nên mình đã quyết định chuyển sang thử để xem thế nào và mình đã rất hài lòng với những gì mà Cloudzin mang lại.

cloudzin

Vậy Cloudzin là ai?

Xuất phát từ Ngọc Trang, một công ty đang khá nổi tiếng chuyên cung cấp dịch vụ VPS (máy chủ ảo) và dedicated server (máy chủ vật lý), Cloudzin mở rộng ra thị trường quốc tế với hàng loạt server mới cứng. Thật là may mắn khi mình có cơ hội sử dụng và trải nghiệm dịch vụ VPS ở đây.

Sở hữu những hệ thống máy chủ với công nghệ mới nhất như dùng ổ SSD Raid10, LSI, CPU E3-1270 v3 @ 3.50GHz hoặc AMD Opteron(tm) Processor 4334, 32GB RAM nên có thể nói về phần cứng Cloudzin ngang ngửa các hãng lớn như DigitalOceanRamnode.

Cloud Server là gì ?

Bạn có thể mở rộng hoặc giảm cấu hình các máy chủ trong vài giây để đảm bảo rằng các máy chủ có thể đáp ứng tốt nhu cầu mà không lãng phí tiền bạc vào các nguồn tài nguyên không cần thiết. Thêm máy chủ mới hoặc nâng cấp dịch vụ hiện tại chỉ với một vài cú nhấp chuột.

Cloud server đáng tin cậy hơn nhiều so với shared hosting. Với Cloud server, bạn có thể an toàn 100% trước vấn nạn local attack, hay khi một cloud server gặp vấn đề thì không ảnh hưởng tới hiệu suất của các cloud server khác. Mỗi Cloud server đều là một hệ thống riêng biệt.

Với Cloud server bạn có thể dễ dàng tùy chỉnh, bạn có thể lựa chọn lượng RAM, CPU, không gian lưu trữ, số lượng IP… cho phù hợp nhất với ngân sách và nhu cầu của mình. Các thông số đều có thể tùy chỉnh theo mong muốn và chỉ yêu cầu một lần khởi động lại máy chủ.

Máy chủ vật lý vs Cloud Server

So sanh giua may chu va cloud server

Quản lý Cloudzin như thế nào ?

Việc quản lý Cloudzin vô cùng đơn giản.Nếu các bạn đã từng dùng qua DigitalOcean thì sẽ thấy giao diện tương tự nhau.
quan ly cloud server tren cloudzin
Những thông số chính của Cloud Server đều hiển thị ở đây.Bạn có thể tăng kích thước gói VPS mình đang đăng ký.Restart hay shutdown VPS của mình.Nói chung mình đánh giá rất cao giao diện quản lý của Cloudzin đơn giản nhưng đầy đủ chức năng cần thiết.

cloudzin-script

Ngoài ra Cloudzin còn cung cấp Cloudzin Script giúp bạn có thể dể dàng quản lý VPS thông qua SSH.

Giới thiệu sơ qua như vậy thôi, giờ mình sẽ tổng kết ưu điểm và nhược điểm của Cloudzin:

Ưu điểm

– Có server cài đặt sẵn sàng sử dụng, đã được tối ưu tốt nhất (loại bỏ những thành phần không cần thiết, đã cài đặt nén gzip, static cache).

– Cấu hình server mạnh mẽ, sử dụng công nghệ tốt nhất.

– Tất cả các thao tác với server có thể thực hiện thông qua hệ thống quản lý SolusVM trên web.

– Các gói cước phù hợp đa dạng nhu cầu. Gói thấp nhất 10$/tháng nhưng có cấu hình server gấp đôi Digital Ocean.

– Có script quản lý đơn giản, phù hợp cho cả newbie lẫn người có nhiều kinh nghiệm.

– Support thực sự 24/7. Mình gửi tiscket khoản 15 phút là nhận được phản hồi.

– Thanh toán đa dạng, có thể dùng PayPal hoặc chuyển khoản ngân hàng.

– Toàn bộ server chống được DDoS, không lo bị tấn công nữa (Từ lúc chuyển qua xài đến giờ VPS của mình mới bị timeout 1 lần do bị DDoS IP).

Nhược điểm

– Cài đặt sẵn webserver Nginx trên hệ điều hành CentOS, bạn không được cài Apache. Mình toàn dùng cặp đôi Nginx + CentOS nên không có vấn đề gì hết.

– Không được cài đặt các Control Panel lên VPS. Cloudzin giải thích việc này để hạn chế các nguy cơ bảo mật và máy chủ đã được cài đặt sẵn script quản lý nhỏ gọn và dễ dàng sử dụng rồi.

– Chưa có nhiều hướng dẫn sử dụng (đang cập nhật dần).

– Không có Livechat hoặc Phone, phải liên hệ qua ticket.

Những ai nên dùng VPS của Cloudzin

  • Bạn mới làm quen VPS, không muốn mất thời gian để tìm hiểu về Linux hay kiến thức quản trị VPS.
  • Bạn cần VPS ổn định (thời gian uptime và tài nguyên server) để yên tâm phát triển website.
  • Bạn muốn sử dụng VPS nhưng không thích công đoạn thanh toán lằng nhằng của nhà cung cấp nước ngoài.

Những ai nên tránh xa Cloudzin

  • Nếu website của bạn cần nhiều dung lượng lưu trữ và băng thông, trong khi chi phí hạn chế.
  • Bạn muốn vọc VPS, cài đặt thử service, sử dụng các loại OS khác nhau.
  • Bạn sử dụng VPS cho mục đích khác ngoài lưu trữ web.

Trên đây là những đánh giá của mình về Cloudzin,có tham khảo 1 số bài viết từ các web khác (do văn dỡ nên phải làm thế thôi) .Qua 1 thời gian sử dụng mình thấy Cloudzin thật sự tốt với tầm giá của nó.Bạn có thể tham khảo thêm ở website http://cloudzin.com.

Nếu bạn muốn mua VPS của Cloudzin có thể dùng link aff của mình http://nqdung.info/go/cloudzin/ Bạn sẽ không tốn bất cứ khoản phí nào và mình có thêm 1 số tiền nho nhỏ để duy trì website này.Sắp tới mình sẽ có nhiều bài viết hướng dẩn sử dụng VPS Cloudzin sao cho hiệu quả nhất.Mong các bạn sẽ ủng hộ mình

Thêm Breadcrumbs vào WordPress không cần Plugin

Breadcrumbs là một thành phần quan trọng của website nó giúp người dùng có thể biết được họ đang ở đâu trong website của bạn cũng tăng khả năng điều hướng và tính dễ sử dụng cho khách hàng.Có rất nhiều cách để tạo ra Breadcrumbs cho wordpress dùng plugin cũng có hay code cũng có.Hôm nay mình sẽ giới thiệu đến các bạn cách tạo ra Breadcrumbs( vụn bánh mỳ) cho WordPress mà không cần dùng Plugin.Như thế này :

dieu huong nguoi dung voi breadcrumb

Các tính năng của Breadcrumbs này như sau:

  • Hiển thị đầy đủ liên kết đến trang hiện tại: Ví dụ bài viết của chúng ta nằm trong danh mục con thì breadcrumbs sẽ giống như sau

Trang chủ »Danh mục» Danh mục con »Đăng Tiêu đề

  • Hiển thị ngắn gọn :

Trang chủ » Danh mục con »Đăng Tiêu đề

  • Nó cũng áp dụng cho Page và subPage.Ví dụ ta có Page với 3 cấp thì Breadcrumbs sẽ hiển thị như sau :

Trang chủ » Page Level 1 » Page Level 2 » Page Level 3

  • Những nơi mà Breacrumbs có thể được gắn:
    • Phân trang (nqdung.info/page/2).
    • category archive;
    • tag archive;
    • daily archive;
    • monthly archive;
    • yearly archive;
    • author archive;
    • single post page;
    • single page;
    • attachment page;
    • search results;
    • 404 error page.
  • Thêm số trang nếu như đang ở danh mục và số trang nhiều hơn 2.
  • Có thể tùy chọn dấu phân cách ở giữa.Mặc định là ».
  • Tùy chỉnh được dòng text cho link của trang chủ.
  • Quan trọng nhất là hổ trợ Google Rich Snippets.()

Code như sau :

Bạn chỉ cần thêm đoạn code này vào file function.php của theme bạn đang dùng.Sau đó thêm đoạn code này vào nơi bạn muốn hiển thị là ok rồi.

Chống spam comment đơn giản bằng Growmap Anti Spambot Plugin

plugin chong spam comment

Trong bài CommentLuv – Gia tăng lượt bình luận cho WordPress mình đã có nói đến sự quan trọng của comment trên một website,nhưng cũng có nhiều người lợi dụng nó để spam.Hiện nay có rất nhiều phần mềm cho phép bạn spam comment lên các website, diển đàn và mình cũng từng bị 1 lần.Trong vòng 1 tháng site của mình có hơn 10k comment nhưng nó không có giá trị gì cả.Có rất nhiều plugin có tác dụng chống spam comment nhưng mình thích nhất là Askimet và Growmap Anti Spambot Plugin,nếu kết hợp cả 2 thì bạn có thể phần nào yên tâm rồi đó.Askimet thì bài viết sau mình sẽ nói chi tiết hơn.Hôm nay mình sẽ nói về G.A.S.P.

G.A.S.P hoạt động như thế nào ?

Plugin này sẽ tạo ra một checkbox khi người dùng comment phải check vào thì mới gửi được comment.Đây là một cách đơn giản để tránh bot spam và cũng tránh phiền phức cho người dùng như gõ captcha.Tuy không thể ngăn chặn hết nhưng cũng có hiệu quả nhất định.

chong spam cho wordpress

Cài đặt và cấu hình G.A.S.P

Bạn cài đặt plugin xong vào phần Settings > G.A.S.P để thiết lập.G.A.S.P  cho phép bạn thay đổi các dòng thông báo của plugin nhưng bạn chỉ cần chú ý các thiết lập dưới đây:

phan thiet lap quan trong cua GASP

Maximum nunber of URL allowed in comment : Cho phép người dùng chèn tối đa bao nhiêu link vào comment.0 có nghĩa là chèn bao nhiêu cũng được.

Maximum nunber of words allowed in name field: Bạn cho phép người dùng nhập bao nhiêu ký tự vào ô name khi comment.

Tổng kết

Tuy GASP có thể giúp tăng chất lượng bình luận trên blog của bạn nhưng nó không phải là toàn năng nên khi cài vào đôi lúc bạn vẩn có thể thấy những comment lạ.Và plugin chỉ hổ trợ chứ không thay thế bạn được, bạn nên thường xuyên check comment trên blog của mình để tăng sự tương tác với người dùng.

CommentLuv – Gia tăng lượt bình luận cho WordPress

CommentLuv

Như bạn cũng đã biết Comment hay bình luận là một trong những thứ quan trọng nhất đối với một blogger vì nó thể hiện sự quan tâm của người đọc dành cho website của bạn.

Làm thế nào để thu hút comment ở blog của bạn ?

Đối với blog sử dụng WordPress thì khi bạn đến comment thì sẽ có một textbox cho bạn nhập địa chỉ website của bạn.Và khi bạn comment thì bạn sẽ có một backlink nofollow tại blog đó.Việc cho phép link từ website khác xuất hiện trên site của bạn giúp cho người đọc , bình luận có cơ hội quảng bá website của họ đến người khác khi tìm kiếm thông tin trên site của bạn, và bạn cũng có thể thu hút thêm nhiều lượt bình luận trên blog của mình.Đôi bên cùng có lợi.Nếu phần comment blog của bạn chưa cho nhập URL thì bạn nên chỉnh sửa lại điều này. :sure:

Continue reading “CommentLuv – Gia tăng lượt bình luận cho WordPress”

NQD Flat – Theme đơn giản cho blog cá nhân

NQD Flat là theme mình viết cách đây cũng khá lâu.Hôm nay share ra không phải là tự cao gì mà do một bạn yêu thích nó nên mình quyết định share ra cho mọi người cùng dùng.Theme này không có gì đặc biệt cả, do viết cho mình dùng nên mình thường hardcode hết nên bạn nào muốn dùng lại thì phải chỉnh sửa hơi nhiều đấy.

Continue reading “NQD Flat – Theme đơn giản cho blog cá nhân”

Tạo widget cố định đơn giản với Q2W3 Fixed Widget

Hôm nay mình xin giới thiệu với các bạn một plugin đơn giản mà hiệu quả trong việc tạo 1 widget cố định khi bạn lăn chuột.Bạn có thể search Google sẽ ra hàng đống bài hướng dẩn tạo 1 widget cố định bằng javascript và css.Tuy cũng có kết quả tương tự nhưng bạn sẽ tốn rất nhiều thời gian đặc biệt là những bạn không rành về code lắm.Nên hôm nay mình giới thiệu đến các bạn plugin này,bạn có thể quên đi các đoạn code lằng nhằng phức tạp, chỉ việc cài đặt và sử dụng Q2W3 Fixed Widget. 

co dinh widget o sidebar don gian nhat

Continue reading “Tạo widget cố định đơn giản với Q2W3 Fixed Widget”

Bộ icon Minion cực dể thương

bo icon minion cuc de thuong

Có bạn nào xem  Despicable Me 2 rồi chưa.Phải nói một điều khi xem phim mình rất thích những chú Minion dễ thương, ngộ nghĩnh và cũng quậy phá tưng bừng.Có lẽ rất nhiều bạn nữ cũng thích những chú Minion này.Đặt biệt các chú rất thích chuối.Từ khi bộ phim ra đời những clip chế về chúng cũng ngày càng nhiều như là Độc Thân Vui Tính

Continue reading “Bộ icon Minion cực dể thương”

Hướng dẩn cách tạo Sitemap trong WordPress

Sau khi hoàn thành website và bắt đầu có bài viết thì bạn cần quảng bá website đến mọi người để họ biết và truy cập vào website của bạn.Nhưng trước khi bắt đầu công việc quảng bá thì bạn cần phải làm một việc vô cùng quan trọng nhưng lại cực kỳ đơn giản.Đó là tạo sitemap cho website của bạn.

Vậy Sitemap là gì ?

google-sitemap Sitemap hiểu nôm na là một bản đồ thu nhỏ website của bạn, nó liệt kê tất cả các liên kết có trong site của bạn.

Continue reading “Hướng dẩn cách tạo Sitemap trong WordPress”