報名課程

WordPress代碼教學

用代碼去除WordPress 分類連結中的category標誌

我們看圖片馬上就知道意思囉！
用代碼去除WordPress 分類連結中的category標誌
也就是將外觀>>選單>>分類的連結中
本來是這樣的形式
http://dhamma.com.tw/category/行銷教學/wordpress教學
變成這樣的形式
http://dhamma.com.tw/行銷教學/wordpress教學

 

開啟主題的functions.php貼入以下代碼

   [cc lang="php"] //用代碼去除WordPress 分類連結中的category標誌 add_action( 'load-themes.php', 'no_category_base_refresh_rules'); add_action('created_category', 'no_category_base_refresh_rules'); add_action('edited_category', 'no_category_base_refresh_rules'); add_action('delete_category', 'no_category_base_refresh_rules'); function no_category_base_refresh_rules() { global $wp_rewrite; $wp_rewrite -> flush_rules(); } // register_deactivation_hook(__FILE__, 'no_category_base_deactivate'); // function no_category_base_deactivate() { // remove_filter('category_rewrite_rules', 'no_category_base_rewrite_rules'); // // We don't want to insert our custom rules again // no_category_base_refresh_rules(); // } // Remove category base add_action('init', 'no_category_base_permastruct'); function no_category_base_permastruct() { global $wp_rewrite, $wp_version; if (version_compare($wp_version, '3.4', '<')) { // For pre-3.4 support $wp_rewrite -> extra_permastructs['category'][0] = '%category%'; } else { $wp_rewrite -> extra_permastructs['category']['struct'] = '%category%'; } } // Add our custom category rewrite rules add_filter('category_rewrite_rules', 'no_category_base_rewrite_rules'); function no_category_base_rewrite_rules($category_rewrite) { //var_dump($category_rewrite); // For Debugging $category_rewrite = array(); $categories = get_categories(array('hide_empty' => false)); foreach ($categories as $category) { $category_nicename = $category -> slug; if ($category -> parent == $category -> cat_ID)// recursive recursion $category -> parent = 0; elseif ($category -> parent != 0) $category_nicename = get_category_parents($category -> parent, false, '/', true) . $category_nicename; $category_rewrite['(' . $category_nicename . ')/(?:feed/)?(feed|rdf|rss|rss2|atom)/?$'] = 'index.php?category_name=$matches[1]&feed=$matches[2]'; $category_rewrite['(' . $category_nicename . ')/page/?([0-9]{1,})/?$'] = 'index.php?category_name=$matches[1]&paged=$matches[2]'; $category_rewrite['(' . $category_nicename . ')/?$'] = 'index.php?category_name=$matches[1]'; } // Redirect support from Old Category Base global $wp_rewrite; $old_category_base = get_option('category_base') ? get_option('category_base') : 'category'; $old_category_base = trim($old_category_base, '/'); $category_rewrite[$old_category_base . '/(.*)$'] = 'index.php?category_redirect=$matches[1]'; //var_dump($category_rewrite); // For Debugging return $category_rewrite; } // Add 'category_redirect' query variable add_filter('query_vars', 'no_category_base_query_vars'); function no_category_base_query_vars($public_query_vars) { $public_query_vars[] = 'category_redirect'; return $public_query_vars; } // Redirect if 'category_redirect' is set add_filter('request', 'no_category_base_request'); function no_category_base_request($query_vars) { //print_r($query_vars); // For Debugging if (isset($query_vars['category_redirect'])) { $catlink = trailingslashit(get_option('home')) . user_trailingslashit($query_vars['category_redirect'], 'category'); status_header(301); header("Location: $catlink"); exit(); } return $query_vars; } [/cc]

用代碼把WordPress上方工具欄移到下方

把WordPress上方工具欄移到下方
效果就是這樣

用代碼把WordPress上方工具欄移到下方 打開主題的functions.php複製以下代碼 [cc lang="php"] //用代碼把WordPress上方工具欄移到下方 function fb_move_admin_bar() { echo '

