进入专题模式查看 >>

本节我们将让模板智能化,自动的隐藏没有放置模块的位置。

1,本节目标


掌握countModules的用法,隐藏没有发布模块的位置

2,场景说明


 现在将侧边栏上的模块都停止发布,会看到如下的截图:

侧边栏没有发布模块.png

这明显不是我们期望的结果,理想的状态应该是如果侧边栏没有发布模块,内容部分应该自动的占据这个页面的全部内容。

3,如何解决


Joomla针对上面的场景,为我们提供了解决方案——countModules(). 这个方法可以让我们计算指定的位置上发布的模块数量,以此来动态的调整网页的HTM结构,以此来解决空模块占据页面空间的问题。

countModules方法接受一个字符串的参数。该参数为你需要计算的位置的名称。返回该位置发布模块的个数。一段典型的代码如下:

<?php if ($this->countModules( 'sidebar' )) : ?>
  <div class="sidebar">
    <jdoc:include type="modules" name="sidebar" style="html5" />
  </div>
<?php endif; ?> 

上面的代码通过检查sidebar这个位置的模块数量,如果该位置的模块数量不为0,那么就输出这一个位置。

关于countModules()更加全面的介绍,请参考:countModules用法详解

4,v0.0.14版本


在本版本中,我们增加了对模块位置的统计,以动态的调整html结构。

4.1 重点代码片段如下:

<div class="container">
	<div class="row">
		<?php if($this->countModules("sidebar")):?>
		<div class="col-md-9">
			<div class="content">
				<!-- 组件输出的位置-->
				<jdoc:include type="component" />
			</div>
		</div>
		<div class="col-md-3">
			<div class="sidebar">
				<!-- 侧边栏-->
				<jdoc:include type="modules" name="sidebar"  style="html5" /> 
			</div>
		</div>
		<?php else:?>
		<div class="col-md-12">
			<div class="content">
				<!-- 组件输出的位置-->
				<jdoc:include type="component" />
			</div>
		</div>	
		<?php endif;?>
	</div>
</div>

 上面的代码首先计算是否在sidebar这个位置发布了模块,如果有,那么内容和侧边栏分别为 col-md-9,col-md-3.如果没有则内容独占col-md-12 

4.2 效果

内容自动撑开.png

4.3 v0.0.14版本的代码

关于v0.0.14版本的代码,可以在此下载 tpl_plancv0.0.14_2019-01-18_for_j3x.zip

用户评分: 0 / 5

不活动星星不活动星星不活动星星不活动星星不活动星星
 

评论

  • 未找到评论