Adding a logo / image on DataPages

[astroboy]

I just started creating my DataPage and I would love to see a logo on top of it. Is there a way to upload an image directly in Caspio and use it on my DataPages?

[princezuko]

Hi Astroboy,

There's actually a way to add logos/images in your DataPages that are directly uploaded to Caspio. Here are the steps to do this:

1. Add a new App Parameter inside your application. This can be found on your App Overview > App Parameters > Manage
2. Under App Parameters, click on new then set a parameter name and change the data type from 'Text' to 'File'. Upload an image by clicking the add file button under 'Value' and click on save.
3. Go to your DataPage configuration and add a Header & Footer or HTML Block. Make sure to disable the HTML editor under the Advanced tab.
4. Lastly, add this HTML code and insert the app parameter between the two double quotation marks using the picker.

<img src="[*Add your app parameter here*]">

[cheonsa]

Hello, 

You may also check this howto article:

https://howto.caspio.com/tech-tips-and-articles/common-customizations/tech-tip-5-ways-to-customize-the-look-of-your-datapages/

You may go directly to Number 3 - Add your company logo.

 

Cheers!

 

[astroboy]

Thanks for all the suggestion! While exploring the platform, I also discovered the FileStor CDN which helped me a lot in displaying my images on my DataPages. Here's the link of the HowTo article if you want to learn more: https://howto.caspio.com/files-and-images/filestor-cdn/

[ParkLoey]

Hi everyone! Just wanted to add this forum thread that shows how you can get the link of an image that is stored in a filestor folder so you can use them on your application  

 

[IamNatoyThatLovesYou]

Hello Everyone, just want to mention that we have a new TechTip that you can checkout using images that will zoom in and out the image that may be useful for this.

- https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/zooming-images-in-report-datapages/

- Natoy

[autonumber]

Hello - you may refer to this forum as well.

 

[Kurumi]

Hi! Just sharing this tip. You can also use Font icons such as Font Awesome for labels.

To apply in the DataPage, follow these steps:
1. Insert Header and Footer. In the Header, insert the installation CDN

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/js/all.min.js"></script>

2. Search your icon here: https://fontawesome.com/v5/search?o=r&m=free&s=solid
3. Copy code snippets such as <i class="fas fa-users"></i>
4. Paste the code in Labels or any HTML code where you like to add an icon.

Sample Result:

References:
- https://fontawesome.com/
- https://cdnjs.com/libraries/font-awesome

[Flowers4Algernon]

This article may also be helpful as you go along: https://howto.caspio.com/tech-tips-and-articles/tech-tip-5-ways-to-customize-the-look-of-your-datapages/

[RuisiHansamu]

Hello there, there is a forum comment that can be helpful if you are using an HTML DataPage as well here: