# Team showcase widget

**URL:** <https://community.elfsight.com/t/team-showcase-widget/17864>\
**Category:** Customization\
**Tags:** team-showcase\
**Created:** [July 25, 2023, 12:09pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864 "2023-07-25T12:09:46Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [July 25, 2023, 12:09pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/1 "2023-07-25T12:09:46Z")

</div>

Create a thin margin around the team showcase and other widgets.When viewed on mobile, the widgets have this look that the edges are cut off and little cramped.

 ![Screenshot 2023-07-25 at 14.06.22](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/2X/c/cbae0ae872e2009c30bcc30ade94f27e6c244715.jpeg)

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [July 25, 2023, 12:12pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/2 "2023-07-25T12:12:29Z")

</div>

Hi @Fleur_Alleman 👋

Could you please send us a direct link to the page where your widget is installed?

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [July 25, 2023, 12:22pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/4 "2023-07-25T12:22:24Z")

</div>

[https://www.schrama.nl/en/homeschrama](https://www.schrama.nl/en/homeschrama). Here you will find the social feed widget.

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [July 25, 2023, 12:24pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/5 "2023-07-25T12:24:55Z")

</div>

[https://www.fmgroup.fm/en/LeadershipFMGroup](https://www.fmgroup.fm/en/LeadershipFMGroup) and here the team showcase module

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [July 25, 2023, 12:30pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/6 "2023-07-25T12:30:37Z")

</div>

Thank you!

Your request is now with our devs. We’ll make sure to keep you abreast of any updates 🙂

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [July 25, 2023, 3:05pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/8 "2023-07-25T15:05:43Z")

</div>

Thank you

---

<div class="post-metadata">

**Author:** ![Masha](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/masha/32/1771_2.png) [@Masha](https://community.elfsight.com/u/Masha)\
**Post date:** [July 26, 2023, 2:29pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/9 "2023-07-26T14:29:50Z")

</div>

Hi @Fleur_Alleman!

For the Team Showcase widget you can use this code to add paddings:

```auto
[class*="WidgetBackground__ContentContainer"] {
  padding: 0 20px;
}

```

As for the [other page](https://www.schrama.nl/en/homeschrama) you shared, I can see that you have an Instagram Feed widget installed there. Are you looking to add paddings to the post grid here?

 ![Screenshot (242)](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/2X/1/1587a1e4641942a0b1433174d598eea006339a68.jpeg)

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [July 27, 2023, 11:16am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/10 "2023-07-27T11:16:09Z")

</div>

yes, I am looking to add paddings to the instagram post grid and also looking for a solution to make it responsive on mobile.

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [July 27, 2023, 11:33am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/11 "2023-07-27T11:33:15Z")

</div>

Sorry, It’s the social feed widget not the instagram feed. Instagram feed is responsive but the social feed widget is not.

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [July 27, 2023, 12:41pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/12 "2023-07-27T12:41:29Z")

</div>

![Screenshot 2023-07-27 at 14.39.40](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/2X/9/9dc9012f2ccc505b6c01f3b4645a7ca0f6a65c2d.jpeg)

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [July 27, 2023, 1:03pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/13 "2023-07-27T13:03:37Z")

</div>

Could you please send us a link to the page with the Social Feed widget?

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [August 3, 2023, 11:10am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/14 "2023-08-03T11:10:08Z")

</div>

[https://www.xlflor.com/en/current](https://www.xlflor.com/en/current)

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [August 3, 2023, 11:46am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/15 "2023-08-03T11:46:22Z")

</div>

@Fleur_Alleman thank you for the link!

Please add this CSS code to Custom CSS section and let me know if it helped 🙂

```auto
.global-styles, [class*="eapps-social-feed-"] {
  max-width: 100vw;
}

```

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [August 8, 2023, 2:46pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/16 "2023-08-08T14:46:06Z")

</div>

> [@Masha](#):
>
> ```auto
> [class*="WidgetBackground__ContentContainer"] {
> padding: 0 20px;
> }
> 
> ```

Yes, this worked. Thank you!!

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [August 8, 2023, 2:57pm UTC](https://community.elfsight.com/t/team-showcase-widget/17864/17 "2023-08-08T14:57:22Z")

</div>

![Screenshot 2023-08-08 at 16.54.01](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/2X/3/3d014773a52796446e0bf5ce591a79141e89b470.jpeg)

I have used the Teacher’s team showcase template here.Is it possible to add categories similar to company structure team showcase widget into Teacher’s template?

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [August 9, 2023, 8:09am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/19 "2023-08-09T08:09:55Z")

</div>

Hi @Fleur_Alleman, I’ve checked your widget and it seems you’ve already changed the widget layout to company structure, am I right?

I’m afraid I didn’t find a widget you showed on your screen, so if I misunderstood you, please send me the link to the page with the widget in question, I’ll be happy to help 🙂

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [August 9, 2023, 9:26am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/20 "2023-08-09T09:26:24Z")

</div>

[https://www.fmgroup.fm/en/BrandsFMGroup](https://www.fmgroup.fm/en/BrandsFMGroup)  
Here is the URL to the said page .I am using teachers template of the team showcase widget here and would like to add categories/ classification similar to the company structure template.  
Thanks for you prompt reply.

---

<div class="post-metadata">

**Author:** ![Helga](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/helga/32/1155_2.png) [@Helga](https://community.elfsight.com/u/Helga)\
**Post date:** [August 9, 2023, 9:52am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/21 "2023-08-09T09:52:48Z")

</div>

Great, thanks!

I’ve tried to switch your current layout to the first layout (which represents the Company structure template), but some elements in the widget look not as expected because of the custom CSS added to the widget:

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/2X/8/8d226734f3859d4fcf5411679bc16627c4d2b8ec.png)

By the way, do you need to keep these custom settings, or do you need the widget to look exactly as on the Company structure template?

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [August 9, 2023, 10:56am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/22 "2023-08-09T10:56:18Z")

</div>

I just removed most of the custom css code except for the rounded borders. Would like to keep the borders the same. We have brands and special brands. I am looking for a solution to add those categories to this same layout.

---

<div class="post-metadata">

**Author:** ![Fleur\_Alleman](https://avatars.discourse-cdn.com/v4/letter/f/96bed5/32.png) [@Fleur\_Alleman](https://community.elfsight.com/u/Fleur_Alleman)\
**Post date:** [August 9, 2023, 11:01am UTC](https://community.elfsight.com/t/team-showcase-widget/17864/23 "2023-08-09T11:01:54Z")

</div>

I believe I understand how to understand the classifications. Thanks for the support.

[Next page](https://community.elfsight.com/t/team-showcase-widget/17864.md?page=2)
