帝国CMS二次开发H5手游如何让同一个url 不同的模板

2024-06-20 04:36

本文主要是介绍帝国CMS二次开发H5手游如何让同一个url 不同的模板,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

帝国CMS在二次开发《72游戏网》的时候,H5手游如何让同一个url 不同的模板

比如:www.72yy.com/you/11935.html 是H5游戏宣传页

由于很多H5游戏和网页游戏都是需要使用iframe来嵌套使用的 利于自己网站SEO收录优化

那么就再复制一套程序 用二级目录或者二级域名 我这里使用的是二级域名games

那么改造好后就是 games.72yy.com/you/11935.html

其实在后台上面 是一个内容 利用了不同模板而已。帝国CMS的模板是不入数据库的,是储存在本地的。这样就可以参考开手机端的方案 新建模板组 使用相同的数据库去实现了。

查看站内效果演示 列表里也实现了 双url 标题是内容 按钮是iframe页

下面是games二级域名的内容模板iframe代码 

<!doctype html>
<html lang="zh_CN">
<title>  </title>
<meta name="keywords" content="  ">
<meta name="description" content="  ">  
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2">
</head><style>  body, html {  margin: 0;  padding: 0;  height: 100%;  overflow: hidden; /* 防止滚动条出现,如果iframe高度足够的话 */  
overflow-x: hidden; /* 隐藏水平滚动条(如果需要的话) */  }  .fixed-nav {  position: fixed;  top: 0;  left: 0; /* 初始设置为0,之后在媒体查询中调整 */  width: 100%; /* 初始设置为100%,之后在媒体查询中调整 */  height: 53px;  background-color: #ddd841;  display: flex;  align-items: center;  justify-content: space-between;  padding: 0 10px;  box-sizing: border-box;  z-index: 1000; /* 确保导航在其他内容之上 */  
}  /* 媒体查询,针对电脑版(假设屏幕宽度大于或等于768px) */  
@media (min-width: 768px) {  .fixed-nav {  left: 0%;width: 100%;  }  
}  /* 如果需要更精确地针对移动设备(如智能手机),可以使用更小的屏幕宽度值,例如375px或414px */  
/* 例如,以下媒体查询将确保在小于768px的屏幕宽度上,导航栏宽度为100% */  
@media (max-width: 767px) {  .fixed-nav {  left: 0;  width: 100%;  }  
}.logo img {  /* Logo 的样式,例如宽度、高度等 */  width: 50px;  height: 50px;  }  .title {  /* "72游戏" 的样式 */  font-size: 18px;  font-weight: bold;  margin: 0 10px;  }  .download-btn {  /* "点击下载" 按钮的样式 */  padding: 5px 10px;  background-color: #ff8100;  color: #fff;  border-radius: 4px;  text-decoration: none;  transition: background-color 0.3s ease;  }  .download-btn:hover {  background-color: #0056b3;  }  iframe {  position: absolute; /* 或者使用 relative/fixed/sticky,取决于你的布局需求 */  top: 0px; /* 确保 iframe 在导航下方开始 */  left: 0;  width: 100%;  height: calc(100% - 0px); /* 减去导航的高度 */  border: none;  z-index: 1; /* 默认情况下不需要设置,但如果iframe内容有z-index,则需要确保这个值低于导航 */  }  </style>  
</head>  
<body>  <div class="fixed-nav">  <div class="logo"><img src="/icon.png" alt="img" alt="手游盒子"></div>  <div class="title">H5游戏盒子</div>  <a href="/" class="download-btn">点击下载</a>  </div> <iframe  src="外链" frameborder="0"></iframe> </div>  
</body>  

这篇关于帝国CMS二次开发H5手游如何让同一个url 不同的模板的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1077117

相关文章

利用Python打造一个Excel记账模板

《利用Python打造一个Excel记账模板》这篇文章主要为大家详细介绍了如何使用Python打造一个超实用的Excel记账模板,可以帮助大家高效管理财务,迈向财富自由之路,感兴趣的小伙伴快跟随小编一... 目录设置预算百分比超支标红预警记账模板功能介绍基础记账预算管理可视化分析摸鱼时间理财法碎片时间利用财

如何在 Spring Boot 中实现 FreeMarker 模板

《如何在SpringBoot中实现FreeMarker模板》FreeMarker是一种功能强大、轻量级的模板引擎,用于在Java应用中生成动态文本输出(如HTML、XML、邮件内容等),本文... 目录什么是 FreeMarker 模板?在 Spring Boot 中实现 FreeMarker 模板1. 环

关于MongoDB图片URL存储异常问题以及解决

《关于MongoDB图片URL存储异常问题以及解决》:本文主要介绍关于MongoDB图片URL存储异常问题以及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录MongoDB图片URL存储异常问题项目场景问题描述原因分析解决方案预防措施js总结MongoDB图

Java使用SLF4J记录不同级别日志的示例详解

《Java使用SLF4J记录不同级别日志的示例详解》SLF4J是一个简单的日志门面,它允许在运行时选择不同的日志实现,这篇文章主要为大家详细介绍了如何使用SLF4J记录不同级别日志,感兴趣的可以了解下... 目录一、SLF4J简介二、添加依赖三、配置Logback四、记录不同级别的日志五、总结一、SLF4J

Java 正则表达式URL 匹配与源码全解析

《Java正则表达式URL匹配与源码全解析》在Web应用开发中,我们经常需要对URL进行格式验证,今天我们结合Java的Pattern和Matcher类,深入理解正则表达式在实际应用中... 目录1.正则表达式分解:2. 添加域名匹配 (2)3. 添加路径和查询参数匹配 (3) 4. 最终优化版本5.设计思

IDEA自动生成注释模板的配置教程

《IDEA自动生成注释模板的配置教程》本文介绍了如何在IntelliJIDEA中配置类和方法的注释模板,包括自动生成项目名称、包名、日期和时间等内容,以及如何定制参数和返回值的注释格式,需要的朋友可以... 目录项目场景配置方法类注释模板定义类开头的注释步骤类注释效果方法注释模板定义方法开头的注释步骤方法注

MySQL中慢SQL优化的不同方式介绍

《MySQL中慢SQL优化的不同方式介绍》慢SQL的优化,主要从两个方面考虑,SQL语句本身的优化,以及数据库设计的优化,下面小编就来给大家介绍一下有哪些方式可以优化慢SQL吧... 目录避免不必要的列分页优化索引优化JOIN 的优化排序优化UNION 优化慢 SQL 的优化,主要从两个方面考虑,SQL 语

C++中函数模板与类模板的简单使用及区别介绍

《C++中函数模板与类模板的简单使用及区别介绍》这篇文章介绍了C++中的模板机制,包括函数模板和类模板的概念、语法和实际应用,函数模板通过类型参数实现泛型操作,而类模板允许创建可处理多种数据类型的类,... 目录一、函数模板定义语法真实示例二、类模板三、关键区别四、注意事项 ‌在C++中,模板是实现泛型编程

Android WebView无法加载H5页面的常见问题和解决方法

《AndroidWebView无法加载H5页面的常见问题和解决方法》AndroidWebView是一种视图组件,使得Android应用能够显示网页内容,它基于Chromium,具备现代浏览器的许多功... 目录1. WebView 简介2. 常见问题3. 网络权限设置4. 启用 JavaScript5. D

如何通过海康威视设备网络SDK进行Java二次开发摄像头车牌识别详解

《如何通过海康威视设备网络SDK进行Java二次开发摄像头车牌识别详解》:本文主要介绍如何通过海康威视设备网络SDK进行Java二次开发摄像头车牌识别的相关资料,描述了如何使用海康威视设备网络SD... 目录前言开发流程问题和解决方案dll库加载不到的问题老旧版本sdk不兼容的问题关键实现流程总结前言作为