如何添加到您的论文博客旋转木马

2009年8月10日由管理员 给一个回复»

邮政形象如何添加一个旋转木马到您的论文博客

如果你已经花了来访的博客最近随时可能你看见了那些小小的照片的一个标题或文字中或附近的刊头位accompained。 我不知道它有一个适当的名称,但大多数人谈过,我称之为一本教程中旋转木马,我将告诉你如何添加到您的博客之一。 对于你几个谁不知道我在说什么,这里有一个镜头从屏幕gawker.com这是我第一次看到它的地方被使用。

7262009_22442 PM

随着时间的故事,去跨越的旗帜,最终辍学认为,类似的方式做马传送带上。 我将会向您展示如何做这个论文 ,与许多教程你能适应这些节目与任何博客,它只是更方便论文 :-)

首先我们将需要一种方法来孤立哪些职位要显示在顶部。 可能你会想挑你的最新帖子(不是所有的新职位最好的是最好的)。 我喜欢让我的博客低维修或自行维修器材,所以我决定使用功能的类是相同的我用来填补视觉滑块的网页关于。 然而,你可以很容易地使用标签而不是一个孤立的类别。

为了使痛饮发生我们要创建一个自定义函数在custom_functions.php称为top_carousel()它里面我们要添加global $post (允许WordPress的获取项目以外的现职人员)和1 “if”语句,使狂欢作乐后只有单页(我觉得该网页似乎期望“忙”与一个滑块和一个旋转木马,但这是你的选择)。 这里就是最初的代码如下所示:


function top_carousel(){
global $post;
if (is_single ()){
}
}

下一步我们将添加一个旋转木马“包装”这将使我们能够增加一些视觉造型一次,我们就大功告成了:


function top_carousel(){
global $post;
if (is_single ()){
echo '<div id="topcarosel">';
echo '</div>';
}
}

下一步我们将需要建设一个数据库SELECT语句只选择我们想要的职位。 就我而言,我想过去6发布的文章,从“特色”类别,日期顺序相反。 要做到这一点,我们将使用下面的查询

$the_query = new WP_Query(array(
'category_name'=>'featured',
'orderby'=>'date',
'order'=>'DESC',
'showposts'=>'6'
));

解释WP_Query的复杂性是这个职位但是你可以超出范围了解更多关于它的WordPress或其他大量的网络教程上 但希望它很容易进行逆向工程,从“特色”类别只选择岗位,他们按日期顺序,依次为,并选择6个员额为限。

接下来,我们需要显示该基于查询的职位,在这里的我们如何做到这一点:

while ($the_query->have_posts()) : $the_query->the_post(); $do_not_duplicate = $post->ID;
$image = get_post_meta($post->ID, 'thesis_post_image', $single = true);
echo '<div class="carouselu">';
echo '<a href="';
echo the_permalink();
echo '" >';
echo '<img src="http://www.wolf-howl.com/wp-content/themes/thesis-wolf/lib/scripts/thumb.php?src='.$image.'&w=140&h=140&zc=1&q=100"></a>';
echo '<a href="';
echo the_permalink();
echo '" >';
echo the_title();
echo '</a>';
echo '</div>';
endwhile;

这一段代码执行以前的SQL查询,显示的该帖子的论文图片,调整下来到140 × 140平方米,它链接到该帖子的永久链接,然后显示的是作为对永久性连结标题以及,并包装在一个“分区”整个事情。

这里只有一个最后一点,因为我们将要使用的CSS浮动DIV的个人传送带单位的,我们需要确保我们清除浮动的,当我们这样做:

echo '<div style="clear:both"></div>';

现在好了把它一起,就应该是这个样子:


