标签： 代码

用外链图片怎么做特色图片？

yuncunchu
最近遇到很多朋友在说，把图片存到云端，从而提升博客的速度，但是很多人不知道特色图片怎么外链，其实wordpress的特色图片是不能使用外链地址的。
所以我们就只能使用今天说到的这个方法，调用文章的第一张图片作为特色图片，这样咱们就可以把图片存到云端了。
那我们怎么才可以获得文章中的第一张图片，并把它显示在网页中呢？
首先，打开你主题的Function.php文件，在其中加入以下代码：

  1. function catch_that_image() {  
  2.   global $post, $posts;  
  3.   $first_img = ”;  
  4.   ob_start();  
  5.   ob_end_clean();  
  6.   $output = preg_match_all(‘/<img.+src=[\’“]([^\'”]+)[\’“].*>/i’, $post->post_content, $matches); 
  7.   $first_img = $matches [1] [0]; 
  8.   
  9.   if(empty($first_img)){ //Defines a default image 
  10.     $first_img = “/images/default.jpg”;  
  11.   }  
  12.   return $first_img;  
  13. }  

第二步，在你的模板的主循环中加入以下代码：

  1. <?php echo catch_that_image() ?>  

这样就可以把文章中的第一张图片显示在页面上了…

jQuery实现侧边栏随窗口滚动

近日帮人作主题要求弄个侧边栏某个模块随窗口一起滚动，可能其他童鞋也想给主题加上这个小功能，贴出来，供大家参考。

方法一：

很简单，前提是你的主题必须已加载了jQuery。

把下面代码加到主题头部header.php模版中即可：

  1. <script type=“text/javascript”>     
  2. $(function() {  
  3.     var $sidebar   = $(“#sidebar”),     
  4.         $window    = $(window),     
  5.         offset     = $sidebar.offset(),     
  6.         topPadding = 15;     
  7.     
  8.     $window.scroll(function() {     
  9.         if ($window.scrollTop() > offset.top) {     
  10.             $sidebar.stop().animate({     
  11.                 marginTop: $window.scrollTop() – offset.top + topPadding     
  12.             });     
  13.         } else {     
  14.             $sidebar.stop().animate({     
  15.                 marginTop: 0     
  16.             });     
  17.         }     
  18.     });     
  19.     
  20. });     
  21. </script>    

可根据不同的主题模版，自行修改一下其中的DIV标签#sidebar名称。此方法兼容所有浏览器。

演示效果

HotNews主题也可使用该功能，默认是整个侧边栏随窗口滚动，受主题布局功能限制，单独滚动某个模块效果不是很理想。

参考自：http://css-tricks.com/scrollfollow-sidebar/

方法二：

本人未试过，可以自行参阅：js页面滚动时层智能浮动定位实现

  1. $.fn.smartFloat = function() {    
  2.     var position = function(element) {    
  3.         var top = element.position().top, pos = element.css(“position”);    
  4.         $(window).scroll(function() {    
  5.             var scrolls = $(this).scrollTop();    
  6.             if (scrolls > top) {    
  7.                 if (window.XMLHttpRequest) {    
  8.                     element.css({    
  9.                         position: “fixed”,    
  10.                         top: 0    
  11.                     });        
  12.                 } else {    
  13.                     element.css({    
  14.                         top: scrolls    
  15.                     });        
  16.                 }    
  17.             }else {    
  18.                 element.css({    
  19.                     position: “absolute”,    
  20.                     top: top    
  21.                 });        
  22.             }    
  23.         });    
  24.     };    
  25.     return $(this).each(function() {    
  26.         position($(this));                             
  27.     });    
  28. };    
  29. $(“#float”).smartFloat();    

把WordPress放在子目录而地址显示根目录的方法

以WordPress放在在子目录博客显示在根目录开题。要实现如下所示的效果，空间需支持rewrite–这是前提。如果不支持的话神都救不了你，哈哈。如果我们要在根目录安装WordPress，根目录就会被WordPress的文件弄得很乱，如果再添加了自己的一些目 录就更加难以维护了。不过还好，WordPress允许将Blog主页不同于 WordPress 的安装目录的Web地址，这样我们就可以把WordPress放在子目录中，只需要简单的设置便可以让链接形式仍以根目录显示。这篇文章翻译自 WordPress官方文档，水平有限，见谅！下面是译文：

把WordPress放在在单独目录中而让你的博客显示在根目录

很多人想让WordPress来驱动他们站点的根目录（例如：http://example.com），但是他们不想让所有的的 WordPress文件把他们的根目录弄乱。WordPress允许你把WordPress文件放在一个子目录，同时让你的博客显示在站点的根目录中。

把WordPress放到单独它单独目录下的程序如下：

1、新建一个用来存放WordPress核心文件的新文件夹（本例以/wordpress示范）。

2、进入选项（options）面板。

3、找到WordPress address (URL)（中文用户请查找”WordPress 地址（URL）“）这个选项：把后面的地址改成你存放WordPress文件的文件夹地址。比如：http://example.com/wordpress

4、找到Blog address (URL)（中文用户请查找”Blog 地址（URL）“）这个选项：把此地址改为你网站的根目录的URL。例如：http://example.com

5、点击Update Options（中文用户为”更新设置“）。

6、把WordPress的核心文件转移到你新建的文件夹中，也就是WordPress address (URL)这个目录。还不明白？在明确一点：/wordpress目录。

7、把index.php和.htaccess文件从WordPress目录转移到根目录（即Blog address）中。

8、用文本编辑器打开并编辑根目录下”index.php”这个文件。

9、找到如下代码，修改并保存：找到：

  1. require(‘./wp-blog-header.php’);    

把地址改为你WordPress目录下的文件：

  1. require(‘./wordpress/wp-blog-header.php’);   

10、登陆控制面板，新的控制面板地址为http://example.com/wordpress/wp-admin/

11、如果你设置了结构化链接地址（Permalinks），打开永久链接选 项面板更新Permalinks结构。如果.htaccess有正确的权限设置的话WordPress会自动更新你的.htaccess文件。如果 WordPress不能写入你的.htaccess文件，就会显示新的rewrite规则，因此你就需要手动把rewrite规则复制到. htaccess文件中（和index.php同目录）。

原文地址：http://codex.wordpress.org/Giving_WordPress_Its_Own_Directory

译文也同时发布于WordPress中文文档中。

这些步骤貌似很麻烦但实际操作起来很简单，老外写的过于详细了，相信稍有经验的人都应该可以看懂。以前我的WordPress也安装在根目录，但今天按照操作改到了子目录中，根目录就变得清爽多了。注意操作步骤要严格按照这上面的来，每布的顺序不要弄错，否则你可能就进不了后台，或者页面无法打开。而一旦出现那些问题就只能手动修改数据库了。

把WordPress放在根目录而地址显示子目录的方法

把WordPress安装在根目录但是让博客首页显示在子目录，这和上篇的教程实现的效果刚好相反。要实现这样的效果前提是你的空间必须支持rewrite功能。我们可以用两种方法实现：

1、参照上篇的方法，相信大家已经心中有数了：WordPress安装到根目录，我们在根目录下再新建一个子目录，比如”blog”目录。同样将根目录的index.php和.htaccess文件转移到”blog”目录目录中。在index.php里：

  1. require(’./wp-blog-header.php’);    

修改为：

  1. require(’../wp-blog-header.php’);  

再加个点就行了，表示引用上个目录中的文件。

其他更改博客和WordPress地址方法和上篇类似，照葫芦画瓢即可。注意把博客地址改为：http://example.com/blog，同时要把页面结构更改成”/blog/xxx…”类型。

2、下面这种方法要用到页面模板的相关技巧。对页面模板一无所知？先去水煮鱼的使用WordPress静态模板那里充点电把！充过电别忘了回来，呵呵~利用页面模板我们甚至还可以将WordPress打造成一个轻量级的CMS。

新建一个blog.php的文件，放到所使用的模板目录中。此文件所包含的内容为：

  1. <?php    
  2. /*  
  3. Template Name: Blog  
  4. */    
  5. ?>    
  6.     
  7. <?php query_posts(’cat=-0′); //gets all posts    
  8. load_template( TEMPLATEPATH . ‘/index.php’); //loads index    
  9. ?>    

登陆后台，新建一个页面，命名为”blog”，并使用”blog”页面模板。切记一定要让此页面的缩略名、或者叫做数据域，更改为”blog”！

最后一步同样是更新页面结构，把页面结构更新为”/blog/xxx…”类型即可。

到这里两种方法都介绍完毕。两种方法实现的功能都是一样的，不过个人觉得把WordPress放根目录而让博客显示在子目录中并不是一个好办法，这会让你的根目录杂乱且难以维护，明显没有WordPress放子目录而博客根目录方便。真要想让博客放在子目录的话，倒不如直接把WordPress安装在子目录似乎更方便一些，还免得设置了。以上的两种方法实用性并不大，谨作为一种小技巧来学习吧。:)