renren/web/themes/default/home/welcome-site.html

<style>
	.template .item{position:relative;display:block;float:left;border:1px #ddd solid;border-radius:5px;background-color:#fff;padding:5px;width:190px;margin:0 10px 10px 0;}
	.template .title{margin:5px auto;line-height:2em;}
	.template .item img{width:178px;height:270px;}
	.clear{clear:both;}
	.home-container{width:100%; overflow:hidden; margin:.6em .3em;}
	.home-container .tile{float:left; display:block; text-decoration:none; outline:none; width:6em; height:6em; margin:.4em;}
	.home-container i{display:block; color:#333; height:1em; overflow: hidden; font-size:2em; margin:.25em .2em;}
	.home-container span{display:block; width:100%; overflow:hidden;}
</style>
<div class="page-header">
	<h4><i class="fa fa-comments"></i> 当前站点</h4>
</div>
<div class="panel panel-default row">
	<div class="table-responsive panel-body">
	<table class="table">
		<tr>
			<td style="width:200px; border-top:none;">
				<div class="">
					<div class="item">
						<div class="title">
							<img src="../app/themes/{$template['name']}/preview.jpg" class="img-rounded" />
						</div>
					</div>
				</div>
			</td>
			<td style="border-top:none;">
				<p>
					<strong>微站入口触发关键字 : </strong>
					{loop $keywords $keyword}
						<span class="label label-success">{$keyword['content']}</span>
					{/loop}
				</p>
				<p><a href="javascript:;" onclick="preview_home('{$setting['styleid']}', '{$setting['id']}');return false;" class="btn btn-default">预览</a></p>
			</td>
		</tr>
	</table>
	</div>
</div>
<div class="page-header">
	<h4><i class="fa fa-android"></i> 站点导航图标</h4>
</div>
<div class="panel panel-default">
	<div class="panel-body table-responsive">
	<table class="table">
		<thead>
			<tr>
				<th style="width:200px">导航及菜单</th>
				<th>概况</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>微站首页导航图标</td>
				<td>
					<div class="home-container">
						{loop $home_navs $nav}
						<a href="javascript:viod(0);" class="tile text-center btn btn-default">
							{if !empty($nav['icon'])}
							<i style="background:url({$_W['attachurl']}{$nav['icon']}) no-repeat;background-size:cover;{$nav['css']['icon']['style']} height:1em; margin:.25em .4em;"></i>
							{else}
							<i class="fa {$nav['css']['icon']['icon']}"></i>
							{/if}
							<span style="{$nav['css']['name']}" title="{$nav['name']}">{$nav['name']}</span>
						</a>
						{/loop}
					</div>
				</td>
			</tr>
			<tr>
				<td>个人中心导航条目</td>
				<td>
					<div class="home-container">
						{loop $profile_navs $nav}
						<a href="javascript:viod(0);" class="tile text-center btn btn-default">
							{if !empty($nav['icon'])}
							<i style="background:url({$_W['attachurl']}{$nav['icon']}) no-repeat;background-size:cover;{$nav['css']['icon']['style']}"></i>
							{else}
							<i class="fa {$nav['css']['icon']['icon']}"></i>
							{/if}
							<span style="{$nav['css']['name']}" title="{$nav['name']}">{$nav['name']}</span>
						</a>
						{/loop}
					</div>
				</td>
			</tr>
		</tbody>
	</table>
</div>
</div>

<div class="page-header">
	<h4><i class="fa fa-cogs"></i> 幻灯片设置</h4>
</div>
<div class="panel panel-default row">
	<div class="panel-body table-responsive">
	<table class="table">
		<tr>
			<td style="border-top:0;">
				{if !empty($slides)}
					<div id="carousel-example-generic" class="carousel slide" style="width:600px" data-ride="carousel">
						<ol class="carousel-indicators">
						{loop $slides $a $slide} 
							<li data-target="#carousel-example-generic" data-slide-to="0"  {if $a == 0}class="active"{/if}></li>
						{/loop}
						</ol>
						<div class="carousel-inner">
							{loop $slides $a $slide} 
							<div class="item {if $a == 0}active{/if}">
								<img src="{$slide['thumb']}" alt="{$slide['title']}" style="height:300px; margin-left:auto; margin-right: auto;">
								<div class="carousel-caption">
									<h5>{$slide['title']}</h5>
								</div>
							</div>
							{/loop}
						</div>
						<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
							<span class="glyphicon glyphicon-chevron-left"></span>
						</a>
						<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
							<span class="glyphicon glyphicon-chevron-right"></span>
						</a>
					</div>
				{/if}
			</td>
		</tr>
	</table>
</div>
</div>
<script type="text/javascript">
	function preview_home(styleid, multiid) {
		var content = '<iframe width="320" scrolling="yes" height="480" frameborder="0" src="about:blank"></iframe>';
		var footer =
		'<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>';
		var dialog = util.dialog('预览模板', content, footer);
		dialog.find('iframe').on('load', function(){
			$('a', this.contentWindow.document.body).each(function(){
				if ($(this).attr('href').substr(0, 4) != 'http') {
					if ($(this).attr('href').substr(0, 2) == './') {
						$(this).attr('href', $(this).attr('href') + 's=' + styleid);
					} else {
						$(this).attr('href', 'http://' + $(this).attr('href'));
					}
				}
			});
		});
		var url = '../app/{php echo murl('home')}&s=' + styleid + 't=' + multiid;
		dialog.find('iframe').attr('src', url);
		dialog.find('.modal-dialog').css({'width': '322px'});
		dialog.find('.modal-body').css({'padding': '0', 'height': '480px'});
		dialog.modal('show');
	}
</script>