Blog

  • Cuộn Parallax: Nó Là Gì?

    The parallax scrolling effect is a design technique that’s relatively new in development and web design. Over the past few years since it’s hit the scene though, it’s grown pretty popular in its own right, and with good reason, too.

    Định nghĩa về Cuộn thị sai (Parallax Scrolling)

    Parallax scrolling is a technique wherein your web page’s background image scrolls at a slower rate compared to the foreground image. It gives the user a unique sense of depth and action while scrolling through a page when used on a website.

    Without Parallax Scrolling

    The elements of the web page – the text, images, buttons, etc – all scroll at the same rate as the background.

    With Parallax Scrolling

    The background image scrolls at a different rate as the rest of the elements in the page.

    Tác động của cuộn thị sai đến người dùng

    Tuy nhiên, kỹ thuật này không hẳn là mới mẻ và thực tế đã được sử dụng trong hoạt hình truyền thống từ tận những năm 1920. Nó cũng được áp dụng trong rất nhiều trò chơi điện tử kinh điển, chẳng hạn như Super Mario Bros.

    Dù vậy, trong lĩnh vực thiết kế web, Nike thường được ghi nhận là một trong những bên đầu tiên sử dụng hiệu ứng cuộn thị sai vào năm 2011. Kể từ đó, thuật ngữ “parallax scrolling” (đôi khi được gọi là “hình nền thị sai/parallax background”) đã trở thành một thuật ngữ phổ biến đối với cả các nhà thiết kế lẫn nhà phát triển, với độ phổ biến không ngừng gia tăng.

    Parallax scrolling as used in a version of Super Mario Brothers. Notice how the hills in the background move
    in slightly varying speeds, as compared to Mario and the other characters in the foreground.

    Người dùng nhận được lợi ích gì

    Điểm tuyệt vời của hiệu ứng này là thúc đẩy người dùng tương tác với trang web của bạn, làm tăng cả mức độ tương tác lẫn sức hút đối với người dùng. Và khi được thực hiện đúng cách, cuộn thị sai có thể thổi hồn vào cả những trang web đơn giản nhất. Thậm chí nó còn có thể được sử dụng để tạo ra những câu chuyện kể đầy lôi cuốn ngay lập tức thu hút mọi người xem trang web.

    Hãy chia sẻ tác phẩm của bạn với chúng tôi!

    Vậy các bạn nghĩ sao? Bạn đã sử dụng tính năng hình nền thị sai mới nhất từ PBS v4 chưa? Nó có mang lại hiệu quả cho bạn không? Đừng ngần ngại gửi liên kết đến tác phẩm của bạn hoặc để lại một số đề xuất trong phần bình luận bên dưới nhé.

    Chúc bạn xây dựng trang web vui vẻ!

  • 4 Sai Lầm Trong Thiết Kế Website Bạn Cần Tránh Trong Năm 2018

    If there’s one thing you need to remember when building a website, it’s to never take good design for granted.

    As we’ve mentioned in a previous article, a site visitor’s first impression on your website can make or break you in just a matter of seconds.

    In other words, if they don’t like what they see within that timeframe, chances are they’re going to close their browser windows and direct their attention elsewhere.

    Fortunately, there are a lot of ways to prevent this from happening; one of them is to familiarize yourself with good web design practices. And the good news is you don’t need to be a professional web designer in order to do so.

    Because while it’s true that not everyone has a good eye for design, preventing bad design becomes easier once you know what to avoid.

    Tuy nhiên, hãy chắc chắn rằng bạn luôn ghi nhớ 4 sai lầm phổ biến trong thiết kế web này. Bằng cách này, bạn sẽ bớt đi một điều phải lo lắng khi cuối cùng cũng bắt tay vào xây dựng trang web của mình.

    Sai lầm #1: Sử dụng nhiều hơn 3 phông chữ

    A rule of thumb when designing websites? Try not to have too much visual elements going on within your space. Having more than 3 fonts on your site design is a surefire way to break this one rule. It’ll also overwhelm your site visitors.

    Giữ phông chữ trên trang web của bạn ở mức tối đa 3 loại là một nguyên tắc thiết kế chung được các chuyên gia tuân thủ. Hơn nữa, điều này còn làm tăng khả năng đọc hiểu và tính nhất quán cho trang web của bạn, vốn là chìa khóa mang lại thành công cho lưu lượng truy cập trang web.

    DON’T DO THIS:

    Don’t use more than 3 fonts and try to avoid “fancy fonts” as much as possible. These tend to make your site look unprofessional and outdated.

    DO THIS:

    Use only 2 fonts, or a maximum of 3 if you have to. Notice how the page below looks clean and sleek, all while keeping readability and consistency all throughout the design.

    Try comparing the differences between this example and the previous one. The example below with only two fonts is a website that your visitors will likely take seriously.  This previous one above with the overwhelming amount of fonts isn’t.

    Mistake #2: Failing to Use White Space

    White space is one of the most important aspects of web design. But what is it?

    Put simply, white space is literally the empty space between elements in a composition.

    In other words, it’s negative space. This pertains to anything on your website that isn’t filled with text, photos, or other design elements.

    Now, the problem arises when website owners want to fill all of the white space in, which is an absolute no-no.

    White space matters because it gives your site visitors and readers some breathing space when going through your site. Just how it was mentioned in the first design mistake to avoid, overwhelming your website with too much design elements is more than enough reason for your site visitors to leave and for your traffic to decrease significantly. It also makes for poorly executed design.

    DON’T DO THIS:

    In the example below, take a look at how the text is nearing the edges of the purple section’s margin. Notice as well how all elements leave almost zero room for white space.

    DO THIS INSTEAD:

    Give your site readers some room to breathe. If adding in long paragraphs is unavoidable, just remember to always take the rules of spacing into account—they’re pretty easy to remember anyway ?.  It will leave your page looking cool, crisp, and professional.

    Mistake #3: Designing Websites With Zero Flow in Your Site’s Content

    It’s important to pay attention as to how  information on your website is presented. Moreover, site content should generally follow a logical flow, taking the site viewer’s intuition into consideration.

    Hãy xem hai ví dụ dưới đây để hiểu rõ hơn ý của chúng tôi.

    DON’T DO THIS:

    Unless you’re a graphic designer by profession, it’s probably not a good idea to experiment with the standard flow of your website’s sections.

    Below, you can see that the site’s design lacks both visual and logical flow; everything is all over the place. You don’t want your audience having a hard time navigating through your site, either. This is another surefire way to do it.

    DO THIS INSTEAD:

    Notice how the sections of the website flow depending on what actions the visitor is most likely to take.

    Thiết kế mang tính trực quan và có luồng phân bổ hợp lý: Đầu tiên, tổ chức tự giới thiệu và cung cấp cho người xem những thông tin cơ bản; chẳng hạn như tổ chức nói về điều gì và làm những gì. Thứ hai, tổ chức bổ sung các số liệu đáng tin cậy để tạo dựng uy tín. Cuối cùng, trang web cung cấp cho người xem số điện thoại liên hệ và danh sách các sự kiện, thúc đẩy họ hành động.

    Mistake #4: Trying to Fit in Every Bit of Information Onto Your Website

    Việc nhồi nhét cả khối văn bản không cần thiết vào những nơi lẽ ra nên để khoảng trắng có thể khiến khán giả của bạn rời đi. Hãy nhớ rằng chỉ nên giữ lại những chi tiết quan trọng.

    Studies find that readers only visit 20% of your webpage; everyone else outside that percentage will probably just scroll through your site.

    DON’T DO THIS.

    Don’t overwhelm your visitors with inconsistent, giant walls of text, especially if it means having to sacrifice your website design’s cohesiveness and structure.

    DO THIS INSTEAD:

    Keep your copy short and concise, and take out chunks of unecessary text if you can help it. Only keep vital information that your site visitors absolutely need to know.

    Conclusion

    Website design is important, and can be a huge deciding factor in whether or not you gain site traffic.

    Hãy nhớ đừng xem nhẹ điều này. Luôn dành thời gian để nghiên cứu và tìm đọc các bài viết về thiết kế để định hướng cho bạn trong suốt quá trình thực hiện. Chẳng mấy chốc, bạn sẽ thấy lưu lượng truy cập trang web của mình ngày càng tăng lên. ? Chúc bạn may mắn!

    Design in less time!

    Check out how much faster Page Builder Sandwich let you design your web pages.

    Try Live Preview

    This week’s useful resource:

    CANVA has hundreds of resources that you can access on their website. Apart from useful and easy-to-follow design tips, they also have photo editing tools, graphs, and a wide range of useful resources you can use for your creative projects.

    Hãy tham khảo Hướng dẫn về Màu sắc tuyệt vời này từ Canva cho dự án thiết kế tiếp theo của bạn.

    Canva Design Wiki

    Thỏa sức sáng tạo.

    Khám Phá Hướng Dẫn Về Màu Sắc Của Canva

  • Kỷ niệm sinh nhật đầu tiên của Page Builder Sandwich thật hoành tráng!

    pbs-v4-ad-3 Đúng vậy: Page Builder Sandwich sắp đón sinh nhật đầu tiên vào ngày 14 tháng 1 năm 2017. Cùng với chương trình Khuyến mãi Ngày lễ đang diễn ra của chúng tôi (giảm giá 30% trong thời gian có hạn, không cần mã khuyến mãi), PBS có một vài điều bất ngờ dành cho bạn, và đội ngũ chúng tôi rất nóng lòng được chia sẻ chúng với mọi người.

    Trong năm qua, chúng tôi đã phát triển vượt bậc nhờ sự hỗ trợ của những người bạn tuyệt vời, một số bài đánh giá vô cùng hữu ích, và những người bạn mới trong cộng đồng Slack của PBS. Chúng tôi không thể không nhắc đến các bạn – chính những người dùng PBS, những người đã giúp chúng tôi đạt được cột mốc này. Và để chúc mừng, chúng tôi nghĩ: còn cách nào tốt hơn để mang đến cho các bạn trải nghiệm tuyệt vời hơn nữa ngoài việc ra mắt PBS Phiên bản 4.0? Cùng tung hoa giấy nào.

    Trong trường hợp bạn đã bỏ lỡ, phiên bản hiện tại, Phiên bản 3.0, đã trải qua một số thay đổi và cải tiến lớn. Bao gồm giao diện gọn gàng hơn, mượt mà hơn và thân thiện với người dùng hơn, cùng khả năng thích ứng (responsiveness) tốt hơn. Tuy nhiên, đối với Phiên bản 4.0, chúng tôi sẽ mang đến những điều tuyệt vời hơn nữa! Vì vậy, hãy sẵn sàng, vì mọi thứ sẽ thú vị hơn, rộn ràng hơn và nhiều chức năng hữu ích hơn rất nhiều với bản phát hành sắp tới vào tháng 1.

    Tính năng Mẫu Toàn Trang

    Đầu tiên trong danh sách các tính năng lớn của chúng tôi là các Mẫu Toàn Trang hoàn toàn mới. Mặc dù PBS thường được sử dụng để xây dựng đủ loại trang khác nhau, chúng tôi đã cân nhắc kỹ lưỡng rằng người dùng của chúng tôi vận hành trang web trong các lĩnh vực ngách khác nhau (và do đó là các loại trang web khác nhau). Xét cho cùng, những người dùng khác nhau sẽ có những nhu cầu khác nhau, cho dù là phục vụ kinh doanh hay dự án cá nhân. Đó là lý do tại sao chúng tôi quyết định giải quyết vấn đề này bằng tính năng Mẫu Toàn Trang sắp tới.

    pbs-v4-ag-2 Vậy các Mẫu Toàn Trang này hoạt động như thế nào? Rất đơn giản. Đối với Phiên bản 4.0, chúng tôi sẽ phát hành hàng loạt mẫu thiết kế tuyệt vời. Chúng sẽ được chia thành các danh mục khác nhau; mỗi danh mục được thiết kế cho một lĩnh vực cụ thể. Các mẫu sẽ bao gồm các phần tử, bố cục và tính năng cho các trang doanh nghiệp, hồ sơ năng lực (portfolio), trang thương mại điện tử, hoặc chỉ là blog cá nhân thông thường (cùng nhiều loại khác) để hoàn toàn phù hợp với bất kỳ trang web nào bạn cần.

    Ví dụ: nếu bạn đang điều hành một nhà hàng và cần một trang hoặc trang web phục vụ chuyên biệt cho loại hình kinh doanh đó, bạn chỉ cần chọn mẫu nhà hàng. Và vì PBS cho phép tùy biến linh hoạt, bạn vẫn có thể tạo kiểu theo ý thích của mình. Đồng thời, vì mẫu bạn chọn (trong trường hợp này là nhà hàng) sẽ đi kèm với các tính năng riêng biệt được thiết kế riêng cho trang web kinh doanh theo chủ đề nhà hàng, nó cũng sẽ có sẵn các phần tử PBS đáp ứng nhu cầu của loại trang web đó: chẳng hạn như toàn bộ một phần dành cho thực đơn, tính năng giao hàng, các nút mạng xã hội và nhiều hơn nữa. Giờ hãy hình dung một điều tương tự cho lĩnh vực cụ thể của bạn – dù bạn đang vận hành một văn phòng doanh nghiệp, một cơ sở kinh doanh cá nhân hay thậm chí chỉ là một portfolio – đừng lo lắng. Với Phiên bản 4.0, chúng tôi cũng sẽ phát hành các mẫu cho những lĩnh vực đó. Chắc chắn chúng sẽ rất hữu ích trong kế hoạch xây dựng trang web tiếp theo của bạn!

    Nhiều Phần Tử Hơn, Nhiều Tùy Chọn Hơn

    Cùng với các Mẫu Toàn Trang mới, chúng tôi cũng có rất nhiều điều thú vị khác sắp ra mắt! Như chúng tôi luôn nói, PBS tồn tại vì chúng tôi tin rằng việc tạo ra những điều tuyệt đẹp và ấn tượng không nhất thiết phải khó khăn như mọi người vẫn nghĩ. Với suy nghĩ đó, chúng tôi mời bạn xem qua các tính năng sắp ra mắt khác của chúng tôi, để bạn có thể tự mình thấy được những trang và trang web gọn gàng, tuyệt vời mà bạn sẽ có thể tạo ra với PBS!

    Hình nền Parallax

    Cuộn trang Parallax là một kỹ thuật được sử dụng để tạo hiệu ứng nền 3D độc đáo cho trình duyệt của bạn. Nó tạo nên điểm nhấn cực kỳ bắt mắt cho bất kỳ trang web nào, và khi được thực hiện đúng cách, chắc chắn có thể giúp tăng lượng khách truy cập. Bạn vẫn chưa tin? Hãy xem trang web tuyệt vời này của FireWatch đã thể hiện hiệu ứng parallax một cách hoàn hảo.

    Hình nền Video

    Hình nền video cũng là một hiệu ứng phổ biến được sử dụng trên các trang web, đặc biệt là trên trang chủ, trang đích (landing page) và phần hero header. Chúng cũng ấn tượng không kém, và có lý do để chúng trở nên thịnh hành, hãy tin chúng tôi! Và với bản cập nhật PBS mới nhất, bạn cũng sẽ có cơ hội trải nghiệm hình nền video. Hãy thử sử dụng chúng để thu hút người xem và nhận được nhiều lượt truy cập trang web hơn!

    Đếm ngược Thời gian

    Đối với Phiên bản 4.0, chúng tôi cũng sẽ phát hành tính năng Đếm ngược Thời gian hoàn toàn mới. Tính năng này sẽ bao gồm các tùy chọn cơ bản như thiết lập ngày và giờ chính xác mà bạn đang đếm ngược đến, cộng với các tùy chọn tùy biến linh hoạt luôn sẵn có mà chúng tôi chắc chắn bạn sẽ yêu thích.

    Biểu tượng Mạng xã hội

    Bạn muốn khuyến khích độc giả lan tỏa thông tin về các bài viết của bạn trên mạng xã hội? Đừng lo, vì PBS luôn đồng hành cùng bạn! Với các biểu tượng mạng xã hội mới, độc giả sẽ có thể chia sẻ trang web và nội dung của bạn chỉ bằng một cú nhấp chuột đơn giản.

    Tuy nhiên, chúng tôi còn nhiều điều thú vị hơn dành cho bạn! Bao gồm:

    • Khả năng thêm bài viết vào nội dung của bạn
    • Thanh tiến trình
    • Số đếm tăng dần
    • Các phần tử cho WooCommerce, Advanced Custom Fields (ACF), Contact Form 7
    • Ý kiến khách hàng (Testimonials)
    • Bảng giá
    • Nút kêu gọi hành động (Click to action)
    • Hộp hình ảnh
    • Hộp biểu tượng
    • Tìm kiếm và tải xuống hình ảnh miễn phí
    • Khả năng thêm CSS tùy chỉnh
    • …và Nhiều hơn nữa!

    Khả năng Thích ứng (Responsiveness)

    Cuối cùng, bên cạnh tất cả các tính năng mới tuyệt vời này, PBS cũng sẽ tự hào với khả năng hiển thị thích ứng thậm chí còn tốt hơn nữa.

    pbs-v4-ag-1 Trước đây, việc xem và chỉnh sửa trang PBS trên thiết bị di động không hẳn là một trải nghiệm dễ dàng – kích thước phông chữ không khớp, hình ảnh không đúng tỷ lệ – nhìn chung, chúng tôi biết mình phải cải thiện giao diện người dùng của PBS trên di động, và đó chính xác là những gì chúng tôi đã làm. Chúng tôi đã hoàn thiện tính năng này và điều chỉnh để nó không chỉ đẹp hơn về mặt giao diện người dùng mà còn mượt mà và dễ tiếp cận hơn. Giờ đây, bạn sẽ có thể xem và chỉnh sửa trang web của mình trên di động một cách hoàn toàn dễ dàng. Đôi mắt của bạn chắc chắn sẽ cảm ơn bạn, và độc giả của bạn cũng vậy.

    Mượt mà hơn, Tốt hơn, Tuyệt vời hơn.

    Để kết lại, chúng tôi xin chân thành cảm ơn sự ủng hộ và tin tưởng của bạn dành cho PBS, và chúng tôi hy vọng bạn cũng hào hứng như chúng tôi, vì tất cả chúng ta sắp bước vào một hành trình tuyệt vời!

    Vậy những bản cập nhật sắp tới này có đáp ứng kỳ vọng của bạn không? Bạn có đề xuất nào khác cho v4 không? Hãy để lại bình luận cho chúng tôi bên dưới và chúng tôi sẽ xem có thể làm được những gì!

    Để cập nhật thêm thông tin về v4 (và các tính năng tuyệt vời khác), hãy đăng ký nhận bản tin của chúng tôi bên dưới bằng cách nhấn nút ‘Đăng ký’! Đừng lo – bạn có thể hủy đăng ký bất cứ lúc nào.

    Chúc các bạn có một kỳ nghỉ lễ tuyệt vời,

    Đội ngũ PBS

    Chúc bạn xây dựng trang web vui vẻ!

  • #PBSUpdate: Tăng 200% hiệu suất & Các thành phần mới

    Only a few weeks ago, we released PBS Version 4.1. This update included tweaks on the formatting bar and some text formatting updates, among others. For Version 2.0 though, while we made additional features, we decided to focus more on PBS’ overall performance.

    200% Performance Increase & A Little Help from CodeInWP

    Điều thôi thúc thay đổi này là một bài viết về kỳ vọng đối với các công cụ tạo trang từ CodeInWP. Bài viết nêu bật một danh sách ngắn các công cụ họ yêu thích nhất, đánh giá từng công cụ theo các tiêu chí cụ thể. Mặc dù Page Builder Sandwich không lọt vào danh sách chính thức, chúng tôi cũng đã được đề cập ngắn gọn trong bài viết:

    With Page Builder Sandwich you won’t also lose your content and will be able to continue updating the page easily via a default WordPress editor.

    Đọc được điều này chính là động lực thúc đẩy đội ngũ của chúng tôi cải thiện PBS hơn nữa. Và vì không được đưa vào danh sách, chúng tôi cũng đồng thời tò mò muốn biết những thiếu sót cụ thể của mình là gì. Một thời gian ngắn sau đó, chúng tôi đã liên hệ với CodeInWP để xin một đánh giá ngắn về PBS, và tác giả khách mời Ann Taylor đã gửi cho chúng tôi một phản hồi rất mang tính xây dựng và hữu ích:

    “…I played around with a free version a bit. It shows a lot of promise: lots of modules, pretty intuitive UI, great WYSIWYG experience, everything is dragged around easily. However, when I had around 10 modules on the page, it became hard to continue working with it because of low editing speed…”

    Phản hồi tuyệt vời này đã thôi thúc chúng tôi nghiên cứu sâu hơn về tốc độ và hiệu suất của PBS. Chúng tôi đã thử nghiệm rất nhiều tình huống khác nhau và phát hiện ra các nút thắt lớn về tốc độ. Nguyên nhân gốc rễ của các vấn đề hiệu suất là các phép tính khác nhau mà plugin thực hiện để hiển thị đường viền phác thảo, thanh công cụ và các chỉ dấu chỉnh sửa trực quan khác. Dưới đây là biểu đồ hiệu suất của PBS phiên bản 4.1 trên Chrome:

    Here are the important points of the graph in a nutshell:

    • Các vùng màu tím cao biểu thị tình trạng xấu
    • Các vùng màu tím rộng biểu thị tình trạng tồi tệ hơn
    • Chúng tôi đã tăng tốc mọi thứ lên rất nhiều, và bây giờ biểu đồ của chúng tôi cho phiên bản 4.2 trông như thế này:

    If you compare the tall and wide purple areas from the two graphs, that means that we have achieved a 200% performance increase!

    4 New Elements

    Điều chúng tôi thích nhất ở 4 phần tử mới này là chúng có khả năng tạo toàn bộ các phần trang web một cách nhanh chóng và hiệu quả, mà không cần phải kéo từng phần tử một vào không gian làm việc của PBS. Chúng tôi cũng sẽ mang đến cho bạn cơ hội lựa chọn từ các kiểu dáng khác nhau để bạn có thêm không gian tùy chỉnh ba phần tử mới này sao cho phù hợp với nhu cầu thiết kế của mình.

    Spacer Element

    Thật dễ dàng để điều chỉnh lề của phần tử nhằm tạo khoảng trống mà bạn cần. Phần tử khoảng cách (spacer) có thể được sử dụng như một giải pháp thay thế cho việc này. Điều này đặc biệt hữu ích nếu bạn muốn một số hàng nhất định không bị thu nhỏ quá mức trên màn hình di động.

    Featurette Element

    Phần tử featurette có thể được sử dụng để tạo các phần trên trang của bạn với tốc độ nhanh hơn. Các phần này có thể bao gồm hero header, carousel đánh giá của khách hàng và những mục khác mà bạn có thể dùng để nâng cao chức năng của trang.

    Since all of the Featurette Elements are pre-designed, all you’ll have to do is simply drag the “Featurette” button from the Elements Tab, and choose what you want to add on your workspace from there.

    Team Members Element

    Phần tử thành viên nhóm rất hoàn hảo để giới thiệu các thành viên trong đội ngũ của bạn với khách truy cập trang web. Thông thường, một phần như thế này bao gồm ảnh của thành viên nhóm, cùng với một đoạn mô tả ngắn ở bên dưới.

    Gallery Element

    Phần tử này được sử dụng để tạo thư viện ảnh. Trước đây, bạn phải kéo từng phần tử riêng biệt (như nút, khung, v.v.) vào không gian làm việc của PBS để tạo thư viện. Tuy nhiên, phần tử mới này sẽ làm điều đó cho bạn, giúp quá trình này trở nên dễ dàng và không gặp bất kỳ phiền toái nào.

    A Huge Thank You

    Phiên bản 4.2 là một trong những bản cập nhật quan trọng nhất của chúng tôi từ trước đến nay. Rốt cuộc, hiệu suất và tính năng là điều tối quan trọng đối với bất kỳ plugin tuyệt vời nào. Chúng tôi muốn gửi lời cảm ơn đến @Ann Taylor và CodeInWP vì đã cho chúng tôi những phản hồi mang tính xây dựng và chúc chúng tôi may mắn trong hành trình của mình. Và đối với tất cả người dùng PBS, chúng tôi cũng xin gửi lời cảm ơn chân thành vì sự ủng hộ liên tục của các bạn.

    Chúng tôi sẽ sớm phát hành thêm nhiều bản cập nhật hơn nữa (bao gồm tính năng Google Fonts như đã hứa, cùng nhiều tính năng khác), vì vậy hãy đón chờ nhé!

    Cho đến lúc đó, chúc bạn xây dựng trang web vui vẻ từ Đội ngũ PBS!

  • Nơi Mọi Thứ Trở Nên Hơi Kỹ Thuật: Cách Chúng Tôi Hiện Thực Hóa Phiên Bản Shortcode Mapping Của Mình

    How-We-Made-Our-Version-Of-Shortcode-Mapping-Happen-2Trong bài viết trước, chúng tôi đã thảo luận về những điều cơ bản của việc ánh xạ shortcode và cách bạn có thể tận hưởng những lợi ích tuyệt vời của nó. Chúng tôi đã quyết định tách bài viết giới thiệu phiên bản Shortcode Mapping của Page Builder Sandwich, vì nội dung sau đây có thể hơi kỹ thuật hơn một chút.

    Dưới đây là các mô tả chuyên sâu hơn về cơ chế hoạt động bên trong của tính năng ánh xạ shortcode của chúng tôi và cách chúng tôi vận hành nó.

    Một quy trình tự động

    Để quyết định những plugin nào sẽ được đưa vào trình ánh xạ shortcode, chúng tôi đã xây dựng một tập lệnh tự động thu thập các plugin hàng đầu trong thư mục plugin của WordPress dựa trên các tiêu chí sau:

    • Nằm trong số 1.000 plugin phổ biến, được xếp hạng hàng đầu và được cập nhật, có ít nhất 4.000 lượt cài đặt đang hoạt động,
    • Có ít nhất 4.000 lượt cài đặt đang hoạt động,
    • Có ít nhất 20 lượt đánh giá, và;
    • Có điểm đánh giá trung bình từ 3 sao trở lên

    Chúng tôi chạy truy vấn này hàng ngày trên thư mục plugin của WordPress. Các bộ lọc này đảm bảo rằng chúng tôi có được danh sách các plugin chất lượng tốt mà nhiều người sử dụng. Tại thời điểm viết bài này, các tiêu chí này đã cho ra kết quả 800 plugin. Đó là một con số rất lớn. Thực sự rất nhiều.

    Some of the most popular plugins detected for shortcode mapping.
    Một số plugin phổ biến nhất được phát hiện để ánh xạ shortcode.

    Sau đó, chúng tôi chạy một loạt các kiểm tra tự động trên mã nguồn của từng plugin để tìm xem nó có chứa bất kỳ shortcode nào không, rồi chúng tôi cố gắng tìm tất cả các shortcode đó, bao gồm tất cả các thuộc tính của chúng. Khi xử lý dữ liệu, kết quả mang lại hơn 2.000 shortcode. Thật sự kinh ngạc. Các shortcode được phát hiện sau đó sẽ được nhập vào cơ sở dữ liệu ánh xạ shortcode để kiểm tra thủ công.

    Vào cuối quy trình này, chúng tôi sẽ có được một danh sách khổng lồ các plugin và các shortcode có thể có của chúng. Bây giờ vấn đề là làm sạch dữ liệu này để đảm bảo mọi thứ đều chính xác.

    Một quy trình thủ công

    Đây có lẽ là phần khó khăn nhất của toàn bộ hệ thống ánh xạ. Mã plugin có nhiều hình thức và cấu trúc khác nhau, không phải tất cả các shortcode đều được tập lệnh của chúng tôi tự động phát hiện. Mặc dù WordPress Codex hướng dẫn sử dụng hàm `shortcode_atts` để lọc các thuộc tính của shortcode, nhưng đây chỉ là một khuyến nghị và không phải ai cũng làm như vậy. Ngoài ra cũng không có cách nào chắc chắn để kiểm tra cấu trúc bên trong của một shortcode khi plugin được cài đặt.

    Vì vậy, để đảm bảo rằng chúng tôi lấy đúng tất cả các shortcode và thuộc tính của chúng, chúng tôi đã tạo một khu vực giao diện người dùng dành riêng cho việc chỉnh sửa shortcode và thuộc tính, được xây dựng bằng AngularJS và Bootstrap.

    Bootstrap & AngularJS interface for fixing up all the mapped shortcodes.
    Giao diện Bootstrap & AngularJS để chỉnh sửa tất cả các shortcode đã được ánh xạ.

    Chúng tôi sẽ phải kiểm tra thủ công từng plugin và xem xét tài liệu hướng dẫn shortcode của chúng để đảm bảo rằng tất cả dữ liệu chúng tôi có đều chính xác.

    Mặc dù công việc này tốn nhiều công sức và tẻ nhạt, nhưng việc có một quy trình tự động cũng có một số điểm sáng:

    • Theo số liệu thống kê ban đầu của chúng tôi, chỉ có khoảng 1 trong mỗi 2 plugin có chứa shortcode.
    • Một nửa số shortcode được phát hiện không có thuộc tính nào (nhưng một phần trong số này có thể là kết quả dương tính giả)
    • Bằng cách chỉ chọn các plugin có chất lượng tốt, nhiều khả năng chúng đều có tài liệu hướng dẫn về shortcode

    Chỉ khi tất cả các shortcode của một plugin đã được kiểm tra, máy chủ mới bắt đầu phân phối các ánh xạ shortcode của plugin đó cho người dùng.

    Một lệnh gọi Rest API

    Mảnh ghép cuối cùng chính là bản thân plugin. Khái niệm ở đây rất đơn giản: tìm hiểu xem những plugin nào đang hoạt động, trang web đang sử dụng theme nào và có những shortcode nào khả dụng, sau đó truy vấn cơ sở dữ liệu ánh xạ shortcode xem nó có các ánh xạ hay không. Để làm điều này, chúng tôi đã tạo một điểm cuối WP REST API tùy chỉnh mà tất cả máy khách gửi yêu cầu đến để lấy các ánh xạ shortcode mới nhất của họ.

    Tương lai: Đóng góp từ cộng đồng

    Việc kiểm tra thủ công từng plugin đòi hỏi rất nhiều thời gian và công sức. Khi nền tảng ánh xạ shortcode đã ổn định, chúng tôi dự định sẽ mở tính năng ánh xạ shortcode cho mọi người. Điều này có nghĩa là bất kỳ ai cũng có thể hỗ trợ thêm shortcode.

    Bạn có thể đang nghĩ, “tại sao tôi lại phải giúp ánh xạ các shortcode? Tôi nhận được gì từ việc đó?” Chà, có một vài lý do giải thích tại sao mọi người lại muốn giúp đỡ:

    1. Nếu bạn đã tạo một plugin và chúng tôi chưa thu thập được nó do các tiêu chí nêu trên (và nó nằm trong thư mục plugin của WordPress), thì bạn có thể tự mình thêm các ánh xạ. Plugin của bạn sẽ được PBS hỗ trợ đầy đủ!
    2. Vì chúng tôi chỉ xử lý những plugin trong thư mục plugin của WordPress trong quy trình tự động, nên các tác giả plugin & theme trả phí sẽ không được đưa vào. Vì vậy, nếu bạn sở hữu một plugin hoặc theme như vậy, bạn cũng có thể thêm các ánh xạ shortcode cho chúng.
    3. Và đối với những người không tạo plugin, chúng tôi có thể trao thưởng cho những người giúp đỡ. Để biến việc ánh xạ shortcode thành một nỗ lực hấp dẫn, chúng tôi có thể tặng những người nhiệt tình hỗ trợ một giấy phép cá nhân hoặc nâng cấp lên giấy phép cao cấp của PBS!

    Đăng ký nhận bản tin của chúng tôi

    Tính năng ánh xạ shortcode dự kiến sẽ ra mắt khách hàng của chúng tôi vào ngày 12 tháng 8  ngày 15 tháng 8  ngày 16 tháng 8 năm 2016. Không phải tất cả các shortcode sẽ được ánh xạ vào thời điểm này (ước tính của chúng tôi có thể là 100 plugin), nhưng việc ánh xạ sẽ được thực hiện liên tục và khách hàng sẽ nhận được chúng ngay khi các bản mới được phát hành.

    Hãy đăng ký nhận bản tin của chúng tôi để cập nhật tin tức về ánh xạ shortcode, thời điểm chúng tôi phát hành tính năng này và khi nào chúng tôi mở tính năng ánh xạ shortcode cho cộng đồng!

  • CẬP NHẬT PBS: Phiên bản 4.1 và Khả năng sử dụng

    Sau khi phiên bản 4.0 được phát hành vào tháng 1 vừa qua, chúng tôi đã tiếp tục nỗ lực phát triển PBS, bổ sung cả các bản sửa lỗi và cải tiến. Chúng tôi rất hào hứng được chia sẻ chúng với bạn, vì vậy đây là những gì chúng tôi đã chuẩn bị cho bản cập nhật Phiên bản 4.1.

    Các cải tiến cho thanh định dạng

    Bản cập nhật 4.1 mới nhất xoay quanh thanh định dạng văn bản. Ngoài việc giải quyết rất nhiều lỗi, chúng tôi cũng đã cải thiện một số thứ trên thanh công cụ này nhằm giúp trải nghiệm của bạn với PBS mượt mà và hiệu quả hơn.

    Các cập nhật cho bộ chọn màu

    Trong các phiên bản trước của PBS, bộ chọn màu gặp một số vấn đề gây ra chút bất tiện cho quá trình chỉnh sửa, cụ thể là khi chỉnh sửa văn bản và màu văn bản. Tuy nhiên, đối với v4.1, chúng tôi đã xử lý vấn đề này và thực hiện các điều chỉnh mới để việc chỉnh sửa văn bản trở nên dễ dàng, không còn phiền toái.

    • Nhiều ô mẫu màu hơn để chọn màu dễ dàng hơn
    • Bộ chọn màu hiện đã hiển thị độ trong suốt
    • Sửa các lỗi liên quan đến việc chỉnh sửa màu văn bản

    Các cập nhật về định dạng văn bản

    Trước đây, chúng tôi có một số nút mà bạn phải nhấp liên tục để tăng giá trị, sau đó giữ CTRL/CMD rồi nhấp để giảm. Ban đầu chúng tôi nghĩ rằng điều này trực quan, nhưng người dùng đã phản hồi rằng điều này không hề rõ ràng. Chúng tôi đã khắc phục những điểm chưa nhất quán đó trong bản cập nhật này.

    • Chiều cao dòng giờ đây dễ truy cập hơn: kéo thanh trượt để điều chỉnh theo kích thước mong muốn, hoặc chỉ cần nhập kích thước bạn muốn vào ô được cung cấp
    • Nút cỡ chữ đã được chia thành hai nút: giảm và tăng để sử dụng dễ dàng hơn
    • Tăng/giảm cỡ chữ cũng dễ tiếp cận hơn, hiện có thêm px làm đơn vị đo lường để chỉnh sửa thuận tiện hơn. Trước đây, nó hiển thị đơn vị “x” vốn không thực sự có ý nghĩa gì
    • Các nút căn lề trái/giữa/phải/căn đều hiện được nhóm lại với nhau để giảm bớt số lượng nút hiển thị
    • Nút “Xóa định dạng” giờ đây cũng xóa các kiểu khác (như chiều cao dòng), điều mà trước đây chưa thực hiện được

    Cải tiến cho đường phân cách ngang

    Trước đây, đường phân cách ngang đã gây ra một số vấn đề. Với một số giao diện, các đường kẻ ngang quá nhỏ đến mức khó có thể nhấp vào. Để khắc phục điều này, chúng tôi đã xóa đường kẻ ngang khỏi thanh định dạng và chuyển đổi nó thành một phần tử riêng biệt. Thêm vào đó, giờ đây bạn cũng có thể thay đổi màu sắc của đường kẻ thông qua bộ chọn màu.

    Các bản cập nhật tương lai: PBS sẽ có những gì?

    Như chúng tôi đã nói, chúng tôi vẫn đang phát triển những điều mới mẻ (và nhiều bản cập nhật hơn). Dưới đây là một vài hé lộ về những gì chúng tôi sắp mang đến cho bạn trong tương lai:

    • Google Fonts (cuối cùng cũng có!)
    • Chúng tôi đang thử nghiệm ý tưởng biến thanh định dạng văn bản thành nhiều hơn là chỉ một nơi để định dạng văn bản. Sẽ ra sao nếu các nút thay đổi tùy thuộc vào ngữ cảnh hiện tại? Ví dụ, sẽ khá tuyệt vời nếu nút căn lề theo chiều dọc xuất hiện khi bạn đang chỉnh sửa văn bản bên trong một cột.

    Bạn muốn thấy điều gì trong các bản cập nhật PBS tương lai?

    Chúng tôi luôn sẵn sàng cải thiện PBS, vì vậy nếu các bạn có bất kỳ đề xuất nào, hãy liên hệ với chúng tôi! Bạn có yêu cầu tính năng nào muốn thêm vào danh sách ngày càng mở rộng của chúng tôi không? Có điều gì khác bạn nghĩ cần điều chỉnh trong phiên bản hiện tại không? Hãy cho chúng tôi biết trong phần bình luận bên dưới nhé!

    Chúc bạn xây dựng trang web vui vẻ!

  • Các biện pháp an toàn trong WordPress: Tầm quan trọng của việc sao lưu

    safety-measures-in-wordpress-the-importance-of-backupsHãy tưởng tượng điều này: Trang web WordPress đầu tiên của bạn cuối cùng cũng đã đi vào hoạt động. Bạn chưa bao giờ cảm thấy thỏa mãn như thế này trong nhiều tháng qua. Bạn tự thưởng cho mình một cái vỗ vai xứng đáng, và những người đã giúp bạn đạt được thành quả lao động này cũng vậy. Bạn cài đặt các plugin cần thiết và bắt đầu lên kế hoạch xa hơn cho tương lai của trang web. Tương lai trông thật tươi sáng và mọi thứ đang diễn ra vô cùng suôn sẻ.

    Cho đến khi điều không tưởng xảy ra. Và trang web của bạn bị sập.

    Bạn nhún vai tự nhủ. Bạn đã từng nghe nói về những chuyện như thế này xảy ra, ngay cả với những người giỏi nhất. Trời ạ, bạn chắc chắn Mark Zuckerberg và David Karp cũng từng gặp phải chuyện như thế này trước đây, và hiện tại cả hai người họ đều vẫn ổn, phải không?

    Vì vậy, bạn cố gắng đưa nó hoạt động trở lại, cuống cuồng tìm kiếm các cách khắc phục trên Google. Lần thử đầu tiên không thành công. Lần thứ hai cũng vậy – hay lần thứ ba, thứ tư, thứ mười bảy và thậm chí cả lần thứ hai mươi hai. Mắt bạn mở to khi nhận ra rằng bạn đã hoàn toàn tiêu đời; trang web của bạn đã biến mất vĩnh viễn. Bạn lục tung khắp trang mạng để tìm giải pháp, nhưng hầu như tất cả các trang web hướng dẫn đều nói cùng một điều:

    Đáng lẽ ra bạn nên sao lưu các tệp WordPress của mình ngay từ đầu.

    Đáng lẽ ra bạn nên sao lưu các tệp WordPress của mình ngay từ đầu.

    Đáng lẽ ra bạn nên sao lưu các tệp WordPress của mình ngay từ đầu.

    Nhẹ nhất thì đây cũng là một trong những cơn ác mộng tồi tệ nhất của người sở hữu trang web. Đây chính xác là điều chúng ta muốn tránh, vậy chính xác thì làm thế nào để ngăn chặn nó? Chà, câu trả lời khá đơn giản: Chúng ta cần cài đặt một plugin sao lưu tốt.

    "a very "secure" bridge" by Garrett LeSage is licensed under CC BY-SA
    “a very “secure” bridge” của Garrett LeSage được cấp phép theo CC BY-SA

    Bắt đầu như thế nào và từ đâu?

    Bước đầu tiên trong việc sao lưu trang web WordPress của bạn là biết chính xác những gì bạn cần sao lưu. WPBeginner, trong bài viết của họ “Which WordPress Files Should You Backup? And the Right Way To Do It”, đã liệt kê những tệp thiết yếu sau đây cần được sao lưu cho nhiệm vụ này:

    • Các tệp WordPress cốt lõi
    • Các tệp trong thư mục wp-content (giao diện, plugin và tệp tải lên của bạn)
    • Tệp cấu hình WordPress
    • Cơ sở dữ liệu WordPress của bạn

    Giải thích thêm một chút về sao lưu

    Bản thân WordPress không đi kèm với các hệ thống bảo mật và sao lưu riêng cho trang web của bạn (dù bạn có thể học cách thiết lập thủ công– mặc dù việc đó sẽ tốn rất nhiều thời gian), vì vậy việc tìm cách giảm bớt các rắc rối phụ thuộc vào bạn. Cập nhật trang web luôn là điều hiển nhiên (phòng trường hợp bạn muốn thêm bất kỳ nội dung mới nào vào đó, chẳng hạn như một plugin khác, hoặc nếu bạn muốn gỡ bỏ thứ gì đó), và sao lưu là điều bắt buộc, trừ khi bạn muốn mất dữ liệu (chắc chắn là bạn không muốn rồi). Các lý do khác để sao lưu trang web của bạn và thắt chặt bảo mật bao gồm việc đảm bảo trang web không bị hacker xâm nhập và không ai có thể đánh cắp bất kỳ dữ liệu nào của trang web.

    “Cũng có plugin cho việc đó đấy.”

    WordPress có vô số plugin cho đủ loại tính năng, bao gồm (vâng, bạn đoán đúng rồi đấy) một số plugin cho các biện pháp bảo mật và sao lưu. Bạn cũng có thể chọn từ rất nhiều plugin như thế này; một vài plugin phổ biến hơn bao gồm BackupBuddy và UpDraftPlus. Có rất nhiều bài đánh giá cho các plugin này (và hơn thế nữa) ở hầu khắp mọi nơi, vì vậy đừng lo lắng – điều kỳ diệu của internet luôn hỗ trợ bạn. Cá nhân chúng tôi sử dụng VaultPress cho cả bảo mật và sao lưu vì những lý do sau:

    1. VaultPress được tạo ra bởi Automattic– được sáng lập bởi Matt Mullenweg– chính là người đã sáng lập nên WordPress. Nhiều, nếu không muốn nói là hầu hết các sản phẩm và dịch vụ của Automattic đều rất đáng tin cậy, và việc đăng ký sử dụng các plugin đã được thử nghiệm và kiểm chứng chưa bao giờ là một ý tồi.
    2. Không giống như hầu hết các plugin sao lưu, VaultPress không yêu cầu dung lượng lưu trữ. Họ lưu trữ dữ liệu của bạn trên các máy chủ của chính họ, vì vậy bạn sẽ không nhận được bất kỳ thông báo nào kiểu như “bạn đang ngốn rất nhiều dung lượng máy chủ” từ nhà cung cấp dịch vụ lưu trữ web của mình.
    3. Sự đơn giản. Để sử dụng, bạn chỉ cần đăng nhập vào giao diện người dùng của mình, và bạn có thể xem tất cả chi tiết sao lưu cũng như thực hiện các thao tác từ đó.

    Hiện tại, vì VaultPress đáp ứng các tiêu chuẩn cá nhân của chúng tôi, nên nó hoạt động hoàn hảo cho chúng tôi. Tuy nhiên, nếu bạn không hài lòng với VaultPress, nhiều trang web – chẳng hạn như WPBeginner và wpmudev — cung cấp các bài viết so sánh đối chiếu thông thường trong trường hợp bạn gặp khó khăn trong việc đưa ra quyết định.

    Tất cả tùy thuộc vào bạn

    Sau cùng, quyết định có bảo mật và sao lưu trang web của bạn hay không là tùy thuộc vào bạn. Một số người tự tin rằng họ sẽ có thể đối mặt với những rủi ro mà một trang web không bảo mật mang lại… và một số người thì không – và điều đó hoàn toàn bình thường. Rốt cuộc thì cẩn tắc vô ưu vẫn hơn.

    Dù bạn chọn quyết định nào, hãy luôn nhớ cân nhắc các lựa chọn của mình. Suy cho cùng, chỉ có bạn mới có thể đánh giá được những gì mình có khả năng xử lý.

    Chúc bạn may mắn!

  • 10 cách giúp trang web của bạn xuất sắc trong việc tạo khách hàng tiềm năng & Cách PBS có thể giúp bạn thực hiện

    Page Builder Sandwich helps you, well… build websites.

    Keeping your audience reeled into your page (and successfully generating leads) is a different story altogether, though.

    Don’t get us wrong. Lots of sites can achieve this without a worry, but that’s usually because they spend a significant amount of time and research doing just that.

    In contrast, some sites admittedly have a little trouble pulling it off, and more often than not, some of them don’t know where to begin. But don’t worry – Page Builder Sandwich will try to lend you a hand with that very same thing.

    Why is it Important to Generate Leads?

    One crucial thing to remember is that generating leads takes more than just buying a domain and setting a website up.

    Now, before we get too into it, take note that Page Builder Sandwich isn’t a marketing website.

    Nhưng trong mọi trường hợp, điều quan trọng cần biết là việc tạo khách hàng tiềm năng là cả một môn khoa học, và mặc dù bản thân chúng tôi không phải là những nhà tiếp thị kỹ thuật số, nhưng cần lưu ý rằng việc chuyển đổi khách hàng tiềm năng thành công cũng liên quan đến việc triển khai thiết kế và nội dung một cách hợp lý. Đó chính là lúc chúng tôi vào cuộc.

    “Nhưng các bạn có thể giúp gì được về khía cạnh tiếp thị của toàn bộ quá trình này?”

    Great question! A few weeks ago we began corresponding with Straight North, a blog that specializes in digital marketing and lead conversion. They’ve given us some really tips which we hope you guys find helpful in your site-building journey.

    Now, remember that there could be lots of factors as to why your website isn’t generating the amount of leads you’d like. The first step is to identify what these factors are, and hopefully, this list can help you out with doing just that.

    TIP #1: Create Content that Stimulates Action

    According to Straight North, 84% of website conversions occur on the first visit, and only 11% convert in the second.

    Nói cách khác, ấn tượng đầu tiên rất quan trọng.

    Cũng giống như những buổi thử vai tồi tệ sẽ không giúp diễn viên nhận được vai chính, lần đầu tiên ai đó ghé thăm trang web của bạn có thể quyết định sự thành bại của bạn.

    That’s why it’s you and your team’s job to try and convince people to stay glued to your page.

    Straight North suggests that posting copy and content (both text and images) is a great way to catch your visitors’ attention. Remember to always allot sufficient time to research on what makes good copy and good content, and never underestimate either.

    Dưới đây là một vài trang web có thể giúp bạn trên hành trình tạo ra các khách hàng tiềm năng thành công:

    How PBS Can Help:

    Wow your site visitors by using interactive PBS elements like the Carousel, or use Parallax Scrolling, and Video Backgrounds to catch their attention. Remember to execute their placement in a balanced way though, as to not overwhelm your audience.

    TIP #2: Intuitive Navigation

    In the realm of web development and site-building, intuitiveness in the user interface (or UI) is key.

    This means that when your visitors or users find their way around your site by intuition (i.e. easy site-navigation and straightforward instructions), they’re more likely to stay glued on your site.

    Giờ đây, nếu việc điều hướng xung quanh trang web của bạn hóa ra là một trải nghiệm khó chịu, rất có thể khách truy cập sẽ không nán lại đủ lâu để lắng nghe những gì bạn muốn nói và những gì bạn có thể cung cấp cho họ.

    Straight North adds that getting too “clever and creative” with navigation labels is a bad idea, and suggest that you use terms like “Contact Us” for call-to-action buttons, rather than using vague labels like “Interact!” or “Dialog.” Remember that bombarding your site with too much jargon can cause frustration to your audience as well.

    So as long as navigating through your website comes to the user as second nature, then you have one less thing to worry about when trying to convert leads.

    How PBS Can Help:

    Page Builder Sandwich’s UI is highly intuitive, and is akin to using a Word processor (like Google Docs and Microsoft Word). Check out our demo to get some inspiration on how you can apply intuitive changes to your site, too!

    OTHER PAGE BUILDERS …have too much stuff going on.

    PAGE BUILDER SANDWICH …gets straight to the point.

    TIP #3: Use Relevant, Custom Imagery

    Your images and how they’re presented also matter, and they matter a lot.

    While it may seem trivial to some, uploading boring stock images, stretched out/pixelzed photos, or badly-presented typography is a huge factor that dictates whether your visitors stay on your site, or move to a better, more credible-looking alternative.

    How PBS Can Help:

    Because it’s WordPress-run, PBS lets you post high-quality photos in your website. As long as you have the right image dimensions, you shouldn’t have a problem with posting photos.

    Additional lifehack: You can also check out Pexels.com and Unsplash.com to get awesome, high-quality stock photos!

    TIP #4: Persuasive Credibility Elements

    Skepticism is a huge conversion killer.

    That’s why more often than not, it’s always a good idea to add in elements that back up your credibility as a website (or business), like testimonials from credible sources, and logos of reputable companies or groups that you’ve worked with. So use customer testimonials, show logos of well-known customers, and include third-party mentions in your content.

    How PBS Can Help:

    Use PBS features to vouch for you. Display your customers’ testimonials in a Carousel, or use the Featurette element to showcase third-party mentions, or make use of the column element to effectively display logos of your well-known customers (like in the graphic above).

    TIP #5: Get Personal!

    Straight North says that using a lighter, casual tone makes all the difference when writing content (such as articles and bio’s) on your site. This lets your users know that you’re human too, and not just some bot trying to get a run for their money (which we hope you aren’t).

    How PBS Can Help:

    While this part is entirely up to you and your team, it wouldn’t hurt to use elements such as the Featurette, Gallery, and Image Box to liven up your bio’s as well. Adding in other PBS elements like Social Media Icons can help put a personal touch to your pages, too.

    PBS’ Industry Template makes full use of the Image Box Elements for its About Us and Feature Sections.

    TIP #6: Irresistible Calls-to-Action

    Calls-to-Action (CTA) are a crucial part of generating leads.

    You will FAIL to capture first-visit conversions unless you ASK. – Straight North

    Just asking isn’t enough, though. According to Straight North, your calls-to-action should be executed both “skillfully and persuasively”.

    The trick is to have effective Calls-to-Actions plus a good combination of smart consistent placement, offers that give off substance, time-sensitive offers (giving them offers for a set, limited time will give them a sense of urgency), and most importantly, guaranteed offers.

    You want your site to trust you. “Take away all arguments for delay, and conversions will increase”, Straight North says.

    How PBS Can Help:

    PBS’ Call-to-Action Button – as well as other elements such as the Countdown and Page Heading element – can help ease your burden regarding this task.

    Executing them correctly is up to you and your team though, so make sure to give time to research about CTA placements and other marketing tips.

    Dưới đây là một số tài nguyên có thể giúp nâng tầm khả năng tạo CTA của bạn:

    TIP #7: User-Friendly Forms

    Việc một người gửi thông tin của họ cho bạn thông qua biểu mẫu trên trang web rốt cuộc chính là thước đo cho sự chuyển đổi khách hàng tiềm năng thành công.

    This is why placing user-friendly contact forms on your site is of the utmost importance. They’re the ultimate “make-or-break stage of a great conversion opportunity”, says Straight North.

    A couple of PBS’ third-party plugins available for shortcode mapping

    So don’t intimidate your site visitors by overwhelming them with too many question forms, or have them exhaust too much energy, like having them type long sentences instead of choosing their answers from a drop-down list.

    Letting them know that you value their privacy is also a must. Be sure to place clean, good-looking forms on your site so as to boost credibility.

    How PBS Can Help:

    With PBS’ Shortcode Mapper feature, you can place awesome, reputable contact forms like Advanced Custom Fields (ACF) and Contact Form 7 on your site.

    TIP #8: Prominently Displayed Phone Numbers (or Contact Details)

    Contact number and social media buttons displayed prominently in PBS’ Restaurant Template

    Hiển thị số điện thoại một cách nhất quán, nổi bật là điều bắt buộc nếu bạn là loại hình doanh nghiệp cung cấp dịch vụ hỗ trợ qua các cuộc gọi điện thoại. Straight North nói thêm rằng việc đầu tư vào các số điện thoại miễn phí cũng có thể giúp bạn tăng đáng kể tỷ lệ chuyển đổi.

    Nếu bạn là một công ty công nghệ như chúng tôi, thì việc hiển thị địa chỉ email của bạn (hoặc các cách khác mà khách truy cập có thể liên hệ với bạn) trên trang web cũng là một ý kiến hay.

    How PBS Can Help:

    PBS’ Full Page Niche-Based Templates have fields that let you feature phone numbers and other contact information more prominently, so that your visitors can reach you right away.

    TIP #9: Continuous Testing

    Straight North attests to the importance of site maintenance and testing: “No matter how good your website is in converting leads, it can always be better.”

    Điều này đúng với bất kỳ trang web nào, chứ không chỉ riêng trang web đang nỗ lực chuyển đổi khách hàng tiềm năng. Đảm bảo trang web của bạn luôn ở trạng thái hoàn hảo nhất và khách hàng của bạn luôn hài lòng sẽ giúp doanh nghiệp của bạn tiến xa.

    How PBS Can Help:

    This one is up to you, but if you’d like a tip: the PBS Team continuously tests the site and page builder for any bugs, and always work to make sure you guys are satisfied. We don’t exactly have a feature for making sure you do regular tests on your site, so this one’s entirely up to you and your team. Do it, and do it well!

    TIP #10: Mobile-Friendly Design

    Almost everyone has a cellphone or tablet; but while only 23 percent of lead conversion rates come from mobile devices, it absolutely will not do to ignore any sort of potential conversions, no matter the percentage (leads are still leads, after all).

    “Users converting from desktop view may have seen the site initially on a mobile device,” Straight North says. “Mobile conversions are (also) likely to grow as mobile Internet access continues to soar at the expense of desktops.”

    You can preview your site on mobile view directly on desktop

    How PBS Can Help:

    Page Builder Sandwich is Mobile Responsive. You can view PBS-built sites on mobile, as well as check previews of your mobile site directly through desktop while editing. This way, you won’t have to keep switching to your phone in order to check if your site looks good on mobile.

    Everything Matters in Site-Building

    At the root of it all, it’s very, very important to understand that everything on your website – down to the smallest of details – has an impact on your audience.

    The quality of your copy, images, your layout – all of it matters, and it matters a lot.

    Và một trong những sai lầm lớn nhất mà mọi người mắc phải khi cố gắng tạo khách hàng tiềm năng chính là điều này: Xem nhẹ các khía cạnh nhỏ tạo nên trang web (như thiết kế, văn bản và các nội dung khác).

    Hopefully your website garners the success it very well deserves; it’s been built with PBS, after all. ?

    Chúc bạn gặp nhiều may mắn trong mọi nỗ lực của mình, và như mọi khi, cảm ơn bạn đã sử dụng Page Builder Sandwich!

    Chúc bạn xây dựng trang web vui vẻ!

  • Cách tự tùy chỉnh các phần được thiết kế sẵn của Page Builder Sandwich

    We’ve been getting quite a few inquiries the past week about Pre-Design Sections (and by extension, the PBS Templates), what they are, and how they can be accessed.

    So in this article, we’ll be teaching you how to not only access them, but also how to maximize these features of Page Builder Sandwich: By customizing them and making them your own.

    Accessing the Pre-Designed Sections

    If you aren’t familiar yet, all you have to do to access the Pre-Designed sections is to hover your mouse onto the left side of your screen, and access the Elements Inspector. This is the sidebar that lets you drag and drop elements directly onto your content area.

    Say hello to the Elements Inspector!

    Once it’s accessed, simply scroll down to the bottom and select Pre-Designed Sections. A library of the sections will pop up. Select one from the collection, drag and drop, and it’ll show up on your content area, like so:

    From here, you can move the elements within the section around, or move the entire thing and adjust its position. And there you have it! You’ve selected a Pre-Designed Section from Page Builder Sandwich.

    Now it’s time to add in your own twist: By customizing and tweaking with the elements’ settings within the selected section.

    Customizing the Pre-Designed Sections

    Each element’s setting within any one Pre-Designed section can be edited and customized according to your website’s needs and your personal taste.

    This means everything included in your selected Pre-Designed section – like text, colors, images, buttons, everything – can be edited and tinkered with by you.

    Vì vậy chẳng hạn, nếu bạn không hài lòng với tông màu xanh lam-xanh lục mặc định và hình ảnh cánh đồng lúa mì trong phần Thiết Kế Sẵn mặc định bên dưới…

    You can adjust it. For instance, if I wanted a different background tint on the left:

    Or if you wanted to replace the image of the wheat field on the right:

    Or even change the button style, margin, padding, and font:

    …You can.

    Để so sánh:

    Default PBS Pre-Designed Section

    The same Pre-Designed Section, completely tweaked and customized. Notice the different font, color scheme, button style, photo, and margin width. You can actually take this further, and let your imagination run wild.

    Here are a few more examples on how you can spice up our Pre-Designed Sections

    Default Pre-Designed Section from Sandwich

    The same Pre-Designed Section, customized

    You can do it with our Full-Page Templates, too:

    Default Template from Sandwich

    The same Template, customized

    Conclusion

    Các Phần Thiết Kế Sẵn của Page Builder Sandwich có nhiều điều thú vị hơn bạn nghĩ.

    Tweak and customize them to make them completely your own, or even use them as a starting point for when you don’t want to design your page from the ground up.

    Hãy nhớ rằng, Page Builder Sandwich ở đây để giúp bạn thiết kế trong thời gian ngắn hơn. Việc tận dụng tối đa các Phần Thiết Kế Sẵn và Mẫu Toàn Trang của chúng tôi sẽ giúp bạn làm được điều đó.

    Design in less time!

    Get access to Sandwich’s Pre-Designed Sections, Templates, and a whole lot more.

    Try Live Preview
  • Chúc mừng ngày 4 tháng 7! GIẢM 20% cho TẤT CẢ giấy phép đến ngày 6 tháng 7!

    Nhận GIẢM GIÁ 20% cho tất cả các giấy phép Page Builder Sandwich từ ngày 4 tháng 7 đến ngày 6 tháng 7 năm 2017! Chỉ cần nhập mã khuyến mãi 4JULY2017 để nhận ưu đãi giảm giá của bạn ngay hôm nay!