Cards/ Teaser boxes - All types for display
Cards/ Teaser boxes provide short information to encourage users to click through to the full article.
They capture attention with intriguing headlines or visuals, prompting further exploration of the website.
The cards can contain: image, title, short description, taxonomy tag and CTA buttons.
The cards can be displayed in a grid of 3 cards in a row, 2 cards in a row and in a slider.
The cards can be created manually, or taken automatically from the websites content and articles pages.
View our following types of cards:
BentoBox (slider row only) | Card List for News (vertical list)
Grid of 3 cards in each row or slider row:
Story | Story Neutral | Porthole | Minimal | Profile | Quote | News | Event Image
Grid of 2 cards in each row:
Classic | Classic Neutral | Moment | Infographic | Contact Card
Additional Features: Download Section | Area Link Circles | Area Link Rectangles | Teaser Cards Grid
Bento-Box cards
Responsive carousel designed to display multiple cards in a variety of layouts and sizes. Some cards may include an image, while others may not.
The cards are arranged in a horizontal row within the slider. The slider arrows appear based on screen size, becoming visible when the cards extends beyond the page layout.
Each card include:
- Title (mandatory; no character limit)
- Taxonomy tag (optional)
- Image (available in selected layouts)
- CTA button (mandatory) - The card must include a destination link. Text cannot be displayed independently without link.
Cards can be created in two ways:
Dynamically pulled (automated) from the lobby page (Feature Stories, Latest News, Patient Stories) or created manually.
Background Options
- Green (primary): Taxonomy tags, if present, will appear in white.
or - Gray: Taxonomy tags, if present, will appear in green.
BentoBox dynamically pulled (automated) from the lobby page
- Article cards pulled from the lobby page, either directly or by taxonomy tags, by choice.
- Cards are displayed in a fixed grid with either green or gray backgrounds (these styles cannot be mixed within the grid).
- Each card will display only an article title with an indicator arrow next to it.
-
For card types that include an image, the image is taken from the article (If no article image is available, a predefined fallback image will be displayed).
- The display order can be manually adjusted if needed within the fixed grid.
- Newly published articles on the lobby page are automatically added to the carousel, ordered by publication date (newest first).
Looking Ahead to a Greener Future
We are all in for better health
Making Connections for the Health of People
Water is the elixir of life
Picture this: ‘Our very own Teva Instagram’
Teva Drives Progress to Address Pressing Global Health
Generic Medicines and R&D
Smart tech devices provide a sense of community
This is the biggest challenge
New Partnership to Improve Care
Life Effects - Article page
How I Use Self-care with MS
How Doing Less Helps Me Achieve More with Depression
Why I Changed My Mind about Online Therapy
Life Effects - Podcast article page
From Pain to Poem: Two Poems about Living with Migraine
Safely Exercising with Asthma during Pregnancy
When You're a Caregiver with a Chronic Illness
Nutrition tips for Mental Health
Tips for Dealing with Anxiety
BentoBox Manually Created Cards
- Cards can lead to any destination, not limited to articles.
- Card position within the carousel is flexible, with no fixed grid structure.
- It is possible to mix background colors (that is, combine green and gray cards within the same row).
-
The CTA button is displayed as an arrow indicator (by default) next the title (even if it is added description text below the card title).
- For manually created cards only -
- For card types include an image - the image needs to be added manually.
- It is possible to use one of the available button styles instead, at the bottom of the card, instead the arrow indicator.
- It is possible to include description text below the card title (plain text only). However, the CTA arrow indicator (by default) will appear next to the title.
Card type: Image. Created manually, and contains image acroos the card, title and CTA button by arrow indication
Card type: Stacked. Created manually on a green background. The card does not contain an image
Card type: Stacked. Created manually on a gray background. The card does not contain an image
Card type: Stacked. Created manually on a gray background. The card does not contain an image
Card type: Stacked. Created manually on a green background. The card does not contain an image
Card type: Normal. Created manually, contains image, Green background, title and CTA button
Card type: Wide. Created manually, contains image, Gray background, title and CTA button
Card Story
The Card type: Story shows a rectangular image on a dominant brand background color.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
The Story cards can created manually, and can automatically pulled from the latest news (lobby page).
The card position display on the page layout is narrow (column),
unless it is a slider from the latest news (lobby) then recommended in a wide display.
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), objects (bubbles) on the image of icon/ text, and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 322 x 190 (normal) pixels / 644 x 380 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Story cards with images
Card 2 Story type, up to 150 characters
Subtitle - plain field, up to 150 characters
Objects
text
Story cards - without images
Card 2 Story type, up to 150 characters▼
Subtitle - plain field, up to 150 characters▼
Card 3 Story type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card Story in slider (pulled from the lobby page)
Circle objects
for text/icon
Image Objects
Circle Text
Card Story Neutral
The Card type: Story Neutral shows a rectangular image on a neutral background color.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
The Story Neutral cards can created manually, and can automatically pulled from the latest news (lobby page).
The card position display on the page layout is narrow (column),
unless it is a slider from the latest news (lobby) then recommended in a wide display.
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 322 x 190 (normal) pixels / 644 x 380 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Story Neutral cards with images
Card 1 Story Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Story Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 3 Story Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Story Neutral cards - without images
Card 1 Story Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Story Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 3 Story Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Story Neutral in slider (pulled from the lobby page)
Circle objects
for text/icon
Image Objects
Circle Text
Card List for News (Vertical items)
The Card List displays rectangular items arranged vertically.
It is primarily designed for News article cards.
Each card includes title (mandatory), CTA button (shown as link, mandatory), and date (mandatory) displayed inside a circle.
The circular date is available in three size options: small, medium, or large.
The cards can be created manually or automatically populated from the latest news on the Lobby page.
In the page layout, the Card List appears in a narrow column format, and you can predefine the number of items displayed in the vertical list.
Character limits:
- Automatically pulled cards (from the Lobby page): up to 150 characters.
- Manually created cards: no character limit.
Please note, this component temporarily does not support right-to-left websites in Hebrew/Arabic.
Card list - small circles
Protecting Our Planet
Making Connections for the Health of People
Card list - Medium circles
Protecting Our Planet
Making Connections for the Health of People
Card list - Large circles
This is an example of a manually card. It contains a title with no character limit and a large circle date. However, for large circle, it is recommended to add long text so that it aligns with the circle size.
Card News
The Card type: News shows square box on a neutral background, without an image.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
The News cards can created manually, and can automatically pulled from the latest news (lobby page).
The card position display on the page layout is narrow (column),
unless it is a slider from the latest news (lobby) then recommended in a wide display.
The card can contain: title (mandatory), taxonomy tag (optional), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
News cards without images
Card 3 News type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card News in slider (pulled from the lobby page)
Card Event Image
The Card type: Event Image shows vertically blurred image at the backgrounds.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
The Event Image cards contain: Date (optional), title (mandatory), taxonomy tag (optional),
image (mandatory), subtitle (optional), and CTA button
These cards can created manually, and can automatically pulled from the latest news/ Feature stories (lobby page).
The card position display on the page layout is narrow (column),
unless it is a slider from the latest news (lobby) then recommended in a wide display.
The title is limited to up to 150 characters.
Image dimensions: 498 x 280 (normal) pixels / 996 x 560 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Event Image cards
Card 1 Event Image type, up to 150 characters
Optional for subtitles (rich text) without character limit
Event image in slider (pulled from the lobby page)
Card Porthole
The Card type: Porthole shows a moment image on a dominant brand background color.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 540 x 540 (normal) pixels / 1080 x 1080 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Porthole cards with images
Card 1 Porthole type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 3 Porthole type, up to 150 characters
Subtitle - plain field, up to 150 characters
Porthole cards without images
Card 1 Porthole type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Porthole type, up to 150 characters
Subtitle field - up to 150 characters
Card 3 Porthole type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card Minimal
The Card type: Minimal shows a circle or rectangle image on a transparent background.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 540 x 540 (normal) pixels / 1080 x 1080 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Minimal cards with Circle images
Card 1 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 3 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Minimal cards with Rectangle images
Card 1 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 3 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Minimal cards without images
Card 1 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 3 Minimal type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card Profile
The Card type: Profile shows circular image on a transparent background.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 400 x 400 pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Profile cards with images
Card 1 Profile type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Profile type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 3 Profile type, up to 150 characters
Subtitle - plain field, up to 150 characters
Profile cards without images
Card 1 Profile type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Profile type, up to 150 characters
Card 3 Profile type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card Quote
The Quote Card shows a Circular Image. The card contains image, text, a quote but without a button.
On a page, this card uses 3 cards in a row, or as a slider.
The Card type: Quote shows circular image on a transparent background.
This card is displayed in a grid of 3 cards in a row, in the static view or in the slider.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), image (optional), subtitle (optional), description (optional), quote text (mandatory), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 220 x 220 (normal) pixels / 440 x 440 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Quote cards with images
Card 1 Quote type, up to 150 characters
Subtitle - plain field, up to 150 characters
Additional description text (rich text), unlimited characters.
In this type of card - the title field is often used for the name of the person,
The subtitle field is often used to describe their role,And the third field, which is mandatory - is a rich text type, is used to display the quote
Card 2 Quote type, up to 150 characters
Subtitle - plain field, up to 150 characters
Additional description text (rich text), unlimited characters.
In this type of card - the title field is often used for the name of the person,
The subtitle field is often used to describe their role,And the third field, which is mandatory - is a rich text type, is used to display the quote
Card 3 Quote type, up to 150 characters
Subtitle - plain field, up to 150 characters
Additional description text (rich text), unlimited characters.
In this type of card - the title field is often used for the name of the person,
The subtitle field is often used to describe their role,And the third field, which is mandatory - is a rich text type, is used to display the quote
Quote cards without images
Card 1 Quote type, up to 150 characters
Subtitle - plain field, up to 150 characters
Additional description text (rich text), unlimited characters.
In this type of card - the title field is often used for the name of the person,
The subtitle field is often used to describe their role,And the third field, which is mandatory - is a rich text type, is used to display the quote
Card 2 Quote type, up to 150 characters
Subtitle - plain field, up to 150 characters
Additional description text (rich text), unlimited characters.
In this type of card - the title field is often used for the name of the person,
The subtitle field is often used to describe their role,And the third field, which is mandatory - is a rich text type, is used to display the quote
Card 3 Quote type, up to 150 characters
Subtitle - plain field, up to 150 characters
Additional description text (rich text), unlimited characters.
In this type of card - the title field is often used for the name of the person,
The subtitle field is often used to describe their role,And the third field, which is mandatory - is a rich text type, is used to display the quote
Card Classic
The Card type: Classic shows rectangular image on a dominant brand background color.
This card is displayed in a grid of 2 cards in a row, in the static view only.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), objects (bubbles) on the image of icon/ text, and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 498 x 280 (normal) pixels / 966 x 560 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Classic cards with images
Objects
for text
Card 1 Classic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Classic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Classic cards without images
Card 1 Classic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Classic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card Classic Neutral
The Card type: Classic Neutral shows rectangular image on a neutral background color.
This card is displayed in a grid of 2 cards in a row, in the static view only.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Classic Neutral cards with images
Card 1 Classic Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Classic Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Classic Neutral cards without images
Card 1 Classic Neutral type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Classic Neutral type, up to 150 characters
Card Moment
The Card type: Moment shows moment image on a dominant brand background color.
This card is displayed in a grid of 2 cards in a row, in the static view only.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), taxonomy tag (optional), image (mandatory), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 540 x 540 (normal) pixels / 1080 x 1080 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Moment cards with images
Card 1 Moment type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Moment type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card Infographic
The Card type: Infographic shows circle image/ icon image on neutral pattern backgrounds.
This card is displayed in a grid of 2 cards in a row, in the static view only.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), taxonomy tag (optional), image (optional), subtitle (optional), and CTA button (optional).
The title and the subtitle are limited to up to 150 characters each.
Image dimensions: 210 x 210 (normal) pixels / 420 x 420 (hidpi) pixels.
Please note, it is recommended to use the Focal Point feature to align the image with the component,
as long as the image dimensions are equal to or larger than those of the component.
Infographic cards with images
Card 1 Infographic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Infographic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Infographic cards without images
Card 1 Infographic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card 2 Infographic type, up to 150 characters
Subtitle - plain field, up to 150 characters
Card Contact
The Card type: Contact shows square card on white background.
Displayed in a grid of 2 cards in a row, in the static view only.
These cards are created manually, when a position in the page layout is narrow (column).
The card can contain: title (mandatory), subtitle (optional), and CTA button (optional). However, without image and without taxonomy tag.
The title is limited to up to 150 characters, the subtitle is unlimited rich text.
Contact Cards
Card 1 Contact card type, up to 150 characters
Description text unlimited (rich text), with/ without button.
Card 2 Contact card type, up to 150 characters
Description text unlimited (rich text), with/ without button.
Teaser Cards Grid
This layout include one prominent, wide featured article in the first row, followed by a second row containing three square article cards.
All cards use a gray background only.
Articles are added manually by dragging and arranging article items. The feature does not support dynamic updates or automated content population. Minimum of 4 articles is required for display (1 featured article and 3 square cards), while the maximum number of articles is unlimited.
The component is primarily used in the Life Effects section to showcase articles and Contributor Information pages.
Each card information include the following that pulled from the article:
- Article Image
- Article title
- Reading time
- Author name, including a link to the author's detail page
- Optional article type indicator (e.g., text, video, or podcast)
-
The first article (wide card) displays CTA button. while the square article cards display an arrow icon instead of a CTA button.
Area Link Circles
Large link circles on a primary brand background color.
These link circles displayed in a static view grid of 4 circles in a row.
If more than 4 circles are added, they will be added in another row. If less than 4 circles are added, an empty space will remain.
The text on each circle can be a link and lead to another destination or display only static text. The text is adjusted to up to 100 characters.
This block can be added to a wide section on any page.
Area Link Rectangles
Square buttons link on a dominant brand background color.
These buttons are displayed in a static view, on a grid of 3 square buttons in a row.
If more than 3 squares are added, they will be added in another row. If less than 3 squares are added, an empty space will remain.
If the text on a square is long, the square will be expanded accordingly, and so will the squares in the same row be expanded accordingly.
These buttons can be added to a wide section on any page.
Download section
The Download section displays a rectangular card on the primary brand background color.
It contains a list of file links, which can be in either a single column or two columns.
Clicking on a link allows the file to be downloaded locally.
Additionally, each link is indicated by an icon of file type (PDF, Word, Excel). This indicator icon can be hidden if desired.
Download Section - Single column
Optional to free text for a short description (rich text)
Download Section - Grid of two columns
Optional to free text for a short description (rich text)
Cookie Settings