function top_carousel(){
global $post;
if (is_single ()){
echo '<div id="topcarosel">';
$the_query = new WP_Query(array(
'category_name'=>'featured',
'orderby'=>'date',
'order'=>'DESC',
'showposts'=>'6'
));
while ($the_query->have_posts()) : $the_query->the_post(); $do_not_duplicate = $post->ID;
$image = get_post_meta($post->ID, 'thesis_post_image', $single = true);
echo '<div

function top_carousel(){
global $post;
if (is_single ()){
echo '<div id="topcarosel">';
$the_query = new WP_Query(array(
'category_name'=>'featured',
'orderby'=>'date',
'order'=>'DESC',
'showposts'=>'6'
));
while ($the_query->have_posts()) : $the_query->the_post(); $do_not_duplicate = $post->ID;
$image = get_post_meta($post->ID, 'thesis_post_image', $single = true);
echo '<div class="carouselu" >';
echo '<a href="';
echo the_permalink();
echo '"  >';
echo '<img src="http://www.wolf-howl.com/wp-content/themes/thesis-wolf/lib/scripts/thumb.php?src='.$image.'&w=140&h=140&zc=1&q=100"></a>';
echo '<a href="';
echo the_permalink();
echo '"  >';
echo the_title();
echo '</a>';
echo '</div>';
endwhile;
echo '<div style="clear:both"></div>';
echo '</div>';
}
}
>';
echo '<a href="';
echo the_permalink();
echo '"  >';
echo '<img src="http://www.wolf-howl.com/wp-content/themes/thesis-wolf/lib/scripts/thumb.php?src='.$image.'&w=140&h=140&zc=1&q=100"></a>';
echo '<a href="';
echo the_permalink();
echo '"  >';
echo the_title();
echo '</a>';
echo '</div>';
endwhile;
echo '<div style="clear:both"></div>';
echo '</div>';
}
}

只有2个步骤了,我们需要将此代码添加到custom_functions.php告诉论文何时启动并显示旋转木马,我们不喜欢这样的:
add_action('thesis_hook_before_header', 'top_carousel');

然后,我们需要添加的造型我们custom.css文件位在我的情况下,我用这样:
#topcarosel {border:1px solid #efefef; padding: 0px;padding-left:10px;}
.caroselu {width:150px;float:left;padding:3px;text-align:center;}
.caroselu IMG {border:2px solid #ccc;display:block;}

这包裹光围绕整个顶部旋转木马灰色边框并提出制定了填充位,然后设置一个的“旋转木马单位的一个填充位”每个150像素宽和“彩车”他们让他们并排显示,然后把周围的传送带形象浅灰色框,并确保没有任何一个字母到显示蠕变。 如果你没有犯任何错误应该类似于屏幕截图如下:

7262009_32157 PM

该代码是很简陋和有很多机会让你改善/改变它,这里有一些建议:

  • 有第一个或两个插槽填充不同的标签/类别,如果您有任何“新闻”内容的博客,那将是很有益的排序。
  • 在标签看/类别的现职,并选择最后一个或两个插槽,这将极大地提高点击率相关的职位。
  • 改变立场的例子为传送带TechCrunch的混合物阻止它成为目前的“内容”时, 纽约时报把它在文章的底部。
  • 使用多个旋转木马在侧栏或张贴后,以显示相关的职位。

要感谢肖恩波斯富街每周写旋转木马的最后和激励我下车我基斯特和想出如何去做,并感谢尼克里斯谁的问题帮一个编码,你可能也想看看他的一些论文教程

虽然本教程不是一个编程的杰作,它可能是有点超出你,如果你只有很少的编程经验。 但是,如果你一直想知道是论文只是“新手”我希望这些过去几论文教程表明您论文真的是一个框架 ,使您更容易与您的博客的互动和把事情做得更快,更容易,无论你是如何经历, 所以为什么不尝试一下

这个职位原本来自迈克尔格雷谁是搜索引擎优化顾问 一定不要错过论文WordPress主题的审查

如何添加到您的论文博客旋转木马

1 2 3 4 5 6 7 8

相关岗位:

  1. 如何添加一个Visual滑块论文 下面是一个教程关于如何添加...
  2. 论文教程-如何添加AdSense的区段配置 使用博客的Adsense您通常也不是最赚钱的...
  3. 请Digg和Facebook的论文工作更好地与 如果你Facebbok参与社会,媒体网站如Digg ...

有关职位为您带来的另一种相关文章插件

分享和欣赏:
  • Print this article!
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • MySpace
  • Reddit
  • RSS
  • Yahoo! Bookmarks

相关岗位:

  1. 设为论文工作更好地与Digg和Facebook的
  2. 利用博客标签上更好的为您的广告定位
  3. 赞助商的声誉管理使用博客主题
  4. 请问您的博客吸...以下是如何修复它
  5. 如何使用网站标签在您的博客或

广告

留下一个回复