Administrators admin Posted April 9, 2015 Administrators Report Share Posted April 9, 2015 Bài viết này sẽ hướng dẫn các bạn từng bước để tạo một plugin Global Message để hiển thị một nội dung trên cùng mỗi trang. Qua ví dụ này bạn có thể thành thạo tự tạo cho mình nhiều plugin cơ bản khác. Trước khi tạo một plugin yêu cầu bạn phải bật Dev Mode trước. Tham khảo cách bật Dev Mode: Sau khi đã chuẩn bị Dev Mode, bạn có thể bắt đầu tạo plugin. Bước 1: Tạo plugin mới Vào ACP -> System -> Plugins -> bấm nút Creat New, một popup hiện ra, bạn nhập tên thông tin của plugin: Lưu ý Plugin Directory bạn chỉ được phép dùng ký tự chữ số, không ký tự lạ và khoản trắng. Sau đó bấm Save, bạn sẽ thấy Global Message hiện ở danh sách các plugin. Tiếp theo bấm mũi tên thả xuống và chọn Developer center Giao diện Dev mode của plugin như thế này Bước 2: Tạo Theme Hook Cách đơn giản nhất để thêm nội dung ở đầu trang là sử dụng Theme Hook. Theme hook cho phép bạn chỉnh sửa nội dung của một template bit, hoặc thêm vào bất kỳ nội dung nào. Ở ví dụ này, chúng ta cần edit template globalTemplate ở location "front" của app "core". Bấm Creat Hook, một popup hiện lên, chọn Theme Hook chỗ Hook Type và "core --> front: global" ở chỗ Template Group, Filename đặt globalmessage.php Bấm Save bạn sẽ thấy một hook mới được tạo ra, bấm hình cây viết chì để Edit Bây giờ chọn globalTemplate ở cột bên trái. Ở CSS Selector tạm hiểu là một dấu móc dựa theo class hoặc ID của CSS. Ở đây để thêm nội dung bên trên, vị trí tốt nhất là cho nó nằm bên trên phần <div id="ipsLayout_mainArea"> Bạn bấm nút Select Element và chọn ngay code bên trên là được. Còn ở Action, chọn Insert content inside the chosen element(s), at the start. Như vậy nội dung của bạn sẽ được nằm trên code div đó. Tiếp tục, ở Content cho nội dung ví dụ như sau vào <div class="ipsMessage ipsMessage_information">Ví dụ plugin Global Message tại ipsviet.com</div> Bấm Save. Ra lại trang chủ bạn sẽ thấy kết quả: Phần sau đây sẽ là những bước nâng cao cho plugin hoàn chỉnh hơn. Bước 3: Sử dụng template riêng: Như bên trên là bạn sử dụng trực tiếp html code vào trong file hook, như vậy sẽ bất tiện nếu như người dùng cuối cần chỉnh sửa code. Để khắc phục vấn đề đó, bạn nên sử dụng template bit cho plugin của bạn. Rất dơn giản, chỉ cần vào thư mục cài đặt IPS, tiếp tục vào /plugins/globalmessage/dev/html/ tạo một file mới tên globalMessage.phtml với nội dung <ips:template parameters="" /> <div class="ipsMessage ipsMessage_information"> Ví dụ plugin Global Message tại ipsviet.com </div> Dòng trên cùng để khai báo parameters, ở ví dụ này chưa cần thiết và bạn ko được chỉnh sửa thay đổi hay xóa nó đi. Như vậy bạn đã có một template bit tên là globalMessage cho plugin của bạn. Bây giờ chỉ cần làm sao cho file hook hiểu nội dung sẽ dẫn tới template mới tạo. Bạn edit lại hook bên trên, chỗ content thay thế toàn bộ bằng {template="globalMessage" group="plugins" location="global" app="core"} Đó là template tag lấy nội dung từ một template bit. Mặc định các template của plugin sẽ được đặt ở app core, location global, group plugins cho nên bạn chỉ cần nhớ cấu trúc nó như vậy, chỉ cần thay đổi cái tên của template. Bước 4: Sử dụng Settings và Language Strings Mình sẽ ví dụ làm sao để cho nội dung linh hoạt hơn bằng cách tạo một setting để hiệu chỉnh nó bất kỳ lúc nào. Ở giao diện thiết kế plugin, chọn tab Settings. Chỗ Setting key nhập vào globalMessage_content và bấm Save. Truy cập vào thư mục /plugins/globalmessage/ bạn sẽ thấy một file tên là settings.rename.php và đổi tên nó thành settings.php Mở file đó lên sẽ thấy một nội dung mẫu. Cái chúng ta cần bây giờ là tạo một textarea để nhập nội dung tùy chỉnh, sử dụng code sau thay thế cho dòng code đầu ( $form->add(.... ) ) $form->add( new \IPS\Helpers\Form\TextArea( 'globalMessage_content', \IPS\Settings::i()->globalMessage_content ) ); Code đó sử dụng Form Helper mà mình sẽ nói thêm ở các bài sau. Bây giờ bạn vào lại trang Plugins, ở Global Message bạn sẽ thấy xuất hiện hình cây viết chì: Bấm vô đó bạn sẽ thấy được setting bạn vừa tạo: Tuy nhiên cái tên plugin nó là globalMessage_content ko được đẹp lắm, đó là vì bị thiếu language string, để tạo language string, mở file \plugins\globalmessage\dev\lang.php . Mỗi language string nằm trong một phần của array lớn: $lang = array( 'globalMessage_content' => "Message", ); Bây giờ tên của setting đó đã được hiển thị là Message. Tiếp tục, để áp dụng setting vừa tạo, cần edit lại template cũ, dùng nội dung mới như sau: <ips:template parameters="" /> <div class="ipsMessage ipsMessage_information"> {{if settings.globalMessage_content}} {setting="globalMessage_content"} {{else}} Ví dụ plugin Global Message tại ipsviet.com {{endif}} </div> Nghĩa như nếu cài đặt globalMessage_content có thì sử dụng chính nó, ngược lại dùng nội dung mặc định. Tham khảo thêm Plugin như thế đã hoàn chỉnh phần cơ bản, bạn có thể chế biến thêm cho phù hợp với nhu cầu sử dụng. Bây giờ thì bấm Download để xuất ra file .xml và chia sẽ. Ngoài ra, bạn cần nắm rõ thêm 2 điều sau: CSS cho plugin: Cực kỳ đơn giản, bạn không phải viết thêm code để đưa css vô, chỉ cần tạo file .css đặt nó vào \plugins\globalmessage\dev\css\ thì IPS sẽ tự động load nó cho bạn. JS cho Plugin: Việc cần làm cũng chỉ là chép file .js vào \plugins\globalmessage\dev\js là IPS sẽ tự động load nó. Images cho plugin: Chép tất cả hình ảnh vào \plugins\globalmessage\dev\resources\ và không được tạo sub folder. Để hiển thị hình ảnh thì dùng code sau, chỉ được thay đổi tên hình ảnh <img src='{resource="plugins/example.jpg" app="core" location="global"}' /> Như vậy qua ví dụ này các bạn đã nắm rõ cách làm một plugin, sử dụng theme hook, settings, lang string, template bit... Bạn có thể sáng tạo ra nhiều plugin hay khác chỉ cần bạn biết cơ bản về PHP và HTML. IPSViet.com rất mong sẽ nhận được nhiều plugin hay chia sẽ từ các bạn. 2 Quote Link to comment Share on other sites More sharing options...
mbluewhite Posted April 9, 2015 Report Share Posted April 9, 2015 Chưa hiểu lắm chỗ cái tạo TextArea, IPB 3 tạo trực tiếp trong ACP thấy tiện hơn nhỉ Quote Link to comment Share on other sites More sharing options...
mbluewhite Posted June 22, 2015 Report Share Posted June 22, 2015 @Bim hướng dẫn mình tạo form chọn nhóm thành viên và category của app Download với. Quote Link to comment Share on other sites More sharing options...
Administrators admin Posted June 23, 2015 Author Administrators Report Share Posted June 23, 2015 Category của Downloads: Hidden Content Give reaction or reply to this topic to see the hidden content. Chọn group thành viên Hidden Content Give reaction or reply to this topic to see the hidden content. Thay key của settings lại thôi. 4 Quote Link to comment Share on other sites More sharing options...
mbluewhite Posted June 26, 2015 Report Share Posted June 26, 2015 Yeah, chính là cái mình cần. Quote Link to comment Share on other sites More sharing options...
ncxn Posted June 26, 2015 Report Share Posted June 26, 2015 (edited) Thằng IPS 4 đang theo hướng OOP , tương lai có nhiều thứ để làm. he he Nhưng theo cá nhân mình thì các API và var vẫn còn rườm rà Edited June 26, 2015 by ncxn Quote Link to comment Share on other sites More sharing options...
Chia Sẻ Vui Posted January 20, 2017 Report Share Posted January 20, 2017 Cho e hỏi e cài plugin Recent Topics trong 4.1.17. Em muốn bật tắt seting plugin đó thì vào đâu ạ. em tìm không thấy Quote Link to comment Share on other sites More sharing options...
Administrators admin Posted January 20, 2017 Author Administrators Report Share Posted January 20, 2017 8 hours ago, Chia Sẻ Vui said: Cho e hỏi e cài plugin Recent Topics trong 4.1.17. Em muốn bật tắt seting plugin đó thì vào đâu ạ. em tìm không thấy Mọi settings của 1 plugin đều nằm trong ACP > plugins, bên phải có hình cây viết bấm vô là dc. Còn ko có hình cây viết có nghĩa là plugin đó ko có settings. 1 Quote Link to comment Share on other sites More sharing options...
backstrix Posted April 6, 2020 Report Share Posted April 6, 2020 (edited) bim ơi, rảnh viết tiếp cái này nha giờ mình muốn nó xử lý code php, ví dụ: Hidden Content Give reaction or reply to this topic to see the hidden content. sau khi xử lý xong thì mình đưa nó vào template để hiển thị thì phải làm sao ? Edited April 7, 2020 by backstrix Quote Link to comment Share on other sites More sharing options...
Administrators admin Posted April 9, 2020 Author Administrators Report Share Posted April 9, 2020 Viết luôn vô template đi Hidden Content Give reaction or reply to this topic to see the hidden content. 3 Quote Link to comment Share on other sites More sharing options...
backstrix Posted April 9, 2020 Report Share Posted April 9, 2020 39 minutes ago, Bim said: Viết luôn vô template đi Hidden Content Give reaction or reply to this topic to see the hidden content. nếu muốn tách ra 1 file php, thì tạo code hook phải không bim ? nếu vậy chỗ class to extend mình phải nhập gì Quote Link to comment Share on other sites More sharing options...
Administrators admin Posted April 9, 2020 Author Administrators Report Share Posted April 9, 2020 Hook vô đâu thì tìm class file đó. Bạn qua kia tìm dev xem cho chi tiết. 1 Quote Link to comment Share on other sites More sharing options...
backstrix Posted April 9, 2020 Report Share Posted April 9, 2020 oke mình cảm ơn Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.