Bạn đang làm việc trên Blog vì đam mê, sở thích, vì đặc thù công việc hoặc cũng có thể bởi một lí do nào đó? Bạn gặp khó khăn trong quá trình tối ưu Blog của mình? Hãy theo dõi những bài viết trên thuthuatcongnghe của chúng tôi, chúng tôi sẽ hướng dẫn cũng như chia sẻ tới bạn đọc tổng hợp tất cả mọi kiến thức liên quan tới Blog từ cơ bản tới nâng cao. Trong bài viết này chúng tôi sẽ giới thiệu tới bạn đọc một plugin tiện ích đang được rất nhiều Blogger ứng dụng đó chính là Blogger Shortcode Plugin - một công cụ hỗ trợ ưu việt đối với những bạn không am hiểu nhiều về HTML.
1/ Blogger Shortcode Plugin là gì?
Shortcode Plugin là một macrocode, tức là một dòng mã có chứa một tập hợp các hướng dẫn mà cho phép bạn dễ dàng khi ghi một đoạn code. Shortcodes có thể giúp bạn nhúng các tập tin hoặc tạo ra các đối tượng trong Blogspot với một dòng mã mà thông thường sẽ đòi hỏi rất nhiều đoạn mã phức tạp và dài dòng.
Với Shortcode plugin bạn có thể dễ dàng chèn các đối tượng như Video, Audio, tập tin, trình chiếu và tất cả các yếu tố web quan trọng như accordions, tab, nút đầy màu sắc, Sidebar, Footer, bài viết và bình luận. Plugin này không đòi hỏi nhiều kiến thức về HTML, CSS hay JavaScript, plugin này rất nhẹ và tối ưu được những đoạn code giúp trang bạn tải nhanh hơn.
2/ Danh sách Shortcode hỗ trợ
Sự phát triển cho đến nay khoảng 10 shortcodes và hy vọng trong thời gian tới có khoảng 50 shortcodes nữa cho những phiên bản cập nhật. Shortcodes sẽ được tạo ra dựa trên tầm quan trọng và khả năng sử dụng của họ. Mỗi shortcode với một hướng dẫn riêng.
Một shortcode bản thân nó không phải là một mã nhưng một TEXT được chế biến dưới dạng HTML.
Mô tả các Shortcode
[accordion]: Accordion là danh sách xếp chồng lên nhau theo chiều dọc của các mặt hàng trong đó mỗi hàng có thể được "mở rộng" hoặc "kéo dài" tiết lộ những nội dung liên quan đến hạng mục đó. Mục có thể được bật và tắt một cách dễ dàng. Một ví dụ là các widget accordion.
[tab]: Widget Tab cho phép nhiều tài liệu hoặc các tấm được chứa trong một cửa sổ duy nhất, sử dụng các tab như một widget điều hướng để chuyển đổi giữa các bộ tài liệu. Một ví dụ là nhiều Tab Widget
[code]: Nhúng Highlighter cú pháp mà bảo tồn các định dạng ban đầu của mã nguồn
[quote]: Chèn một Fancy Blockquote
[button]: Chèn Buttons CSS3 đầy màu sắc
[icon]: Chèn biểu tượng FontAwesome bất cứ nơi nào với các tùy chọn tùy chỉnh hỗ trợ
[soundcloud]: Nhúng theo dõi SoundCloud
[dailymotion]: Chèn Dailymotion Video
[youtube]: Chèn YouTube Video
[divider]: Chèn một Separator ngang để phân chia một phần, cũng có chứa một nút Back To Top
[num]: Chèn một con số kèm theo bên trong một nền tròn
[warning]: Chèn một hộp với thông điệp cảnh báo
[success]: Chèn một hộp với tin nhắn thành công
[alert]: Chèn một hộp với thông điệp cảnh báo
[info]: Chèn một hộp với một số thông tin
[update]: Chèn một hộp với Cập nhật thông báo trạng thái
[facebook]: Nhúng Facebook Page Plugin
[image]: Nhúng hình ảnh bất cứ nơi nào bạn muốn trong độ phân giải cắt rõ ràng!!
[tooltip]: Chèn một Fancy CSS3 Tooltip trên hoặc dưới siêu liên kết để hiển thị thông tin thêm
>>> Xem thêm:
Thực hiện theo các bước sau để cài đặt các Plugin shortcode trên blog blogger của bạn.
- Về bảng điều khiển Blogger -> (Mẫu) Template -> Chỉnh sửa HTML (Edit HTML)
- Tìm kiếm đến </ body>
- Dán các tập tin JS tự động cập nhật sau ngay phía trên nó
<!-- Blogger Shortcode Plugin. HD IT Viet 360 -->
<script src='http://downloads.mybloggertricks.com/shortcodes.js' type='text/javascript'></script>
- Tiếp theo tìm đến <head>
- Dán code CSS dưới đây ngay dưới nó
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<link href='http://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css' rel='stylesheet'/>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
Lưu ý rằng trong đoạn mã trên tôi đã bao gồm các phiên bản mới nhất của jQuery và thư viện FontAwesome. Tôi đề nghị bạn sử dụng những phiên bản thay vì bất kỳ phiên bản cũ bạn có thể đã được sử dụng.
- Lưu mẫu của bạn và bạn đang làm tất cả
Chức năng mới được tự động chèn vào bên trong tập tin shortcode JS và bạn cần phải cài đặt nó chỉ một lần. Tôi sẽ tiếp tục cập nhật trang này để giới thiệu bất kỳ bản cập nhật được thực hiện cho các kịch bản và shortcodes mới được tạo ra sẽ được nối thêm vào Danh sách Bảng trên trang này.
4/ Cú pháp của Shortcode
Shortcodes có một tên và các thuộc tính. Các thuộc tính này là tùy chọn giúp bạn cấu hình một đối tượng. Shortcodes được tượng trưng bởi các dấu ngoặc vuông. Các dấu ngoặc đóng và mở giống như HTML, nhưng với một định dạng đơn giản hơn nhiều như hình dưới đây:
Giả sử bạn cần nhúng một đoạn video Dailymotion bên trong bài đăng trên blog của bạn, sidebar hoặc blog ý kiến sau đó bạn có thể làm điều đó trong hai cách.
[youtube src="xqYTfr0ZEHg"][/youtube]
Hoặc đơn giản hơn là
[youtube src="xqYTfr0ZEHg" /]
Bây giờ nếu bạn muốn thay đổi màu sắc của các nút chơi, ẩn thông tin máy nghe nhạc và chỉnh sửa kích thước máy nghe nhạc sau đó bạn có thể chèn các thuộc tính như hình dưới đây
[youtube src="xqYTfr0ZEHg" width="100%" background="0080ff" height="100" info="0"][/youtube]
hoặc đơn giản hơn
[youtube src="xqYTfr0ZEHg" width="100%" background="0080ff" height="100" info="0" /]
Hi vọng những chia sẻ trên của chúng tôi thực sự là thông tin hữu ích đối với bạn giúp hoàn thiện Blog cũng như hỗ trợ việc sử dụng Blog của bạn một cách hiệu quả hơn. Chúc các bạn luôn vui vẻ và thành công!
>>> Gợi ý Google:
wordpress blog shortcode plugin
wp shortcode plugin
best shortcode plugin
widget shortcode plugin
create shortcode plugin
Nguồn Tổng Hợp
0 nhận xét :
Đăng nhận xét