Umbraco JCarousel添加blogpost而不是html
是否可以将我的博客帖子添加到JCarousel而不是html代码?应该是这样的: => 在这个网站上,内容只是html,但我想让我的博客文章炫耀一下 假设我写了5篇博客文章,所以滑块必须显示5篇博客文章 希望有人能帮助我 问候Umbraco JCarousel添加blogpost而不是html,umbraco,umbraco-blog,Umbraco,Umbraco Blog,是否可以将我的博客帖子添加到JCarousel而不是html代码?应该是这样的: => 在这个网站上,内容只是html,但我想让我的博客文章炫耀一下 假设我写了5篇博客文章,所以滑块必须显示5篇博客文章 希望有人能帮助我 问候 Nico您需要创建一个宏(xslt或razor)来显示您的博客文章节点,然后使用jquery将它们作为加载jcarousel的目标。下面是razor脚本的一个示例,该脚本使用您引用的中的代码执行此操作: @using umbraco.MacroEngines @inher
Nico您需要创建一个宏(xslt或razor)来显示您的博客文章节点,然后使用jquery将它们作为加载jcarousel的目标。下面是razor脚本的一个示例,该脚本使用您引用的中的代码执行此操作:
@using umbraco.MacroEngines
@inherits DynamicNodeContext
@try
{
<script type="text/javascript" src="http://www.fdp-bw.de/jcarousel/lib/jquery-1.2.3.pack.js"></script>
<script type="text/javascript" src="http://www.fdp-bw.de/jcarousel/lib/jquery.jcarousel.pack.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.fdp-bw.de/jcarousel/lib/jquery.jcarousel.css" />
<link rel="stylesheet" type="text/css" href="http://www.fdp-bw.de/jcarousel/skins/tango/skin.css" />
<style type="text/css">
/**
* Additional styles for the controls.
*/
.jcarousel-control {
margin-bottom: 10px;
text-align: center;
}
.jcarousel-control a {
font-size: 75%;
text-decoration: none;
padding: 0 5px;
margin: 0 0 5px 0;
border: 1px solid #fff;
color: #eee;
background-color: #4088b8;
font-weight: bold;
}
.jcarousel-control a:focus,
.jcarousel-control a:active {
outline: none;
}
.jcarousel-scroll {
margin-top: 10px;
text-align: center;
}
.jcarousel-scroll form {
margin: 0;
padding: 0;
}
.jcarousel-scroll select {
font-size: 75%;
}
#mycarousel-next,
#mycarousel-prev {
cursor: pointer;
margin-bottom: -10px;
text-decoration: underline;
font-size: 11px;
}
</style>
<script type="text/javascript">
/**
* We use the initCallback callback
* to assign functionality to the controls
*/
function mycarousel_initCallback(carousel) {
jQuery('.jcarousel-control a').bind('click', function () {
carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
return false;
});
jQuery('.jcarousel-scroll select').bind('change', function () {
carousel.options.scroll = jQuery.jcarousel.intval(this.options[this.selectedIndex].value);
return false;
});
jQuery('#mycarousel-next').bind('click', function () {
carousel.next();
return false;
});
jQuery('#mycarousel-prev').bind('click', function () {
carousel.prev();
return false;
});
};
// Ride the carousel...
jQuery(document).ready(function () {
jQuery("#mycarousel").jcarousel({
scroll: 1,
visible: 1,
auto: 10,
wrap: "last",
initCallback: mycarousel_initCallback,
// This tells jCarousel NOT to autobuild prev/next buttons
buttonNextHTML: null,
buttonPrevHTML: null
});
});
</script>
<div id="mycarousel" class="jcarousel-skin-tango">
<ul>
@foreach (var post in Model.AncestorOrSelf().Descendants("umbBlogPost"))
{
<li>
<h2>@post.Name</h2>
<div>@post.bodyText</div>
</li>
}
</ul>
<div class="jcarousel-control">
@for (int i = 0; i < Model.AncestorOrSelf().Descendants("umbBlogPost").Count(); i++)
{
<a href="#">@(i + 1)</a>
}
</div>
</div>
}
catch (Exception e)
{
<!-- @e.ToString() -->
}
您可能只需要编辑模板并添加自己的宏,以jcarousel可以使用的格式输出博客文章。你写了这个例子吗?没有,我没有写。我希望在我的主页上有这样的内容,只是用博客帖子而不是html。谢谢你的帮助。我希望我能做到这一点:)我真的只是这方面的初学者。以前从未使用过Umbraco。有关于编写自己的宏的好教程吗?官方主页没有多大帮助…您使用的是什么版本的Umbraco?您使用的是uBlogsy或Blog4Umbraco这样的特定博客包吗?我使用的是版本“Umbraco v 4.7.2(汇编版本:1.0.4500.21031)”。我安装了它并选择了博客初学者工具包。我认为它安装了uBlogsy(starterkitblog 1.2),但可能是starter本身的一个单独的包(很难说,因为我还没有找到关于它的信息)。我真的很担心。我希望有办法做到:(对不起,我花了这么长时间才回复你,这是忙碌的一周。
var posts = Model.AncestorOrSelf().Descendants("umbBlogPost").OrderBy("PostDate desc").Take(5);