模板区块内链接代码的两种模式:

浮窗模式与新窗口模式代码不一样,所以前台页面区块编辑里不能自动设置两种模式,如果要两处并存,需要模板代码有对应关系。也就是模板区块代码里是浮窗模式,那么前台编辑里填写的链接就是浮窗,反之则要模板区块代码就要改成新窗口打开的代码。因此建议统一模式,或者模板区块代码进行分区设置,分别划分两个区各对应一种模式,这样才能使代码不乱。

说明:两种模式a标记里的链接和图标地址都可以为空,填上也只是为了标记和容易识别,因为模板文件创建后,前台区块编辑设置里可以直接改,不影响模板代码里的链接与图片参数。

一、浮窗模式的代码:

链接模式代码里要设置浮窗模式,class="diy-item load" 、type="custom" 、method="load"(这三个不能缺,其中a标记里的class="load"不能少,如果前面已定义了class其他,可以在里面加上load,例如:class="diy-item load"),浮窗模式下将a标记里新窗口打开标签去掉(target="_blank")。下面链接#和图片地址在使用时可以去掉为空或留个类型做标记,不受影响。

      <li class="flex">
        <div class="radius10 $_S['diy-group']" id="pro2" onMouseOver="Sms.hover('#pro2','.cabinetlist')">
          <img class="diy-item" id="pro2-img" src="{diy('pro2-img','./staic/custom/default/c2.jpg','image',array(120,120))}" >
          <h3 class="diy-item" id="pro2-name">
 <a href="{diy('pro2-link','#','link',array('url'))}"  class="diy-item" id="pro2-link" type="custom" method="load">
     {diy('pro2-link','标题X','link',array('name'))}
   </a>
          </h3>
          <p class="diy-item" id="pro2-info">{diy('pro2-info','内容2')}</p>
        </div>
      </li>

二、新窗口打开模式代码:

下面是新窗口打开模式代码,主要与上面浮窗模式代码的区别在a标记里的几个标签(少了class="load"、type="custom" 、method="load"这三个标签,多了一个target="_blank"),其他不变。

      <li class="flex">
        <div class="radius10 $_S['diy-group']" id="pro3" onMouseOver="Sms.hover('#pro3','.cabinetlist')">
          <img class="diy-item" id="pro3-img" src="https://city.ah.cn/data/common/202405/31/1717162144575.jpg" >
          <h3 class="diy-item" id="pro3-name">
            <a href="{diy('pro3-link','#','link',array('url'))}" class="diy-item" id="pro3-link" target="_blank">
              {diy('pro3-link','标题3','link',array('name'))}
            </a>
          </h3>
          <p class="diy-item" id="pro3-info">{diy('pro3-info','内容3')}</p>
        </div>
      </li>


三、同样式多区块页面用到的代码块1-100:

便于后面批量复制使用,可用于网址导航、分类导航、二维码展示、社群分类列表等,在使用时按两种打开模式进行批量替换或分开分区分别放置两种代码。
批量代码在:https://zz.soseo.cc/post/564.html

四、样式文件和模板文件附件
样式文件:技术运维社群/siyu-ppl.css
模板文件:技术运维社群/pp_wzdh.php