Image encapsulation inside the Bootstrap card (v2022)

PHPMaker General Discussion (PHPMaker)
1

Hi,
I’m trying to use cards and I want to encapsulate image inside the card. I tried the following code but without success inside “Custom Templates > CustomTemplateCards”:

<div class="card h-100" style="background-color: #FFFAFA;">
  <div class="row g-0">
    <div class="col-sm-6">
    	<div class="widget-user-image">
    		<img class="img-fluid" src='{{: {{{dbvalue Image}}} }}'>
    	</div>
    </div>
    <div class="col-sm-6">
      <div class="card-body">
        <h5 class="card-title">{{{AreaTrab}}}</h5>
        <p class="card-text"><small class="text-muted">{{{DReg}}}</small></p>
        <p class="card-text">{{{Inativo}}}</p>
      </div>
    </div>
  </div>
</div>

I’m using PhpMaker 2022.
I’ve already tried searching the forum and the PhpMaker documents but I’m not finding the solution.
Can you help me?

2

The DbValue means the original value that stored in database. Double check the value you get from database, and if it does not include the path to the image, then you need to add the path, too, so that the image can be displayed properly.

3

Thanks for your reply.My image field is “Logo” and I already tried it like this:

<img class="img-fluid" src='{{: {{{dbvalue Logo}}} }}'>

and I’ve also tried it like this:

<img class="img-fluid" src='files/{{: {{{dbvalue Logo}}} }}'>

and none work. I went to inspect it in the browser and the name of the image does not appear

4

According to the docs, {{{dbvalue field}}} is:
For use in CustomTemplateBody (List/Delete pages), CustomTemplateHeader/Body/Footer (Summary pages) or in CustomTemplate (other pages) only. NOT applicable to other Custom Templates.It cannot be used in CustomTemplateCard, which is not a JsRender template. Yoy may use PHP directly, e.g. <img … src=“<?= $Page->Logo->DbValue ?>”>.

5

Hi,
Thank you… it works.
My code:

<div class="card h-100" style="background-color: #FFFAFA;">
  <div class="row g-0">
    <div class="col-sm-6">
    	<div class="widget-user-image">
    		<img class="img-fluid" src="files/<?= $Page->Logo->DbValue ?>">
    	</div>
    </div>
    <div class="col-sm-6">
      <div class="card-body">
        <h5 class="card-title">{{{AreaTrab}}}</h5>
        <p class="card-text"><small class="text-muted">{{{DReg}}}</small></p>
        <p class="card-text">{{{Inativo}}}</p>
      </div>
    </div>
  </div>
</div>