Question

我已经在index.php文件中直接更改了我的Joomla模板中的背景图像以及标题图像。我改变了图像src。我的问题是，当我在平板电脑或手机上打开网站时，这些2张图片丢失，但桌面上没有问题。我已经浏览了@media查询中的所有内容，但无法找到问题。拜托，我需要帮助！她用index.php代码

<?php
/**
* Date         July  31, 2014
* Copyright    Copyright (C) 2014 10templates.com
* License  GPL
*/
defined( '_JEXEC' ) or die;

$app = JFactory::getApplication();
$doc = JFactory::getDocument();

$this->language = $doc->language;
$this->direction = $doc->direction;

JHtml::_('bootstrap.framework');

?>
<?php include_once("analyticstracking.php") ?>
<!DOCTYPE html>
html xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this-  >language; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo     $this->template ?>/css/template.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=3.0, user-scalable=yes"/>
<meta name="HandheldFriendly" content="true"/>
<meta name="apple-mobile-web-apple-capable" content="true"/>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/menu.js"></script>
<!--script src="/media/jui/js/bootstrap.min.js" type="text/javascript">   </script>
 <script src="/media/jui/css/bootstrap.min.css" type="text/css"></script--> 

 </head>
 <body>
 <!--main container -->
 <div class="container-fluid"> 

 <!--Begin header-->
 <div class="header">
 <div class="header-inner">
 <jdoc:include type="modules" name="position-2" style="none" />
 <header class="jumbotron">
 <img src="http://localhost/joomla/images/utv_pics/utv_transparent.gif" style="max-width:90%">
 <!--Begin Navbar-->
 <?php if ($this->countModules('position-1')) : ?>
 <div class="nav2">
      <!--button type="button" class="navbar-toggle" data-toggle="collapse" data-target="nav2">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      </button>
    <a class="brand" href="index.php"><?php echo $sitename ?></a>
  <div class="collapse nav-collapse" id="nav2"-->
  <jdoc:include type="modules" name="position-1" style="none" />

  <!--End navbar-->
  <?php endif; ?>
  </header></div></div></div>

  <div class="container-fluid"> 
  <div class="clearfix">
  <div class="leftCont">
  </div>

  <div id="content" role="main">

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

  <!-- Begin Content -->
  <div class="insider">

  <jdoc:include type="component" />
  <jdoc:include type="modules" name="position-3" style="none" />
  </div>
  <!-- End Content -->

  </div>

  <div class="rightCont">
  <div class="clearfix">
  </div></div></div></div>
  <div class="container-fluid">
  <footer class="clearfix">
  <section>
  <?php if ($this->countModules('position-4')) : ?>
  <jdoc:include type="modules" name="position-4" style="xhtml" />
  <?php endif; ?>
  </section>
  <section>
  <?php if ($this->countModules('position-5')) : ?>
  <jdoc:include type="modules" name="position-5" style="xhtml" />
  <?php endif; ?>
  </section>
  <section>
  <?php if ($this->countModules('position-6')) : ?>
  <jdoc:include type="modules" name="position-6" style="xhtml" />
  <?php endif; ?>

  </section>
  </footer>
 </div></div>

 </body>
 </html>

Answer 1

您已添加本地图片网址：

<img src="http://localhost/joomla/images/utv_pics/utv_transparent.gif" style="max-width:90%">

正如您所看到的，URL指向localhost，这是您的本地开发工作站。该地址不适用于其他设备。

您应该使用baseurl属性：

<img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/images/utv_pics/utv_transparent.gif" style="max-width:90%">

并确保您的图片utv_transparent.gif位于当前模板文件夹中的images / utv_pics文件夹中。

Answer 2

您的图像位置错误，适用于本地主机，即仅限您的PC。

而不是

＆＃13;

<img src="http://localhost/joomla/images/utv_pics/utv_transparent.gif" style="max-width:90%">

＆＃13;

只需使用此

即可

＆＃13;

<img src="/images/utv_pics/utv_transparent.gif" style="max-width:90%">

＆＃13;

Joomla模板背景和标题图片

2 个答案: