不用外掛,讓wordpress圖片燈箱效果
點擊數: 2282
文章目錄
- 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裡面,在上面加入下面代碼:
- 在當前主題的functions.php裡面,在 上面加入下面代碼:
- 現在,你只需要把新增媒體的圖片設定「圖片網址」
- 就會有以下燈箱效果囉!
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裡面,在上面加入下面代碼:
- "stylesheet" type="text/css" href="/fancybox/jquery.fancybox.css" />
在當前主題的functions.php裡面,在 上面加入下面代碼:
- //wordpress燈箱效果
- add_filter('the_content', 'replace_content');
- function replace_content ($content){
- global $post;
- $pattern = "/<a(.*?)href=('|\")([^>]*).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>(.*?)<\/a>/i";
- $replacement = '<a$1href=$2$3.$4$5 class="fancybox"$6>$7';
- $content = preg_replace($pattern, $replacement, $content);
- return $content;
- }