其實這個功能有點類似Discuz分類信息格式,當然在WordPress程序上新增的分類信息沒有那麼的強大了。
利用WP Tinymce 編輯器的API我們仍可以簡單地做出這樣的效果,在編輯器新增"分類信息"按鈕,只要按一下,
預設的文字信息就跳出來了,這樣省略了重複打字和排序的時間。
分類信息自定 Shortcode 按鈕製作:
說明:修改成效!只適合「Classic Editor (傳統編輯器)」外掛(插件) 下載連結
在使用的風格主題目錄找到一份文件名為: function.php
打開文件,並複製以下的程式碼,並貼上代碼在這份文件內,儲存並使用FTP上傳。
短代碼下拉式版本
//編輯器添加下拉式按鈕
function QGG_select(){
echo '
<select id="short_code_select">
<option value="請選擇一個短代碼!">短代碼</option>
<option value="<span style="color: #008000;">請看圖片▼</span>">圖片預覽</option>
<option value="[pwd_protected_post key=\'保護密碼\']短密碼[/pwd_protected_post]">密碼保護</option>
<option value="[collapse][/collapse]">展開/收縮</option>
</select>';
}
if (current_user_can('edit_posts') && current_user_can('edit_pages')) {
add_action('media_buttons', 'QGG_select', 11);
}
function QGG_button() {
echo '<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#short_code_select").change(function(){
send_to_editor(jQuery("#short_code_select :selected").val());
return false;
});
});
</script>';
}
add_action('admin_head', 'QGG_button');
注意: 引號的轉義( ‘ → \’ )以及( " 符號轉換為 " )
預覽Demo▼
簡碼按鈕版本
樣式一: 直式
function appthemes_add_quicktags() {
?>
<script type="text/javascript">
QTags.addButton( 'cfi', '分類信息', '<strong>軟體名稱︰</strong>\n<strong>軟體語言︰</strong>\n<strong>軟體性質︰</strong>\n<strong>官方網站︰</strong>\n<strong>軟體簡介︰</strong>\n<strong>軟體預覽︰</strong>\n<strong>軟體下載︰</strong>', '' ); //分類信息自定義
</script>
<?php
}
add_action('admin_print_footer_scripts', 'appthemes_add_quicktags' );
預覽Demo▼
樣式二: 橫式
function appthemes_add_quicktags() {
?>
<script type="text/javascript">
QTags.addButton( 'cfi', '分類信息', '<span id="cfi"><strong>軟體名稱︰</strong> <strong>軟體語言︰</strong> <strong>軟體性質︰</strong>\n<strong>官方網站︰</strong> <strong>軟體簡介︰</strong> <strong>軟體預覽︰</strong>\n<strong>軟體下載︰</strong></span>', '' ); //分類信息自定義
</script>
<?php
}
add_action('admin_print_footer_scripts', 'appthemes_add_quicktags' );
在CSS文件加入以下的程式碼:
#cfi {
word-spacing: 50px;
letter-spacing: 0px;
}
註︰文字與文字之間必須有空格唷!!除非換行...
預覽Demo▼
如何使用?
在WP發佈文章時,編輯器切換為"文字"模式,在按鈕列表,你會發現新增了"分類信息"按鈕,只要點擊一下就知了。 如下圖所示▼
程式碼說明:
QTags.addButton( ”, ”, ”, ” );
【四對引號,分別表示按鈕的ID、按鈕顯示名、點一下輸入內容、再點一下關閉內容(最後一對引號為空則一次輸入全部內容),\n表示換行】
形象說明: QTags.addButton( ‘ 按鈕ID‘, ‘按鈕顯示名稱‘, ‘點一下輸入內容‘, ‘點一下關閉內容‘ );
可以自定義添加多行 QTags.addButton( ”, ”, ”, ” ); 增加多個按鈕!
查看更多參數!請上官方網站教程: 請按此!!