# Glide is restricting display of placehold.co URLs

**URL:** <https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030>\
**Category:** Report a Bug\
**Created:** [September 1, 2024, 12:23pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030 "2024-09-01T12:23:52Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)\
**Post date:** [September 1, 2024, 12:23pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/1 "2024-09-01T12:23:52Z")

</div>

Glide is prohibiting the display of [placehold.co](http://placehold.co) URLs due to missing OpenGraph tags even though these tags **are** present. Below are sample image URLs and and a description to document the issue:

**Placeholder image generated by [dummyimage.com](http://dummyimage.com)**

```auto
![](upload://nZ9pEUA5KbAzcNHRn9dq1UERBUV.png)

```

 ![](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/a/8/a81ba17fb4f52d1b6c4c3d9137ef860b06823475.png)  
**Placeholder image generated by [Placehold.co](http://Placehold.co)**

```auto
https://placehold.co/960x540/ebebeb/000?text=372&font=roboto

```

 ![Screenshot 2024-09-01 at 6.42.16 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/a/0a3a39f5dd458e0efd83da6aadcc33a86494fb20.png)

You’ll see the dummyimage URL displays without issue, but we get an error msg when using the placehold URL stating there are OpenGraph tags missing.

However, if you look at the source of [placehold.co](http://placehold.co) the referenced og:tags are clearly present:

 ![Screenshot 2024-09-01 at 6.55.53 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/d/2df22312d52d2a305727e9a772b11c2e3e536944.png)

 ![Screenshot 2024-09-01 at 6.56.25 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/a/ca3bc8677fd868704411175995738411fcb308d6.png)

Our use case is we need to display a series of metrics in an analytics dashboard and we can’t use the Big Numbers component because of the lack of actions and inability to display BNs in a Collection. Instead, we’re using a Template column to dynamically create these placeholder images to display individual data points inside a Collection component.

Thank you in advance for your time and assistance to fix this bug. 🙏

---

<div class="post-metadata">

**Author:** ![Eric\_Penn](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/eric_penn/32/73888_2.png) [@Eric\_Penn](https://community.glideapps.com/u/Eric_Penn)\
**Post date:** [September 1, 2024, 12:36pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/2 "2024-09-01T12:36:26Z")

</div>

One workaround is to make your own big number with html in a rich text component and then put the rich text in a custom collection.

One of the v88’s shared this one

```auto

<p style =";border-width:1px; border-style:solid; border-color:#DCDCDC;padding: 1em;border-radius: 10px;text-align:left"><b>Notes</b>

```

---

<div class="post-metadata">

**Author:** ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)\
**Post date:** [September 1, 2024, 2:26pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/3 "2024-09-01T14:26:43Z")

</div>

@Eric_Penn I appreciate you reaching out and making the suggestion…a good workaround. The issue we’re having is the continued limitations of the custom collection component — as [outlined here](https://community.glideapps.com/t/ability-to-customize-layout-of-custom-collection/72740) — and use of the CC component would break the overall design of our app as @Jeff_Hager points out in that thread.

Can’t style a custom collection using `Design > Width > Narrow`. Ugh. Can’t put a custom collection in a container to restrict width. Ugh and a sigh.

Thanks again for the suggestion though! We’ll likely use v88’s styling suggestion and just manually set actions to individual RTs to mimic a collection as a workaround for now until things change. 🙏

**Our temporary workaround using HTML and RT components:**

 ![Screenshot 2024-09-01 at 9.53.44 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/e/7e1e09bf929fdaaf35e24c10df4da29f871a44e8.png)

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [September 1, 2024, 3:18pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/4 "2024-09-01T15:18:11Z")

</div>

That’s weird [placehold.co](http://placehold.co) doesn’t work. Place-hold.it has the same setup (without the extension) but it works.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/2/428f530edb6be84277ef192f5c32924453e8b603.jpeg)

I haven’t found a way to change the font family though.

---

<div class="post-metadata">

**Author:** ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)\
**Post date:** [September 2, 2024, 10:14am UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/5 "2024-09-02T10:14:56Z")

</div>

Hey @ThinhDinh. I appreciate you recommending place-hold.it and testing that it indeed works. Yeah, the lack of font control is kind of a deal breaker for us. I think we’re going to stick with the design you see above for now (even though it’s more work and maintenance) with the hopes Glide will allow for more control over custom collections in the future. Thx again.

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [September 2, 2024, 2:20pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/6 "2024-09-02T14:20:42Z")

</div>

Ask ChatGPT for some javascript. Generating images like this is not overly complicated. You can ask for javascript that will take in text as a parameter and return an image uri. That coded uri can then be used anywhere you display an image…as an image. Completely removes the need for any third party services, which are basically doing the same thing your javascript would. Then you can tweak it to show text in the format you want.

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [September 3, 2024, 12:11am UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/7 "2024-09-03T00:11:47Z")

</div>

Here you go.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/b/1/b11f857dcb43a3a3649fc89b1fae99557e38790f.png)

```auto
function generateImageURI(text, options = {}) {
  // Set default values
  const {
    width = 960,
    height = 540,
    backgroundColor = 'ebebeb',
    textColor = '000',
    font = 'Roboto',
    fontSize = 100, // Fixed font size in pixels
    fontWeight = 'bold'
  } = options;

  // Create a canvas element
  const canvas = document.createElement('canvas');
  canvas.width = width;
  canvas.height = height;
  const ctx = canvas.getContext('2d');

  // Draw background
  ctx.fillStyle = `#${backgroundColor}`;
  ctx.fillRect(0, 0, width, height);

  // Set up text
  ctx.fillStyle = `#${textColor}`;
  ctx.textAlign = 'center';
  ctx.textBaseline = 'middle';
  ctx.font = `${fontWeight} ${fontSize}px ${font}, sans-serif`;

  // Draw text
  ctx.fillText(text, width / 2, height / 2);

  // Convert canvas to data URI
  return canvas.toDataURL('image/png');
}

return generateImageURI(p1)

```

Set p1 to the column where you store the text you want to display. Thanks to Jeff for the idea.

---

<div class="post-metadata">

**Author:** ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)\
**Post date:** [September 3, 2024, 11:37am UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/8 "2024-09-03T11:37:01Z")

</div>

Thx, @Jeff_Hager. I’ll give this a try and see if I can achieve the same result as what I’ve shown above. I appreciate the suggestion. 👍

---

<div class="post-metadata">

**Author:** ![gannonatwork](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/gannonatwork/32/91717_2.png) [@gannonatwork](https://community.glideapps.com/u/gannonatwork)\
**Post date:** [September 3, 2024, 11:40am UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/9 "2024-09-03T11:40:13Z")

</div>

@ThinhDinh This is awesome! I appreciate you testing out the concept and posting the resulting layout and javascript. Quick question — did you end up using ChatGPT to generate or did you write it yourself? Thx again, very kind of you to continue to provide input on this. 👍

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [September 3, 2024, 2:46pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/10 "2024-09-03T14:46:33Z")

</div>

I almost exclusively use Claude these days to generate code. You can get OpenAI, Claude, LLaMA and other models on Abacus’ ChatLLM at $10, I think that’s a great deal.

---

<div class="post-metadata">

**Author:** ![system](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/system/32/53398_2.png) [@system](https://community.glideapps.com/u/system)\
**Post date:** [March 2, 2025, 2:46pm UTC](https://community.glideapps.com/t/glide-is-restricting-display-of-placehold-co-urls/76030/11 "2025-03-02T14:46:57Z")

</div>

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.