Làm cách nào để thêm nút mới trong trình chỉnh sửa WMD, như nút code? Nếu tôi nhấp vào nút <info></info>, thẻ sẽ thêm vào văn bản đã chọn như nút mã.Thêm nút tùy chỉnh vào trình chỉnh sửa WMD (Stack Overflow)
Có phiên bản mới hơn của kho được gọi là wmd-new. Như được mô tả trên blog StackOverflow phiên bản này uses CSS sprites để có hiệu suất tốt hơn. Vì vậy, các thanh công cụ là một hình ảnh duy nhất:
Có một PSD (Photoshop) nộp đơn xin thanh công cụ trong kho mà bạn có thể chỉnh sửa. Về cơ bản, bạn cần thêm một nút mới vào tệp wmd.css và tệp wmd.js. Nhìn xung quanh dòng 93 trong CSS và bạn sẽ thấy:
/* sprite button slicing style information */
#wmd-button-bar #wmd-bold-button {left: 0px; background-position: 0px 0;}
#wmd-button-bar #wmd-italic-button {left: 25px; background-position: -20px 0;}
#wmd-button-bar #wmd-spacer1 {left: 50px;}
#wmd-button-bar #wmd-link-button {left: 75px; background-position: -40px 0;}
#wmd-button-bar #wmd-quote-button {left: 100px; background-position: -60px 0;}
#wmd-button-bar #wmd-code-button {left: 125px; background-position: -80px 0;}
#wmd-button-bar #wmd-image-button {left: 150px; background-position: -100px 0;}
#wmd-button-bar #wmd-spacer2 {left: 175px;}
#wmd-button-bar #wmd-olist-button {left: 200px; background-position: -120px 0;}
#wmd-button-bar #wmd-ulist-button {left: 225px; background-position: -140px 0;}
#wmd-button-bar #wmd-heading-button {left: 250px; background-position: -160px 0;}
#wmd-button-bar #wmd-hr-button {left: 275px; background-position: -180px 0;}
#wmd-button-bar #wmd-spacer3 {left: 300px;}
#wmd-button-bar #wmd-undo-button {left: 325px; background-position: -200px 0;}
#wmd-button-bar #wmd-redo-button {left: 350px; background-position: -220px 0;}
#wmd-button-bar #wmd-help-button {right: 0px; background-position: -240px 0;}
Lưu ý cách phong cách ban đầu của wmd-button-bar và cách left đang được sử dụng ở trên.