html - 如何使用 freemarker 模板和 hippo cms 将图像放入我的 html 代码中?

标签 html css content-management-system freemarker hippocms

我正在寻求帮助。我在一个元素中,我需要将图像上传到一个用 html 编码的 freemarker 模板 (.ftl)。我正在使用 hippo cms 控制台创建站点地图等。我需要在我的元素中使用本地镜像(来自元素目录),但它们采用的 URL 来自 localhost:8080/site/images。但我不知道 localhost:8080/site 在我的元素中或它引用的位置。

代码如下:

所以,

  <img src='https://99designs-start-attachments.imgix.net/alchemy-pictures/2016%2F02%2F22%2F04%2F07%2F21%2F9757e437-5ec1-4378-804f-ca0f9567c110%2F380048_Widakk.png?auto=format&ch=Width%2CDPR&w=250&h=250' class="agoraIcon"/>

这里我使用的是互联网图片,它工作正常,但我需要使用我的站点/freemarker/images/agoraLogo.PNG 中的图片。

这是元素结构:

<!doctype html>
<html>

<head>
  <style type="text/css">
    body {
      font-family: Verdana;
    }
    
    .login {
      color: white;
      padding: 1%;
      background-color: #2B516B;
    }
    
    .contButton {
      padding: 0.5%;
      padding-left: 4%;
      padding-right: 4%;
      color: white;
      background-color: black;
      text-align: center;
      font-family: Verdana;
      border-radius: 10px;
    }
    
    .agoraIcon {
      height: 50px;
      width: 200px;
    }
    
    .content {
      text-align: center;
    }
    
    .credentials {
      padding: 0.5%;
      font-family: Verdana;
      border-radius: 10px;
    }
    
    #year {
      text-align: center;
    }
  </style>
</head>

<body>
  <img src='https://99designs-start-attachments.imgix.net/alchemy-pictures/2016%2F02%2F22%2F04%2F07%2F21%2F9757e437-5ec1-4378-804f-ca0f9567c110%2F380048_Widakk.png?auto=format&ch=Width%2CDPR&w=250&h=250' class="agoraIcon" />
  <div class="login" id="year">2018</div>

  <div class="content">
    <p><b>Inicia sesión con tu <br>cuenta de concesión</b></p>
    <input type="text" class="credentials" placeholder="Email" />
    <input type="password" class="credentials" name="psw" placeholder="Contraseña" />
    <div>
      <a href="http://localhost:8080/site/welcome" type="button">
        <button class="contButton" type="submit"> Continuar </button>
      </a>
    </div>
  </div>
</body>

</html>

图片目录

enter image description here

最佳答案

改变这个:

<img src='https://99designs-start-attachments.imgix.net/alchemy-pictures/2016%2F02%2F22%2F04%2F07%2F21%2F9757e437-5ec1-4378-804f-ca0f9567c110%2F380048_Widakk.png?auto=format&ch=Width%2CDPR&w=250&h=250' class="agoraIcon"/>

到:

<img src='../images/agoraLogo.PNG' class="agoraIcon"/>

关于html - 如何使用 freemarker 模板和 hippo cms 将图像放入我的 html 代码中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51319608/

相关文章:

css - 断言每个选定的 div 元素

用于显示后代的 CSS 选择器无法正常工作

python - Pinax 如何添加新页面?

php - 如何在 phtml 模板中调用 Magento block ?

java - 基于 Java 的开源框架具有许多开箱即用的常用功能?

javascript - HTML5 Data-* 属性未按预期工作

javascript - 获取/设置 iframe 内容的问题

javascript - 根据innerText更改HTML表格单元格值

javascript - Foundation 只响应一定的宽度

javascript - 如何修复深色模式无法跨多个 html 页面保留的问题?