'; } // 你想讓工具列，顯示在後台頂部，請刪除這段代碼 add_action( 'admin_head', 'fb_move_admin_bar' ); //你想讓工具列，顯示在前台頂部，請刪除這段代碼 add_action( 'wp_head', 'fb_move_admin_bar' ); [/cc]

所有文章

不用外掛，讓wordpress圖片燈箱效果

wordpress有燈箱效果，是一件非常棒的事情。
首先，先[button text="下載檔案" icon="icon-unlink" type="btn-custom" url="https://drive.google.com/open?id=0B7-p5jspsellS3ZlMjhkMXUxZHM" bg_color="#1BC4DE" bg_hover_color="#00b3ce" txt_color="#ffffff" txt_hover_color="#cef8ff"]
解開來後，會有
fancybox資料夾
把這個資料夾，丟入wordpress當前主題的目錄裡面
在當前主題的footer.php裡面，在上面加入下面代碼：
  1. "stylesheet" type="text/css" href="/fancybox/jquery.fancybox.css" />
在當前主題的functions.php裡面，在 上面加入下面代碼：
 
  1. //wordpress燈箱效果
  2. add_filter('the_content', 'replace_content');
  3. function replace_content ($content){
  4.     global $post;
  5.     $pattern = "/<a(.*?)href=('|\")([^>]*).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>(.*?)<\/a>/i";
  6.     $replacement = '<a$1href=$2$3.$4$5 class="fancybox"$6>$7';
  7.     $content = preg_replace($pattern, $replacement, $content);
  8.     return $content;
  9. }
現在，你只需要把新增媒體的圖片設定「圖片網址」
就會有以下燈箱效果囉！

WordPress讓分類及標籤的頁面也實現文章置頂功能

wordpress都有文章置頂的功能不過文章置頂卻無法在
分類頁面、標籤頁面，產生文章置頂的功能
如果我想將分類中的「wordpress教學」裡面的一篇文章
成為wordpress教學分類的文章置頂。

說明： 這是我文章分類的「wordpress教學」分類頁面 WordPress讓分類及標籤的頁面也實現置頂文章功能

現在我想將9月2日的「WordPress 角色和權限終極指南（譯文-出處國外）」
變成文章置頂

WordPress讓分類及標籤的頁面也實現置頂文章功能

設定完成後

  WordPress讓分類及標籤的頁面也實現置頂文章功能

也可以讓分類頁面有文章置頂功能囉！

WordPress讓分類及標籤的頁面也實現置頂文章功能

現在打開你主題的functions.php

加入以下代碼

[cc lang="php"] //WordPress讓分類及標籤的頁面也實現置頂文章功能 add_filter('the_posts', 'putStickyOnTop' ); function putStickyOnTop( $posts ) { if(is_home() || !is_main_query() || !is_archive()) return $posts; global $wp_query; // 取得所有置頂文章訊息 $sticky_posts = get_option('sticky_posts'); if ( $wp_query->query_vars['paged'] <= 1 && !empty($sticky_posts) && is_array($sticky_posts) && !get_query_var('ignore_sticky_posts') ) { $stickies1 = get_posts( array( 'post__in' => $sticky_posts ) ); foreach ( $stickies1 as $sticky_post1 ) { // 判斷是否為分類頁 if($wp_query->is_category == 1 && !has_category($wp_query->query_vars['cat'], $sticky_post1->ID)) { // 排除不屬於本分類的置頂文章 $offset1 = array_search($sticky_post1->ID, $sticky_posts); unset( $sticky_posts[$offset1] ); } if($wp_query->is_tag == 1 && !has_tag($wp_query->query_vars['tag'], $sticky_post1->ID)) { // 排除不屬於本標籤的文章 $offset1 = array_search($sticky_post1->ID, $sticky_posts); unset( $sticky_posts[$offset1] ); } if($wp_query->is_year == 1 && date_i18n('Y', strtotime($sticky_post1->post_date))!=$wp_query->query['m']) { // 排除不屬於本年份的文章 $offset1 = array_search($sticky_post1->ID, $sticky_posts); unset( $sticky_posts[$offset1] ); } if($wp_query->is_month == 1 && date_i18n('Ym', strtotime($sticky_post1->post_date))!=$wp_query->query['m']) { // 排除不屬於本月份的文章 $offset1 = array_search($sticky_post1->ID, $sticky_posts); unset( $sticky_posts[$offset1] ); } if($wp_query->is_day == 1 && date_i18n('Ymd', strtotime($sticky_post1->post_date))!=$wp_query->query['m']) { // 排除不屬於本日期的文章 $offset1 = array_search($sticky_post1->ID, $sticky_posts); unset( $sticky_posts[$offset1] ); } if($wp_query->is_author == 1 && $sticky_post1->post_author != $wp_query->query_vars['author']) { // 排除不屬於本作者的文章 $offset1 = array_search($sticky_post1->ID, $sticky_posts); unset( $sticky_posts[$offset1] ); } } $num_posts = count($posts); $sticky_offset = 0; // Loop over posts and relocate stickies to the front. for ( $i = 0; $i < $num_posts; $i++ ) { if ( in_array($posts[$i]->ID, $sticky_posts) ) { $sticky_post = $posts[$i]; // Remove sticky from current position array_splice($posts, $i, 1); // Move to front, after other stickies array_splice($posts, $sticky_offset, 0, array($sticky_post)); // Increment the sticky offset. The next sticky will be placed at this offset. $sticky_offset++; // Remove post from sticky posts array $offset = array_search($sticky_post->ID, $sticky_posts); unset( $sticky_posts[$offset] ); } } // If any posts have been excluded specifically, Ignore those that are sticky. if ( !empty($sticky_posts) && !empty($wp_query->query_vars['post__not_in'] ) ) $sticky_posts = array_diff($sticky_posts, $wp_query->query_vars['post__not_in']); // Fetch sticky posts that weren't in the query results if ( !empty($sticky_posts) ) { $stickies = get_posts( array( 'post__in' => $sticky_posts, 'post_type' => $wp_query->query_vars['post_type'], 'post_status' => 'publish', 'nopaging' => true ) ); foreach ( $stickies as $sticky_post ) { array_splice( $posts, $sticky_offset, 0, array( $sticky_post ) ); $sticky_offset++; } } } return $posts; } [/cc]

用代碼讓WordPress會員註冊成功後，自動登入，並進入指定頁面

這個教學主要是談
當有人在你的wordpress註冊成會員後
不需要在輸入帳號密碼，就會自動登入
（我們有時候申請其他網站會員，成功後，還要在輸入一次帳密登入，很麻煩吧）
同時自動轉到指定的頁面。
這麼一來，就產生更多自動化的感覺！
讓我們開啟主題的functions.php貼入

[cc lang="php"] // 會員註冊成功後自動登入，並轉到指定頁面 function auto_login_new_user( $user_id ) { wp_set_current_user($user_id); wp_set_auth_cookie($user_id); // 這邊我們設定是跳轉到首頁，你要換成其他頁面 // 可以將home_url()改成你指定的URL // 如 return 'http://amitabhabuddhaya.com.tw'; wp_redirect( home_url() ); exit; } add_action( 'user_register', 'auto_login_new_user' ); [/cc]

用代碼使WordPress成員註冊成功後跳轉到指定頁面

你如果希望你的wordpress
在新會員註冊成功後，跳轉到指定頁面。
 
那你開啟主題的functions.php加入以下代碼
[cc lang="php"] // 成員註冊成功後跳轉到指定頁面 function __my_registration_redirect() { // 這邊我們設定是跳轉到首頁，你要換成其他頁面 // 可以將home_url()改成你指定的URL // 如 return 'https://onetruth.com.tw'; return home_url(); } add_filter( 'registration_redirect', '__my_registration_redirect' ); [/cc]

用代碼讓WordPress的預設角色無法進入後台

譬如：我WordPress的預設角色是訂閱者
 用代碼讓WordPress的預設角色無法進入後台
若你的的wordpress有開放註冊。
但你又不希望註冊後的「新帳號預設角色」
訂閱者可以進入後台，亂逛。

當然他進入後台，跟你進入後台看到的是不一樣。
但很多會員網站都希望「會員登入後看到是前端」
而不是好像後台操作的頁面感覺。

那你可以使用這個代碼
實現WordPress的預設角色無法進入後台
而是直接跳轉到首頁
 開啟主題的functions.php貼入

 [cc lang="php"] //用代碼讓WordPress的預設角色無法進入後台 if ( is_admin() && ( !defined( 'DOING_AJAX' ) || !DOING_AJAX ) ) { $current_user = wp_get_current_user(); if($current_user->roles[0] == get_option('default_role')) { wp_safe_redirect( home_url() ); exit(); } } [/cc]

用代碼WordPress實現文章只允許評論留言一次

這是一個非常有趣的功能
只讓訪問者留言一次
畢竟wordpress的用戶非常多，總是會有一些管理上的想法
現在我們可以用代碼實現WordPress實現文章只允許評論留言一次
放入主題主題的functions.php中即可

 


[cc lang="php"] // 讀取留言評論者的ip，僅參考wp-includes/comment.php function ludou_getIP() { $ip = $_SERVER['REMOTE_ADDR']; $ip = preg_replace( '/[^0-9a-fA-F:., ]/', '', $ip ); return $ip; } function ludou_only_one_comment( $commentdata ) { global $wpdb; $currentUser = wp_get_current_user(); // 不限制管理員發表留言評論 if(empty($currentUser->roles) || !in_array('administrator', $currentUser->roles)) { $bool = $wpdb->get_var("SELECT comment_ID FROM $wpdb->comments WHERE comment_post_ID = ".$commentdata['comment_post_ID']." AND (comment_author = '".$commentdata['comment_author']."' OR comment_author_email = '".$commentdata['comment_author_email']."' OR comment_author_IP = '".ludou_getIP()."') LIMIT 0, 1;"); if($bool) wp_die('我們只允許留言評論一次喔！點擊返回'); } return $commentdata; } add_action( 'preprocess_comment' , 'ludou_only_one_comment', 20); [/cc]

WordPress 的錯誤訊息: You don’t have permission to access post.php

當你上傳圖片

[cc lang="php"] Http Error [/cc]

或是發表文章、修改文章、發表頁面、修改頁面出現

[cc lang="php"] You don’t have permission to access /wordpress/wp-admin/post.php on this server. [/cc]

這是 Apache 的 mod_security 造成之錯誤
這時候你可以在 wp-admin 的目錄下新增 .htaccess 檔案，內容如下:

[cc lang="php"] SecFilterEngine Off SecFilterScanPOST Off [/cc]

這樣應該就可以輕鬆解決了。

WordPress禁用後台Google Open Sans字體，網站加速

總之，關閉不需要的功能，就可以加速
開啟主題的 functions.php 貼入下面代碼

[emaillocker][cc lang="php"] /** * WordPress後台禁用Google Open Sans字體，網站加速 */ add_filter( 'gettext_with_context', 'wpdx_disable_open_sans', 888, 4 ); function wpdx_disable_open_sans( $translations, $text, $context, $domain ) { if ( 'Open Sans font: on or off' == $context && 'on' == $text ) { $translations = 'off'; } return $translations; }[/cc][/emaillocker]

簡單用代碼實現wordpress顯示相關文章

很多人會使用外掛來顯示文章內的相關文章
或是使用主題內建的功能，在文章中顯示相關文章
但我個人則喜好清爽的顯示方法
以及簡單的實現方式
也是有人問我，我的相關文章是怎麼做出來的
做法很簡單，我就來分享一下
開啟主題的single.php如下圖

簡單用代碼實現wordpress顯示相關文章

在single.php裡面找到這段 

簡單用代碼實現wordpress顯示相關文章

後面加入以下代碼

[cc lang="php"]

▉▉推薦閱讀
    cat_ID; } query_posts('cat=' . $cat . '&orderby=rand&showposts=10'); //控制相關文章排序為隨機，顯示5篇相關文章 while (have_posts()) : the_post(); $thumbnail = wp_get_attachment_image_src(get_post_thumbnail_id(), 'large'); ?>

[/cc]

在你的主題css中加入以下代碼

[emaillocker] [cc lang="php"] .wrapper112{ clear: both; height: 100%; position: relative; color: #444; overflow: hidden; border: 0px solid #CCC; border-radius: 5px; font-family: Verdana,Arial,Helvetica,sans-serif; line-height: 26px; font-size: 20px; padding: 5px; } .toky_ooo li a:hover{color:#fff;background:#0099cb;border-color:#0099cb;} .toky_ooo li{float:left;list-style-type:none;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;} .toky_ooo li a{display:block;width:100%;height:100%;color:#232323;text-decoration:none;background:#f1f1f1;-moz-box-shadow:1px 1px 3px #666;-webkit-box-shadow:1px 1px 3px #666;box-shadow:1px 1px 3px #666;-moz-border-radius:8px;-webkit-border-radius:8px;;margin:6px 5px 9px 0;padding:5px;} [/cc]

那麼你可以自行修改css的樣式

[/emaillocker]

用代碼壓縮wordpress的html頁面(通用一切主題)

這是一篇進階教學，不太懂語法的人，還是別嘗試
以免讓主題或外掛的功能失效
但你可以嘗試看看，也許不會有影響
好處是，加速你網站的速度
概念是這樣的，沒有使用html壓縮時，如下
壓縮囉！這樣可以讓網站速度優化
代碼如下
開啟主題的functions.php貼入代碼

  1. function wp_compress_html()   
  2. {   
  3. function wp_compress_html_main ($buffer)   
  4. {   
  5.     $initial=strlen($buffer);   
  6.     $buffer=explode("<!--wp-compress-html-->", $buffer);   
  7.     $count=count ($buffer);   
  8.     for ($i = 0; $i <= $count; $i++)   
  9.     {   
  10.         if (stristr($buffer[$i], '<!--wp-compress-html no compression-->'))   
  11.         {   
  12.             $buffer[$i]=(str_replace("<!--wp-compress-html no compression-->", " ", $buffer[$i]));   
  13.         }   
  14.         else  
  15.         {   
  16.             $buffer[$i]=(str_replace("\t", " ", $buffer[$i]));   
  17.             $buffer[$i]=(str_replace("\n\n", "\n", $buffer[$i]));   
  18.             $buffer[$i]=(str_replace("\n", "", $buffer[$i]));   
  19.             $buffer[$i]=(str_replace("\r", "", $buffer[$i]));   
  20.             while (stristr($buffer[$i], '  '))   
  21.             {   
  22.             $buffer[$i]=(str_replace("  ", " ", $buffer[$i]));   
  23.             }   
  24.         }   
  25.         $buffer_out.=$buffer[$i];   
  26.     }   
  27.     //$final=strlen($buffer_out);   
  28.     //$savings=($initial-$final)/$initial*100;   
  29.     //$savings=round($savings, 2);   
  30.     //$buffer_out.="\n<!--壓縮前: $initial bytes; 壓縮前後: $final bytes; 节约：$savings% -->";   
  31.     return $buffer_out;   
  32. }   
  33. ob_start("wp_compress_html_main");   
  34. }   
  35. add_action('get_header', 'wp_compress_html');  

用.htaccess啟用GZIP壓縮,讓wordpress加速

我喜歡使用

  https://developers.google.com/speed/pagespeed/insights/

來測網站速度，進而修正

影響網站速度最關鍵的其中一點

就是要啟用壓縮功能

如果你是租用虛擬主機，那你就必需檢查，該功能有沒有被啟用

像有些虛擬主機，再幫你安裝wordpress後，就自動啟用

那有些虛擬主機，安裝完wordpress後，還沒啟用，如下圖

 

有些wordpress外掛也會啟用

但我不喜歡使用外掛，會拖垮網站速度

我建議用.htaccess啟動Gzip或deflate

進入ftp的根目錄，找出.htaccess

若沒有，就自己建立一個.htaccess

貼入啟用GZIP壓縮代碼
 
  1. <IfModule mod_deflate.c>   
  2. # Insert filters   
  3. AddOutputFilterByType DEFLATE text/plain   
  4. AddOutputFilterByType DEFLATE text/html   
  5. AddOutputFilterByType DEFLATE text/xml   
  6. AddOutputFilterByType DEFLATE text/css   
  7. AddOutputFilterByType DEFLATE application/xml   
  8. AddOutputFilterByType DEFLATE application/xhtml+xml   
  9. AddOutputFilterByType DEFLATE application/rss+xml   
  10. AddOutputFilterByType DEFLATE application/javascript   
  11. AddOutputFilterByType DEFLATE application/x-javascript   
  12. AddOutputFilterByType DEFLATE application/x-httpd-php   
  13. AddOutputFilterByType DEFLATE application/x-httpd-fastphp   
  14. AddOutputFilterByType DEFLATE image/svg+xml   
  15.   
  16. # Drop problematic browsers   
  17. BrowserMatch ^Mozilla/4 gzip-only-text/html   
  18. BrowserMatch ^Mozilla/4\.0[678] no-gzip   
  19. BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html   
  20.   
  21. # Make sure proxies don't deliver the wrong content   
  22. Header append Vary User-Agent env=!dont-vary   
  23. </IfModule>  

完成後！

速度明顯增加

 

代碼關閉wordpress頁面評論,關閉wordpress文章評論的完整方法

每個人都有不同的偏好
有些人用wordpress做企業網站，當然就不希望有評論功能礙眼
有些人使用的wordpress主題，有關閉文章留言評論或是頁面留言評論功能
但卻不是每個主題都有
雖然發表文章或頁面，可以設置是否啟用或是禁用留言評論，但若文章很多，那就很麻煩

這邊，我把我所知的方法提供給大家使用

關閉所有頁面評論1

開啟主題的functions.php貼入下面代碼
  1. //禁用頁面的評論留言功能 function disable_page_comments( $posts ) { if ( is_page()) { $posts[0]->comment_status = 'disabled'; $posts[0]->ping_status = 'disabled'; } return $posts; } add_filter( 'the_posts', 'disable_page_comments' );  

關閉所有頁面評論2

開啟主題的 page.php 檔，刪除「類似」以下的代碼：

[cc lang="php"]

[/cc]

關閉所有文章評論

進入主題的資料夾，選擇single.php
搜尋裡面「comments_template」
會找到

[cc lang="php"]

[/cc]

你可以刪除整段，或者加入//來取消

[cc lang="php"]

[/cc]

用代碼實現wordpress評論留言，審核通過寄信給對方信箱

為什麼要讓來WordPress留言評論，審核通過後，再發送郵件通知呢？
一般人留言完畢後，就不會再回頭看了。
除非他是問他想知道的問題，但這是少數
所以你若想讓評論留言者，再次訪問你的網站
你可以使用這個代碼 實現
用代碼實現wordpress評論留言
審核通過寄信給對方信箱
開啟主題的functions.php貼入以下代碼

  1. add_action('comment_unapproved_to_approved', 'wpdx_comment_approved');   
  2. function wpdx_comment_approved($comment){   
  3.     if (is_email($comment->comment_author_email)){   
  4.         $post_link = get_permalink($comment->comment_post_ID);   
  5.         $title = '您在【' . get_bloginfo('name') . '】的留言評論通過審核';   
  6.     
  7.         $body = '您在《<a href="' . $post_link . '" target="_blank" >' . get_the_title($comment->comment_post_ID) . '</a>》中發表的留言評論通過審核！<br /><br />';   
  8.         $body .= '<strong>您的留言評論：</strong><br />';   
  9.         $body .= strip_tags($comment->comment_content) . '<br /><br />';   
  10.         $body .= '您可以：<a href="' . get_comment_link($comment->comment_ID) . '" target="_blank">查看您的評論</a>  |  <a href="' . $post_link . '#comments" target="_blank">查看其他評論</a>  |  <a href="' . $post_link . '" target="_blank">再次閱讀文章</a><br /><br />';   
  11.         $body .= '歡迎再次光臨【<a href="' . get_bloginfo('url') . '" target="_blank" title="' . get_bloginfo('description') . '">' . get_bloginfo('name') . '</a>】。';   
  12.         $body .= '<br /><br />註：此信件為系統自動發送，請勿直接回復';   
  13.     
  14.         @wp_mail($comment->comment_author_email, $title, $body, "Content-Type: text/html; charset=UTF-8");   
  15.     }   
  16. }  
讓WordPress小工具中的文字運行PHP代碼

讓WordPress小工具中的文字運行PHP代碼

WordPress的小工具中文字，是可以加入任意HTML代碼
但卻無法運行PHP代碼，
所以你將php代碼加入到文字小工具中卻不能運行
雖有一些外掛可以解決問題，
但能用代碼實現，是更有效率的
將以下代碼加入到主題的 functions.php 文件：

  1. add_filter('widget_text', 'php_text', 99);   
  2. function php_text($text) {   
  3. if (strpos($text, '<' . '?') !== false) {   
  4. ob_start();   
  5. eval('?' . '>' . $text);   
  6. $text = ob_get_contents();   
  7. ob_end_clean();   
  8. }   
  9. return $text;   
  10. }  
後記，這是因為我自己的所用的主題，裡面有很多小工具沒有的
譬如說，我的小工具是沒有「標籤雲」
那我若想用小工具來顯示標籤雲，就是輸入標籤雲的代碼
  1. <!--?php wp_tag_cloud(); ?-->  
放在小工具的文字裡面，那就可以顯示標籤雲囉！

用代碼讓wordpress標籤雲，變成漂亮的標籤雲

我這邊提供二種樣式給看家使用，

第一種樣式

不用外掛，用代碼實現漂亮wordpress標籤雲，開啟主題的functions.php

貼入以下代碼

  1. function colorCloud($text) {     
  2. $text = preg_replace_callback('|<a (.+?)>|i', 'colorCloudCallback', $text);     
  3. return $text;     
  4. }     
  5. function colorCloudCallback($matches) {     
  6. $text = $matches[1];     
  7. $colors = array('F99','C9C','F96','6CC','6C9','37A7FF','B0D686','E6CC6E');     
  8. $color=$colors[dechex(rand(0,7))];    
  9. $pattern = '/style=(\'|\")(.*)(\'|\")/i';    
  10. $text = preg_replace($pattern, "style=\"display: inline-block; *display: inline; *zoom: 1; color: #fff; padding: 1px 5px; margin: 0 5px 5px 0; background-color: #{$color}; border-radius: 3px; -webkit-transition: background-color .4s linear; -moz-transition: background-color .4s linear; transition: background-color .4s linear;\"", $text);     
  11. $pattern = '/style=(\'|\")(.*)(\'|\")/i';    
  12. return "<a $text>";     
  13. }     
  14. add_filter('wp_tag_cloud', 'colorCloud', 1);  

第二種樣式

實現帥氣wordpress的標籤雲做法
用代碼實現帥氣wordpress的標籤雲，開啟主題的functions.php
貼入以下代碼
  1. function colorCloud($text) { // 實現彩色标簽雲     
  2.         $text = preg_replace_callback('|<a (.+?)>|i', 'colorCloudCallback', $text);      
  3.         return $text;      
  4.     }      
  5.     function colorCloudCallback($matches) {      
  6.         $text = $matches[1];      
  7.         $color = dechex(rand(0,16777215));      
  8.         $pattern = '/style=(\'|\")(.*)(\'|\")/i';     
  9.         $text = preg_replace($pattern, "style=\"color:#{$color};$2;\"", $text);      
  10.         return "<a $text>";      
  11.     }      
  12.     add_filter('wp_tag_cloud', 'colorCloud', 1);  
註：若想在任意地方加入標籤雲，可以使用標籤雲的代碼
如下
  1. <?php wp_tag_cloud(); ?>   
  2. <?php wp_tag_cloud(‘smallest=8&largest=22′); ?>   

 

關閉wordpress的內建搜尋,啟用google搜尋,降低主機負擔

不使用wordpress的內建搜尋
改用google搜尋功能ˊ
此方法，好處只是能降低「虛擬主機的負擔」
做法很簡單
步驟一
開始主題的functions.php
貼下以下代碼

[cc lang="php"] //純代碼實現wordpress關閉內置的站內搜索 function junzibuqi_com_sousuo( $query, $error = true ) { if ( is_search() ) { $query->is_search = false; $query->query_vars[s] = false; $query->query[s] = false; if ( $error == true ) $query->is_404 = true; } } add_action( 'parse_query', 'junzibuqi_com_sousuo' ); add_filter( 'get_search_form', create_function( '$a', "return null;" ) ); [/cc]

這樣就可以關閉站內搜尋
步驟二
到wordpress後台
頁面
新增頁面
新增一個search的搜尋頁面，同時連結也要是「search」
如下圖

Google自訂搜尋 整合到WordPress頁面中

步驟三
1.到Google自訂搜尋引擎「申請網址：https://cse.google.com/cse/」

Google自訂搜尋 整合到WordPress頁面中

2.[新增搜尋引擎]輸入「你的網站網址」

重要提示「通常我們以整個網站為主」
您可以加入下列條件：
整個網站：www.mysite.com/*
步驟四、選「控制台」

1.選擇「外觀與風格」
2.選擇「完整寬度」

3.最後「儲存並取得程式碼」如下圖

複製一常串的代碼
步驟五-複製以下代碼到wodpress的外觀的小工具
新增「小工具」裡面的「文字」到側邊欄

[cc lang="css"]

[/cc]


再你的主題增加以下css


[cc lang="php"] .sidebar-searchform { float: left; position: relative; width: 100%; margin: 0px; } .sidebar-searchform > div { padding: 0 37px 0 0; } .sidebar-searchform input[type=text] { width: 100%; padding: 8px 8px; line-height: 20px; margin: 0px; } .sidebar-searchform input[type=submit] { top: 0px; right: 0px; padding: 0; position: absolute; width: 38px; height: 38px; border: none; outline: 0 !important; background-color: #9c1f1f; background-image: url('http://dhamma.com.tw/wp-content/themes/a/img/search_icon.png'); background-size: 26px 26px; background-position: center; background-repeat: no-repeat; -webkit-transition: background-color 500ms; -moz-transition: background-color 500ms; -o-transition: background-color 500ms; transition: background-color 500ms; } .widget_product_search form { padding: 0 37px 0 0; position: relative; } .widget_product_search .screen-reader-text { display: none; } .widget_product_search input[type="search"] { width: 100%; height: 38px; } .widget_product_search input[type="submit"] { top: 0px; right: 0px; padding: 0; position: absolute; width: 38px; height: 38px; border: none; background-color: #9c1f1f; background-size: 26px 26px; background-position: center; background-repeat: no-repeat; text-indent: 10000px; background-image: url('http://dhamma.com.tw/wp-content/themes/a/img/search_icon.png'); } .sidebar-searchform input[type=submit]:hover, .widget_product_search input[type="submit"]:hover { background-color: #1a1a1a; } @media only screen and (-Webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) { .sidebar-searchform input[type=submit], .widget_product_search input[type="submit"] { background-image: url('http://dhamma.com.tw/wp-content/themes/a/img/Email住址會使用灌水程式保護機制。你需要啟動Javascript才能觀看它'); } } [/cc]

總結1：將會有以下效果

總結2:若要更改搜尋結果的顏色，請回到[外觀和風格]選「自訂」
即可更改成你要的結果





導航連結

歡銀加入LINE

382230

歡迎加入FB粉絲團


正葳網頁設計,客製化網站製作,網路行銷課程,網頁設計教學